{"_id":"@bernierllc/validators-responsive-viewport","_rev":"7-335ccc8b247719ecfd21ddd2629db1c2","name":"@bernierllc/validators-responsive-viewport","dist-tags":{"latest":"1.6.0"},"versions":{"1.0.0":{"name":"@bernierllc/validators-responsive-viewport","version":"1.0.0","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.0.0","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"ef506c5389ed157000935db72cffc75da2b378b6","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.0.0.tgz","fileCount":19,"integrity":"sha512-KCsgeJ8Vey3aNyUz6N1ArPmBEntNXgKlLQd3bTyqtirtQDvn17v5/HPmV7fjwg/zLkZ0E4d8GkGRMjV4vLToyQ==","signatures":[{"sig":"MEYCIQDkvo57q/2BohHLRwi6c+yslFbOzsCJaIqvkARgnj/pNAIhAIPO2u4HGohW3yTO96fDDXZgp4xIBF6syTavKG+LcHnf","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61159},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"965c8860f2d53584b4979073253996471fbff8cd","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"mkbernier","email":"mkbernier@gmail.com"},"_npmVersion":"11.4.2","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"24.4.1","dependencies":{"@bernierllc/validators-core":"^0.1.1","@bernierllc/validators-utils":"^0.1.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.0.0_1760227535370_0.26133078378618757","host":"s3://npm-registry-packages-npm-production"}},"1.2.0":{"name":"@bernierllc/validators-responsive-viewport","version":"1.2.0","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.2.0","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"5119416a1b2d2cb3bbca3b1e455d50b8b4f31d4c","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.2.0.tgz","fileCount":19,"integrity":"sha512-shNf+63nQYlcyPmGbofGXHPjX4845frWiUTzI525nuI6Q367BImYmF6jM6zDyHnV+SEByVMSwMLBhn7cKrcxhg==","signatures":[{"sig":"MEYCIQDhxL2ppqLH4jajSyVdo5eeQu9LfBPC/30MIl6ZAERrUAIhAOZ57Pggk0Y2+7ceUpnGbj/RvzQbzs5HYXrYkqrgdTVm","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61261},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"af7e74b3715d56d3a193e1bb6743b337c2b0df6d","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"_npmVersion":"lerna/9.0.3/node@v20.19.6+x64 (linux)","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"20.19.6","dependencies":{"@bernierllc/validators-core":"0.1.2","@bernierllc/validators-utils":"0.1.2"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.2.0_1767642372398_0.9493840596341967","host":"s3://npm-registry-packages-npm-production"}},"1.2.1":{"name":"@bernierllc/validators-responsive-viewport","version":"1.2.1","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.2.1","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"241ad3c13b731352070e99e3553cd099d5175fb8","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.2.1.tgz","fileCount":19,"integrity":"sha512-5Kb8cZbcrLg6EkmwrjXEoKApWu69g2qLKx1Yt7hM047tJ224KBtGdCA7TqE5DSQuC7FeIsekS4oXPmhjtMWdOw==","signatures":[{"sig":"MEQCICmijhUOJSUqAGgcgxo1MALsUnIaaSlk0ndi3YGPILvFAiA9efmuJ8pFS4TS9jkm7T68YHdbttjec5QRERJ1fgUB0Q==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61203},"main":"dist/index.js","_from":"file:bernierllc-validators-responsive-viewport-1.2.1.tgz","types":"dist/index.d.ts","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"_resolved":"/tmp/9c6ac4e4f9aec1cfbab294de711ec5a5/bernierllc-validators-responsive-viewport-1.2.1.tgz","_integrity":"sha512-5Kb8cZbcrLg6EkmwrjXEoKApWu69g2qLKx1Yt7hM047tJ224KBtGdCA7TqE5DSQuC7FeIsekS4oXPmhjtMWdOw==","_npmVersion":"11.11.0","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"20.20.0","dependencies":{"@bernierllc/validators-core":"0.1.3","@bernierllc/validators-utils":"0.1.3"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.2.1_1773078318046_0.12598416262130097","host":"s3://npm-registry-packages-npm-production"}},"1.2.2":{"name":"@bernierllc/validators-responsive-viewport","version":"1.2.2","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.2.2","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"28e67cd290737d6f325dd4ec8d65320e274a8881","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.2.2.tgz","fileCount":19,"integrity":"sha512-zPGQpgYktQcYs5RCqa9yLsuEXcG+wJp6nPNZNUuMxRoYsl7KfULKnTCd+1UD6XFOyd2Mm5qheYlgbmHbu7NWFw==","signatures":[{"sig":"MEYCIQC6qsobDexA1VenzwuyuMAGWMjkhh3BubM6VTCm9Wtt6AIhAN8ya4LAiZ0V8aWJxt1E3TOlZh+vlQLSzOTlDAnGBzbx","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61203},"main":"dist/index.js","_from":"file:bernierllc-validators-responsive-viewport-1.2.2.tgz","types":"dist/index.d.ts","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"_resolved":"/home/runner/work/tools/tools/packages/validators/validators-responsive-viewport/bernierllc-validators-responsive-viewport-1.2.2.tgz","_integrity":"sha512-zPGQpgYktQcYs5RCqa9yLsuEXcG+wJp6nPNZNUuMxRoYsl7KfULKnTCd+1UD6XFOyd2Mm5qheYlgbmHbu7NWFw==","_npmVersion":"11.11.0","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"20.20.0","dependencies":{"@bernierllc/validators-core":"0.1.4","@bernierllc/validators-utils":"0.1.4"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.2.2_1773163970271_0.6828061618114423","host":"s3://npm-registry-packages-npm-production"}},"1.3.0":{"name":"@bernierllc/validators-responsive-viewport","version":"1.3.0","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.3.0","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"770433bf1b9ce642681e6395714c09c294b546b8","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.3.0.tgz","fileCount":19,"integrity":"sha512-f5Fava2ahNnXxCikQequAXRWgXbKe236BoE/TaMM1hKnPe8YubUjxBHQ5dAxwQyswkvP5GHWo6nb3l0bsQ3EAg==","signatures":[{"sig":"MEUCIQDjJ82C95GPtDmXcM0UK9h779y9sFcq8EW6MugbcZedhQIgQtnghRFum/zUSbnAO2Oqh7kgUnldvbpgECYIEDniF38=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61203},"main":"dist/index.js","_from":"file:bernierllc-validators-responsive-viewport-1.3.0.tgz","types":"dist/index.d.ts","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"_resolved":"/home/runner/work/tools/tools/packages/validators/validators-responsive-viewport/bernierllc-validators-responsive-viewport-1.3.0.tgz","_integrity":"sha512-f5Fava2ahNnXxCikQequAXRWgXbKe236BoE/TaMM1hKnPe8YubUjxBHQ5dAxwQyswkvP5GHWo6nb3l0bsQ3EAg==","_npmVersion":"11.14.1","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"20.20.2","dependencies":{"@bernierllc/validators-core":"0.2.0","@bernierllc/validators-utils":"0.2.0"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.3.0_1779242204327_0.4474570095418824","host":"s3://npm-registry-packages-npm-production"}},"1.4.0":{"name":"@bernierllc/validators-responsive-viewport","version":"1.4.0","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","_id":"@bernierllc/validators-responsive-viewport@1.4.0","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"dist":{"shasum":"9eca9ae98a742b70d0392a02d9fa912038e16b69","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.4.0.tgz","fileCount":19,"integrity":"sha512-tYf8V9A0JXXznzKELfhtRKKQny3RSt9mAX0mb7TCDNP41T+Z6zaZ5/lXU3VNQPhKO45+h9V8rNtp8afab4kjHg==","signatures":[{"sig":"MEYCIQDSdsihwFeqDCm+u2BDAgU47pmDNWn6k3+MAigYRoKx8gIhALTH6Icq0tPk9Wq4ZDKNrxFvoSCGLLOYr5uBazY8qLO5","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61203},"main":"dist/index.js","_from":"file:bernierllc-validators-responsive-viewport-1.4.0.tgz","types":"dist/index.d.ts","scripts":{"lint":"eslint src/**/*.ts","test":"jest --watch","build":"tsc","clean":"rm -rf dist","test:run":"jest","test:coverage":"jest --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"_resolved":"/home/runner/work/tools/tools/packages/validators/validators-responsive-viewport/bernierllc-validators-responsive-viewport-1.4.0.tgz","_integrity":"sha512-tYf8V9A0JXXznzKELfhtRKKQny3RSt9mAX0mb7TCDNP41T+Z6zaZ5/lXU3VNQPhKO45+h9V8rNtp8afab4kjHg==","_npmVersion":"11.14.1","description":"Responsive viewport validation - overflow, tap targets, viewport meta","directories":{},"_nodeVersion":"20.20.2","dependencies":{"@bernierllc/validators-core":"0.3.0","@bernierllc/validators-utils":"0.3.0"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","eslint":"^8.56.0","ts-jest":"^29.1.2","typescript":"^5.3.3","@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/parser":"^7.0.1","@typescript-eslint/eslint-plugin":"^7.0.1"},"_npmOperationalInternal":{"tmp":"tmp/validators-responsive-viewport_1.4.0_1779250960590_0.6004250450096873","host":"s3://npm-registry-packages-npm-production"}},"1.6.0":{"name":"@bernierllc/validators-responsive-viewport","version":"1.6.0","description":"Responsive viewport validation - overflow, tap targets, viewport meta","main":"dist/index.js","types":"dist/index.d.ts","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","dependencies":{"@bernierllc/validators-utils":"0.5.0","@bernierllc/validators-core":"0.4.0"},"devDependencies":{"@types/jest":"^29.5.12","@types/node":"^20.11.19","@typescript-eslint/eslint-plugin":"^7.0.1","@typescript-eslint/parser":"^7.0.1","eslint":"^8.56.0","jest":"^29.7.0","ts-jest":"^29.1.2","typescript":"^5.3.3"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"scripts":{"build":"tsc","test":"jest --watch","test:run":"jest","test:coverage":"jest --coverage","lint":"eslint src/**/*.ts","clean":"rm -rf dist"},"_id":"@bernierllc/validators-responsive-viewport@1.6.0","_integrity":"sha512-UPzgcxnl1W3IGqz6KlfFz4GxY+U3wjFN2YNGiATI0n6ICWj5koFs8gBaV5Ib/MTpXqrL8xUnGyvzq9mTRnIvsQ==","_resolved":"/home/runner/work/tools/tools/packages/validators/validators-responsive-viewport/bernierllc-validators-responsive-viewport-1.6.0.tgz","_from":"file:bernierllc-validators-responsive-viewport-1.6.0.tgz","_nodeVersion":"20.20.2","_npmVersion":"11.14.1","dist":{"integrity":"sha512-UPzgcxnl1W3IGqz6KlfFz4GxY+U3wjFN2YNGiATI0n6ICWj5koFs8gBaV5Ib/MTpXqrL8xUnGyvzq9mTRnIvsQ==","shasum":"47a1ab11f1f1c230fd0be234da3a4b7f3b092c15","tarball":"https://registry.npmjs.org/@bernierllc/validators-responsive-viewport/-/validators-responsive-viewport-1.6.0.tgz","fileCount":23,"unpackedSize":64440,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQC2xQnVWT4OhMtw6hJH+YT3kMFjkySp0rG4jFrlb5FDWQIgGrgA0CLq3X7HE/Db7Mb7Pc5R22slI/+dXBZNruSqPx0="}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5edb179e-e3e4-4b4f-aef6-80e003b4d846"}},"directories":{},"maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/validators-responsive-viewport_1.6.0_1779252247208_0.3556162486108574"},"_hasShrinkwrap":false}},"time":{"created":"2025-10-12T00:05:35.268Z","modified":"2026-05-20T04:44:07.515Z","1.0.0":"2025-10-12T00:05:35.634Z","1.2.0":"2026-01-05T19:46:12.521Z","1.2.1":"2026-03-09T17:45:18.205Z","1.2.2":"2026-03-10T17:32:50.398Z","1.3.0":"2026-05-20T01:56:44.509Z","1.4.0":"2026-05-20T04:22:40.718Z","1.6.0":"2026-05-20T04:44:07.373Z"},"author":{"name":"Bernier LLC"},"license":"SEE LICENSE IN LICENSE","keywords":["validator","responsive","viewport","mobile","accessibility","wcag","tap-targets","overflow"],"description":"Responsive viewport validation - overflow, tap targets, viewport meta","maintainers":[{"name":"alikhan410","email":"mczeyo@gmail.com"},{"name":"mkbernier","email":"mkbernier@gmail.com"}],"readme":"# @bernierllc/validators-responsive-viewport\n\nResponsive viewport validation - viewport meta tags, tap target sizes, and overflow detection for WCAG 2.1 AA compliance.\n\n## Installation\n\n```bash\nnpm install @bernierllc/validators-responsive-viewport @bernierllc/validators-core @bernierllc/validators-utils\n```\n\n## Overview\n\nA primitive validator package for responsive design patterns validation. Ensures mobile usability through viewport meta tag validation, tap target size checking (44x44px minimum per WCAG 2.1 AA), and content overflow detection.\n\n### What It Validates\n\n- **Viewport Meta Tag**: Presence, configuration, and zoom restrictions\n- **Tap Target Sizes**: Interactive elements meet minimum 44x44px size (WCAG 2.1 AA)\n- **Content Overflow**: Fixed-width elements, tables, images, and pre-formatted text\n\n### WCAG 2.1 Compliance\n\n- Success Criterion 1.4.10: Reflow (Level AA)\n- Success Criterion 2.5.5: Target Size (Level AAA, recommended AA)\n- Mobile-first responsive design best practices\n\n## Usage\n\n### Basic Validation\n\n```typescript\nimport { validateResponsiveViewport } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nconst html = `\n  <!DOCTYPE html>\n  <html>\n    <head>\n      <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    </head>\n    <body>\n      <button style=\"width: 48px; height: 48px;\">Click Me</button>\n    </body>\n  </html>\n`;\n\nconst utils = createSharedUtils();\nconst result = await validateResponsiveViewport(html, {}, utils);\n\nif (result.problems.length > 0) {\n  console.log('Responsive viewport issues found:');\n  result.problems.forEach((problem) => {\n    console.log(`  [${problem.severity}] ${problem.message}`);\n  });\n}\n```\n\n### With Configuration Options\n\n```typescript\nimport { validateResponsiveViewport } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nconst utils = createSharedUtils();\n\nconst result = await validateResponsiveViewport(\n  html,\n  {\n    checkViewportMeta: true,\n    checkTapTargets: true,\n    checkOverflow: true,\n    minTapTargetSize: 48, // Stricter than default 44px\n    tapTargetSelectors: [\n      'button',\n      'a',\n      'input[type=\"button\"]',\n      '[role=\"button\"]',\n    ],\n  },\n  utils\n);\n```\n\n### Creating a Configured Validator\n\n```typescript\nimport { createResponsiveViewportValidator } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nconst validator = createResponsiveViewportValidator({\n  minTapTargetSize: 48,\n  checkOverflow: true,\n});\n\nconst utils = createSharedUtils();\nconst result = await validator.validate(html, utils);\n\n// Get validator metadata\nconst meta = validator.getMeta();\nconsole.log(`Validator: ${meta.name} v${meta.version}`);\nconsole.log(`Enabled rules: ${meta.enabledRules.join(', ')}`);\n```\n\n### Using Individual Rules\n\n```typescript\nimport { viewportMetaRule, tapTargetsRule } from '@bernierllc/validators-responsive-viewport';\nimport { createRuleContext } from '@bernierllc/validators-core';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nconst utils = createSharedUtils();\nconst problems = [];\n\nconst context = createRuleContext(\n  viewportMetaRule.meta.id,\n  {},\n  utils,\n  {},\n  (problem) => problems.push(problem)\n);\n\nconst validator = viewportMetaRule.create(context);\nawait validator(html);\n```\n\n## Configuration Options\n\n### ResponsiveViewportOptions\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `checkViewportMeta` | `boolean` | `true` | Check viewport meta tag presence and validity |\n| `checkTapTargets` | `boolean` | `true` | Check tap target sizes (44x44px minimum) |\n| `checkOverflow` | `boolean` | `true` | Check for overflow and horizontal scroll issues |\n| `minTapTargetSize` | `number` | `44` | Minimum tap target size in pixels (width and height) |\n| `tapTargetSelectors` | `string[]` | See below | CSS selectors for tap target elements |\n| `tapTargetExcludeSelectors` | `string[]` | See below | CSS selectors to exclude from tap target checks |\n\n**Default Tap Target Selectors:**\n```typescript\n[\n  'button',\n  'a',\n  'input[type=\"button\"]',\n  'input[type=\"submit\"]',\n  'input[type=\"reset\"]',\n  '[role=\"button\"]',\n  '[role=\"link\"]',\n  '[role=\"checkbox\"]',\n  '[role=\"radio\"]',\n  '[role=\"switch\"]',\n  '[role=\"tab\"]',\n]\n```\n\n**Default Exclude Selectors:**\n```typescript\n[\n  '[disabled]',\n  '[aria-hidden=\"true\"]',\n  '[hidden]',\n  '.visually-hidden',\n  '.sr-only',\n]\n```\n\n## Validation Rules\n\n### 1. Viewport Meta Tag (`responsive-viewport/viewport-meta`)\n\nValidates viewport meta tag presence and configuration.\n\n**Checks:**\n- Viewport meta tag presence\n- Content attribute presence\n- Zoom restrictions (user-scalable=no, maximum-scale=1)\n- width=device-width setting\n- initial-scale=1 setting\n\n**Examples:**\n\n```html\n<!-- ✅ PASS: Valid viewport meta tag -->\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\n<!-- ❌ FAIL: Missing viewport meta tag -->\n<head><title>Page</title></head>\n\n<!-- ❌ FAIL: Prevents zooming (WCAG 2.1 AA violation) -->\n<meta name=\"viewport\" content=\"width=device-width, user-scalable=no\">\n\n<!-- ⚠️ WARN: Missing width=device-width -->\n<meta name=\"viewport\" content=\"initial-scale=1\">\n```\n\n### 2. Tap Target Sizes (`responsive-viewport/tap-targets`)\n\nValidates interactive element sizes meet WCAG 2.1 AA requirements (44x44px minimum).\n\n**Checks:**\n- Button sizes\n- Link sizes\n- Input button sizes\n- Elements with button/link roles\n- Excludes hidden and disabled elements\n\n**Examples:**\n\n```html\n<!-- ✅ PASS: Valid tap target sizes -->\n<button style=\"width: 48px; height: 48px;\">Click Me</button>\n<a href=\"#\" style=\"width: 50px; height: 50px; display: block;\">Link</a>\n\n<!-- ❌ FAIL: Tap target too small -->\n<button style=\"width: 20px; height: 20px;\">Tiny Button</button>\n\n<!-- ✅ PASS: Excluded from check (disabled) -->\n<button style=\"width: 20px; height: 20px;\" disabled>Disabled</button>\n\n<!-- ✅ PASS: Excluded from check (hidden) -->\n<button style=\"width: 20px; height: 20px;\" hidden>Hidden</button>\n```\n\n### 3. Overflow Detection (`responsive-viewport/overflow-detection`)\n\nDetects content overflow and horizontal scrolling issues on mobile devices.\n\n**Checks:**\n- Fixed-width elements exceeding mobile viewport (>428px)\n- Tables without responsive wrappers\n- Images without max-width\n- Long pre-formatted text lines\n\n**Examples:**\n\n```html\n<!-- ⚠️ WARN: Fixed width may cause horizontal scrolling -->\n<div style=\"width: 800px;\">Wide content</div>\n\n<!-- ⚠️ WARN: Table without responsive wrapper -->\n<table><tr><td>Data</td></tr></table>\n\n<!-- ✅ PASS: Table with responsive wrapper -->\n<div style=\"overflow-x: auto;\">\n  <table><tr><td>Data</td></tr></table>\n</div>\n\n<!-- ⚠️ WARN: Image without max-width -->\n<img src=\"large.jpg\" width=\"800\">\n\n<!-- ✅ PASS: Responsive image -->\n<img src=\"large.jpg\" style=\"max-width: 100%; height: auto;\">\n```\n\n## Validation Result\n\nThe validator returns a `ValidationResult` object:\n\n```typescript\ninterface ValidationResult {\n  problems: Problem[];\n  stats: {\n    targets: number;\n    durationMs: number;\n    rulesApplied: string[];\n  };\n}\n\ninterface Problem {\n  ruleId: string;\n  message: string;\n  severity: 'off' | 'info' | 'warn' | 'error';\n  domain: 'accessibility';\n  location?: {\n    selector?: string;\n    xpath?: string;\n  };\n  suggestion?: string;\n  docUrl?: string;\n  tags?: string[];\n  evidence?: {\n    context?: Record<string, unknown>;\n  };\n}\n```\n\n## Integration Status\n\n- **Logger**: Not applicable (pure validation functions)\n- **Docs-Suite**: Ready - Exported TypeScript definitions and markdown documentation\n- **NeverHub**: Not applicable (primitive validator)\n\n## Examples\n\n### React Component Validation\n\n```typescript\nimport { validateResponsiveViewport } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nfunction validateComponent(componentHtml: string) {\n  const utils = createSharedUtils();\n\n  const result = await validateResponsiveViewport(componentHtml, {\n    minTapTargetSize: 44,\n    checkTapTargets: true,\n  }, utils);\n\n  return {\n    isValid: result.problems.filter(p => p.severity === 'error').length === 0,\n    errors: result.problems.filter(p => p.severity === 'error'),\n    warnings: result.problems.filter(p => p.severity === 'warn'),\n  };\n}\n```\n\n### CI/CD Integration\n\n```typescript\nimport { validateResponsiveViewport } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\nimport * as fs from 'fs';\n\nasync function validateHtmlFiles(files: string[]) {\n  const utils = createSharedUtils();\n  let totalErrors = 0;\n\n  for (const file of files) {\n    const html = fs.readFileSync(file, 'utf-8');\n    const result = await validateResponsiveViewport(html, {}, utils);\n\n    const errors = result.problems.filter(p => p.severity === 'error');\n    totalErrors += errors.length;\n\n    if (errors.length > 0) {\n      console.error(`${file}: ${errors.length} responsive viewport errors`);\n      errors.forEach(err => console.error(`  - ${err.message}`));\n    }\n  }\n\n  process.exit(totalErrors > 0 ? 1 : 0);\n}\n```\n\n### Custom Tap Target Configuration\n\n```typescript\nimport { validateResponsiveViewport } from '@bernierllc/validators-responsive-viewport';\nimport { createSharedUtils } from '@bernierllc/validators-utils';\n\nconst utils = createSharedUtils();\n\nconst result = await validateResponsiveViewport(\n  html,\n  {\n    minTapTargetSize: 48, // Stricter requirement\n    tapTargetSelectors: [\n      'button',\n      'a',\n      '[role=\"button\"]',\n      '.custom-button', // Custom selector\n    ],\n    tapTargetExcludeSelectors: [\n      '[disabled]',\n      '[aria-hidden=\"true\"]',\n      '.icon-only', // Exclude icon buttons\n    ],\n  },\n  utils\n);\n```\n\n## Dependencies\n\n- `@bernierllc/validators-core` - Core validator types and utilities\n- `@bernierllc/validators-utils` - Shared parsing and DOM utilities\n\n## Testing\n\nRun tests:\n\n```bash\nnpm test\n```\n\nRun tests with coverage:\n\n```bash\nnpm run test:coverage\n```\n\nCoverage target: **90%+** (branches, functions, lines, statements)\n\n## License\n\nCopyright (c) 2025 Bernier LLC. All rights reserved.\n\n## See Also\n\n- [@bernierllc/validators-core](../validators-core) - Core validator framework\n- [@bernierllc/validators-utils](../validators-utils) - Shared validation utilities\n- [@bernierllc/validators-a11y-contrast](../validators-a11y-contrast) - Color contrast validation\n- [WCAG 2.1 Understanding Reflow](https://www.w3.org/WAI/WCAG21/Understanding/reflow.html)\n- [WCAG 2.1 Understanding Target Size](https://www.w3.org/WAI/WCAG21/Understanding/target-size.html)\n","readmeFilename":"README.md"}