tailwind-a11y 0.2.0 → 0.3.1

package/README.md

@@ -25,6 +25,8 @@ npm install --save-dev tailwind-a11y
 npx tailwind-a11y                    # scans **/*.{jsx,tsx}
 npx tailwind-a11y "src/**/*.tsx"     # custom glob
 npx tailwind-a11y --verbose          # also reports what couldn't be checked, and why
+npx tailwind-a11y --version          # print the installed version
+npx tailwind-a11y --help             # usage and all options
 ```
 
 ```

package/dist/cli.js

@@ -1,6 +1,7 @@
 #!/usr/bin/env node
 import { readFileSync } from "node:fs";
 import { relative, sep } from "node:path";
+import { createRequire } from "node:module";
 import fg from "fast-glob";
 import { extractChecks, extractContrastSkips } from "./parser/extractClasses.js";
 import { checkContrast, checkContrastValueSkips } from "./rules/checkContrast.js";
@@ -8,6 +9,10 @@ import { extractTouchTargetChecks, extractTouchTargetSkips } from "./parser/extr
 import { checkTouchTargets } from "./rules/checkTouchTarget.js";
 import { extractFocusIndicatorChecks } from "./parser/extractFocusIndicators.js";
 import { checkFocusIndicators } from "./rules/checkFocusIndicator.js";
+import { parseArgs, getHelpText } from "./cliArgs.js";
+// ../package.json resolves correctly from both src/ (dev) and dist/ (published).
+const require = createRequire(import.meta.url);
+const { version: packageVersion } = require("../package.json");
 function formatViolation(v) {
     switch (v.type) {
         case "contrast": {
@@ -34,9 +39,15 @@ function groupByFile(items) {
     return byFile;
 }
 async function main() {
-    const args = process.argv.slice(2);
-    const verbose = args.includes("--verbose") || args.includes("-v");
-    const patterns = args.filter((a) => a !== "--verbose" && a !== "-v");
+    const { help, version, verbose, patterns } = parseArgs(process.argv.slice(2));
+    if (help) {
+        console.log(getHelpText());
+        return;
+    }
+    if (version) {
+        console.log(packageVersion);
+        return;
+    }
     const globPatterns = patterns.length > 0 ? patterns : ["**/*.{jsx,tsx}"];
     const files = await fg(globPatterns, {
         cwd: process.cwd(),

package/dist/cliArgs.d.ts

@@ -0,0 +1,8 @@
+export interface ParsedArgs {
+    help: boolean;
+    version: boolean;
+    verbose: boolean;
+    patterns: string[];
+}
+export declare function getHelpText(): string;
+export declare function parseArgs(argv: string[]): ParsedArgs;

package/dist/cliArgs.js

@@ -0,0 +1,31 @@
+// Split out from cli.ts so it's importable in tests without triggering
+// cli.ts's top-level main() call (which does real file I/O on import).
+const HELP_TEXT = `Usage: tailwind-a11y [options] [<glob>...]
+
+Static analysis for Tailwind CSS accessibility violations -- color contrast,
+touch target size, and focus indicator removal.
+
+Options:
+  -v, --verbose   Also report what couldn't be checked, and why
+  -V, --version   Print the version number
+  -h, --help      Print this help message
+
+Examples:
+  tailwind-a11y                    Scan **/*.{jsx,tsx} from the current directory
+  tailwind-a11y "src/**/*.tsx"     Scan a custom glob pattern
+  tailwind-a11y --verbose          Also report skipped/unresolvable cases
+`;
+export function getHelpText() {
+    return HELP_TEXT;
+}
+// -v/--verbose already existed before --version was added; -V (uppercase)
+// avoids colliding with it, matching a common CLI convention.
+const FLAGS = new Set(["--verbose", "-v", "--version", "-V", "--help", "-h"]);
+export function parseArgs(argv) {
+    return {
+        help: argv.includes("--help") || argv.includes("-h"),
+        version: argv.includes("--version") || argv.includes("-V"),
+        verbose: argv.includes("--verbose") || argv.includes("-v"),
+        patterns: argv.filter((a) => !FLAGS.has(a)),
+    };
+}

package/dist/parser/extractTouchTargets.js

@@ -17,6 +17,31 @@ function lastSizeToken(tokens, prefix) {
     }
     return found;
 }
+function isMeaningfulText(node) {
+    // Pure JSX-formatting whitespace (indentation/newlines between elements)
+    // doesn't count as text.
+    return !!node && t.isJSXText(node) && node.value.trim().length > 0;
+}
+// WCAG 2.5.8's "Inline" exception: a target inside a sentence or block of
+// text is exempt from the minimum size, since its size is constrained by
+// surrounding text flow rather than a deliberate layout choice. Checked via
+// the element's *immediate* siblings only (not "any text anywhere in the
+// parent") — a parent-wide check would exempt every sibling in something
+// like `<p>Choose: <button/><button/></p>` just because the first button
+// happens to sit next to text, even though the second one doesn't. That's
+// the same "shape, not meaning" failure mode as the bg-opacity-50/ring-0
+// false negatives documented in CLAUDE.md, just at the sibling level instead
+// of the token level.
+function isInlineInText(path) {
+    const parentNode = path.parentPath?.node;
+    if (!parentNode || (!t.isJSXElement(parentNode) && !t.isJSXFragment(parentNode)))
+        return false;
+    const siblings = parentNode.children;
+    const index = siblings.indexOf(path.node);
+    if (index === -1)
+        return false;
+    return isMeaningfulText(siblings[index - 1]) || isMeaningfulText(siblings[index + 1]);
+}
 export function extractTouchTargetChecks(code, filePath) {
     const ast = parseJSX(code, filePath);
     if (!ast)
@@ -39,6 +64,8 @@ export function extractTouchTargetChecks(code, filePath) {
             const heightPx = spacingScale[height.value];
             if (widthPx === undefined || heightPx === undefined)
                 return; // arbitrary/keyword/fraction — skip
+            if (isInlineInText(path))
+                return; // WCAG 2.5.8 inline exception — exempt, not a violation
             checks.push({
                 file: filePath,
                 line: opening.loc?.start.line ?? 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-a11y",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "description": "Static analysis CLI that catches WCAG accessibility violations — color contrast, touch target size, and focus indicator removal — in Tailwind CSS class combinations before they ship.",
   "type": "module",
   "bin": {