{"_id":"@a.nemreen/a11y","_rev":"7-f85298df511869bbd2d84a0750178e75","name":"@a.nemreen/a11y","dist-tags":{"latest":"0.3.0"},"versions":{"0.1.0":{"name":"@a.nemreen/a11y","version":"0.1.0","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.1.0","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"48ab162157be682dacd666b09551b977d51359e2","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.1.0.tgz","fileCount":8,"integrity":"sha512-Ch+S7TvZXtNPU5hzG+aw5phKDCUG7sYt/pcjfEhME0q/jtTdnpCbYBCty2DK9IXdMLz81wZ6uu4xGjcAd/PKzA==","signatures":[{"sig":"MEUCIFIvxxPMHhE+bhn9P2RC18vtxTlkIwKaoYAOu2ph91/UAiEAgti2E4niTmu7seoK2nJkUR0nqtVIhcCqXj8n54/NGn8=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":134601},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.1.0_1784981381275_0.7427462968626566","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@a.nemreen/a11y","version":"0.1.1","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.1.1","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"cd5ac3952dc480dd8aa62a3271fae19ccf4c261b","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.1.1.tgz","fileCount":9,"integrity":"sha512-NlZSQqVwk50AvEJx4C37FQjRRzIZ5wuwI+MjmVe7viKbgGRUn5ChePccMhX7c4E+Y1XAuvUL2V/b9kCqzEROnQ==","signatures":[{"sig":"MEUCIGfFCBBljfdCLtxJvPrVbswMJoTmJEvCafMY53EpZ9/gAiEA0mFAprzHq0tn0TO6T+2Gx1ggCPiedrdmuRKspxkzER4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1334707},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"gitHead":"bea03733b5f64528b7608a919d050181c5f3fbd0","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.1.1_1784981535854_0.4261956250657508","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@a.nemreen/a11y","version":"0.1.2","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.1.2","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"6f35fb805430dde9a28f86dd04b8a2f8f26ce9ca","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.1.2.tgz","fileCount":9,"integrity":"sha512-SvSleFP/EfX30019bhPGRaI0xhJOIzpvFKelCtOS8KFCqBAnBAsWoUVFCVCJHhXeBJrsRGE8TuOPSDTcsdHP4Q==","signatures":[{"sig":"MEYCIQCxIQ/bCzwrSaGtgay5v0Oj63bKLGJuT/moe0gPWgZUWAIhAN5B4TS6IIZ4BzFEJla4RUK6PkwKmkeWSsbH1PUM4Z3e","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1334707},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"gitHead":"bea03733b5f64528b7608a919d050181c5f3fbd0","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.1.2_1784981598946_0.8846752053053692","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@a.nemreen/a11y","version":"0.1.3","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.1.3","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"80839d0dd702719a285ad2d56c4e4f79e5347b82","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.1.3.tgz","fileCount":9,"integrity":"sha512-yVGwctZ32kCHxVNSpnzq1OPpM0vnKJx/sGvctJ5RCgzxXbhpefS24ojwovo5YolsIuJllbFMcYLYsERpBGw/Gw==","signatures":[{"sig":"MEYCIQDJCKdvWQyRfzjFKBqQSjFnHEuDBmi3Rk/RH/UPui+kgQIhAKoIZAI5wQ8sNHEFcvXnQShlGyp77C3NtC6f5c4cs6Wa","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1343428},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"gitHead":"c0d61eb2b9da1577719d5dc954757b268bb464be","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.1.3_1785046071185_0.4990434520924327","host":"s3://npm-registry-packages-npm-production"}},"0.1.6":{"name":"@a.nemreen/a11y","version":"0.1.6","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.1.6","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"502474f0d255612446a046370c89ea87eca8056f","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.1.6.tgz","fileCount":9,"integrity":"sha512-koV8YQXCl+DUyseK+MO6oZK1SRHPtfgVq1ucWjEkuy6RWHhE0uu+zBPqkOSNzLNtKci8Cmyc+bo7Nx8WiK0csA==","signatures":[{"sig":"MEUCIGgkdLdQBv9MP/PAZ5FGcNbbmVAf59yRIYgMmaZKB3itAiEAt37tTxo+jdqndohuuzJc3sUhGfLa+sLWJ0btpu7UQig=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1347505},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"default":"./dist/index.js","require":{"types":"./dist/index.d.cts","default":"./dist/index.cjs"}},"./styles.css":"./dist/styles.css"},"gitHead":"9604db00d5b7c4c384c69cb00b0b59cba045ec1d","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.1.6_1789319390170_0.19148231632822843","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@a.nemreen/a11y","version":"0.2.0","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency"],"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","_id":"@a.nemreen/a11y@0.2.0","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"homepage":"https://nemreen.info/a11y","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"e79c2bbce51fdb7822f14407aa795a1dc7827be8","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.2.0.tgz","fileCount":9,"integrity":"sha512-6SiKNx3D7RCrEOW9qgMHdE1cd1qeKrZkTRBZ5Kw08vrnkI3JiV3HRikDkIylpPHuj2cBups8byT36W7mOnCGmw==","signatures":[{"sig":"MEQCIGmqaPLsTbyjJSGO0aRy71OG4vcSqPcEVC6B2aGH0ep/AiBD1D2Rox4LojMP7Fp8P//kT4qb5WtKT2lxdA07+XL6ag==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"sig":"MEYCIQC48l1gn4fPtEiQ3soYEBq4dWkrvXAzuf25IRnih8R4nQIhALkFUnjEc7afdGVVCc5J30pc9dXiPgalgOICRrrGvH9h","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1381739},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"default":"./dist/index.js","require":{"types":"./dist/index.d.cts","default":"./dist/index.cjs"}},"./styles.css":"./dist/styles.css"},"gitHead":"97081f874caeae8ba54425ab890859eb44c26f2d","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","panel":"npm run build && npm start --prefix panel","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters. Works with Angular, React, Vue, and plain HTML.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"tmp":"tmp/a11y_0.2.0_1789549877545_0.12882952462756792","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"_id":"@a.nemreen/a11y@0.3.0","bugs":{"url":"https://github.com/nemreen/a11y/issues"},"dist":{"shasum":"5261cebbf78992b33ffd5548c983e22662bb833a","tarball":"https://registry.npmjs.org/@a.nemreen/a11y/-/a11y-0.3.0.tgz","fileCount":13,"integrity":"sha512-EBhDGPonEKAKD5mvvXDGUK5rBMaBcyOZhNu7sG3TQMIhkZfM69tplqAYOD3fYvAqYsDvrnJeEst3x7rpkFBh1w==","signatures":[{"sig":"MEYCIQDYe+WzmlkdMlpwThJzG5cCKqND125eNYhFWadb8l72oAIhAK9vTx4B5udgmAHGaZLFEf2ughPM4XB7MmEIldPBzEaH","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCh7b0JqkYRQxu7SPtDMT5TW3lP/2wZYZrAs5ljNr9YEgIgOvH4m/txypUw3JMPhdNlAmTp7+Rw4pK4f5Qp6Nls/cg="}],"unpackedSize":1566940},"main":"./dist/index.cjs","name":"@a.nemreen/a11y","type":"module","types":"./dist/index.d.ts","author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"default":"./dist/index.js","require":{"types":"./dist/index.d.cts","default":"./dist/index.cjs"}},"./styles.css":"./dist/styles.css"},"gitHead":"9ed83e1c80f2953548927ab1e52a8d842f46ec8f","license":"MIT","scripts":{"demo":"npm run build && npx --yes serve . -l 4173","build":"tsup && cp src/styles.css dist/styles.css","panel":"npm run build && npm start --prefix panel","build:site":"node scripts/build-site.mjs","prepublishOnly":"npm run build"},"version":"0.3.0","_npmUser":{"name":"a.nemreen","email":"a.nemreen@gmail.com"},"homepage":"https://nemreen.info/a11y","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency","dashboard","control-panel"],"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"_npmVersion":"11.16.0","description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters, optional self-hosted dashboard. Works with Angular, React, Vue, and plain HTML.","directories":{},"maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"sideEffects":["*.css"],"_nodeVersion":"24.18.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","typescript":"^5.3.0"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/a11y_0.3.0_1789557462956_0.8013035745159285"}}},"time":{"created":"2026-07-25T12:09:41.086Z","modified":"2026-09-16T11:17:43.239Z","0.1.0":"2026-07-25T12:09:41.478Z","0.1.1":"2026-07-25T12:12:16.053Z","0.1.2":"2026-07-25T12:13:19.170Z","0.1.3":"2026-07-26T06:07:51.385Z","0.1.6":"2026-09-13T17:09:50.393Z","0.2.0":"2026-09-16T09:11:17.657Z","0.3.0":"2026-09-16T11:17:43.089Z"},"bugs":{"url":"https://github.com/nemreen/a11y/issues"},"author":{"url":"https://nemreen.info","name":"Ahmed Nemreen","email":"a.nemreen@gmail.com"},"license":"MIT","homepage":"https://nemreen.info/a11y","keywords":["accessibility","a11y","wcag","widget","frontend","browser","typescript","angular","react","vue","vanilla","zero-dependency","dashboard","control-panel"],"repository":{"url":"git+https://github.com/nemreen/a11y.git","type":"git"},"description":"Framework-agnostic accessibility tools widget — profiles, readable experience, visual filters, optional self-hosted dashboard. Works with Angular, React, Vue, and plain HTML.","maintainers":[{"name":"a.nemreen","email":"a.nemreen@gmail.com"}],"readme":"<p align=\"center\">\n  <img src=\"assets/cover.png\" alt=\"a11y — Accessibility Tools\" width=\"720\" />\n</p>\n\n<h1 align=\"center\">@a.nemreen/a11y</h1>\n\n<p align=\"center\">\n  Framework-agnostic <strong>Accessibility Tools</strong> widget — quick profiles, readable experience controls, visual filters, and a reading mask.<br />\n  Works with <strong>Angular</strong>, <strong>React</strong>, <strong>Vue</strong>, and plain HTML. Zero framework peers.<br />\n  Optional self-hosted dashboard. Always free. Unlimited websites.<br />\n  <em>By Ahmed Nemreen · Made in KSA</em>\n</p>\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/@a.nemreen/a11y\"><img src=\"https://img.shields.io/npm/v/@a.nemreen/a11y.svg?style=flat-square\" alt=\"npm version\" /></a>\n  <a href=\"https://www.npmjs.com/package/@a.nemreen/a11y\"><img src=\"https://img.shields.io/npm/dm/@a.nemreen/a11y.svg?style=flat-square\" alt=\"npm downloads\" /></a>\n  <a href=\"https://www.npmjs.com/package/@a.nemreen/a11y\"><img src=\"https://img.shields.io/badge/dependencies-0-brightgreen?style=flat-square\" alt=\"zero dependencies\" /></a>\n  <a href=\"LICENSE\"><img src=\"https://img.shields.io/npm/l/@a.nemreen/a11y.svg?style=flat-square\" alt=\"MIT license\" /></a>\n  <a href=\"https://www.typescriptlang.org/\"><img src=\"https://img.shields.io/badge/types-TypeScript-blue?style=flat-square\" alt=\"TypeScript\" /></a>\n  <a href=\"https://nemreen.info/a11y\"><img src=\"https://img.shields.io/badge/demo-nemreen.info-informational?style=flat-square\" alt=\"live demo\" /></a>\n  <a href=\"https://www.npmjs.com/package/@a.nemreen/a11y-panel\"><img src=\"https://img.shields.io/badge/dashboard-npm%20%2B%20docker-ff2d95?style=flat-square\" alt=\"self-hosted dashboard\" /></a>\n</p>\n\n---\n\n## Install the widget (npm)\n\n```bash\nnpm install @a.nemreen/a11y\n```\n\n```ts\nimport { Accessibility } from '@a.nemreen/a11y';\nimport '@a.nemreen/a11y/styles.css';\n\nAccessibility.mount({\n  position: 'end', // end | start | left | right\n  stack: 0,\n  locale: 'auto',  // auto | ar | en\n});\n```\n\nMount once at the application root — same API in Angular, React, Vue, and plain HTML. Omit the control panel options and the shelf stays the full catalog, with no network calls.\n\n### Headless (controller only)\n\n```ts\nconst a11y = Accessibility.mount({ headless: true });\na11y.setMode('high-contrast', true);\n```\n\n---\n\n## Control panel (optional, self-hosted)\n\nThe dashboard is **not** a paid SaaS. Install it from **npm / Docker Hub** — no GitHub access required. Pair each app with a public `siteKey`. **Always free** — unlimited websites, no fees, no caps.\n\n<p align=\"center\">\n  <img src=\"assets/panel/dashboard.png\" alt=\"Control panel dashboard with users, shelf opens, and top tools\" width=\"900\" />\n</p>\n\n### What you get\n\n| | |\n| --- | --- |\n| **Shelf** | Hide or show any tool per website. Style the floating button (color, icon, shape, size). Add custom links you can disable or remove. |\n| **Stats** | Unique users, shelf opens, tool uses, top tools. Filter **All websites** or one site. |\n| **Sites** | Many apps, one panel. Each site key is public, like a GA measurement ID. |\n| **Users** | Admin / editor / viewer. First visit is an install wizard (username, email, password). |\n\n<p align=\"center\">\n  <img src=\"assets/panel/shelf.png\" alt=\"Shelf editor with floating button color, icon, and shape\" width=\"900\" />\n</p>\n\n### Server requirements\n\n**Docker (recommended):** Docker Engine; 1 CPU / 512 MB RAM (1 GB comfortable); ~200 MB image plus a SQLite volume; port **8787** or 80/443 behind TLS; outbound Docker Hub on first pull. Sites that embed the widget must reach this URL. No extra database, Redis, or mailer.\n\n**Without Docker:** Node.js 18+, npm, and native build tools (`python3`, `make`, `g++` / Xcode CLT). Same port and disk.\n\n### Install the dashboard (Docker Hub)\n\nYou do not need a Dockerfile or a git clone. Docker pulls `nemreen/a11y-panel`:\n\n```bash\ndocker run -d --name a11y-panel --restart unless-stopped \\\n  -p 8787:8787 \\\n  -v a11y-panel-data:/data \\\n  -e PORT=8787 \\\n  -e DATA_DIR=/data \\\n  -e A11Y_PANEL_ORIGIN=http://YOUR_SERVER:8787 \\\n  nemreen/a11y-panel:latest\n```\n\nOpen `http://YOUR_SERVER:8787`. The first visit is the wizard. Create a website, copy the snippet:\n\n```ts\nAccessibility.mount({\n  panelUrl: 'http://YOUR_SERVER:8787',\n  siteKey: 'a11y_site_…',\n});\n```\n\n<p align=\"center\">\n  <img src=\"assets/panel/install.png\" alt=\"Install snippet with panelUrl and siteKey\" width=\"900\" />\n</p>\n\nNo Docker: `npx @a.nemreen/a11y-panel`. Package: [`@a.nemreen/a11y-panel`](https://www.npmjs.com/package/@a.nemreen/a11y-panel).\n\nUse a **different `siteKey` per app**. Same `panelUrl`. Localhost origins are allowed automatically during development.\n\n<p align=\"center\">\n  <img src=\"assets/panel/sites.png\" alt=\"Sites page with site key and allowed origins\" width=\"900\" />\n</p>\n\n---\n\n## Features\n\n- **Profiles:** epilepsy-safe, visually-impaired, cognitive-disability, motor-impaired, colorblind, dyslexia-friendly, adhd-friendly\n- **Adjust:** font size, dyslexia font, highlight titles/links, reading mask, pause motion, text align, line/letter/word spacing\n- **Filters:** boost contrast, monochrome, high contrast, high/low saturation, deuteranopia\n- AR / EN UI, RTL-aware panel, `localStorage` persistence, live region announcements\n- Shelf follows the host page theme (`data-theme=\"dark\"`, `.dark`, `color-scheme`)\n- Floating button cosmetics from the dashboard (color, icon, shape, size)\n- Optional control panel: wizard, shelf, stats, unlimited sites, always free\n\n## Demo\n\n[https://nemreen.info/a11y](https://nemreen.info/a11y)\n\n## Architecture\n\n[arc42](docs/architecture/README.md) (what to document) and [C4](docs/architecture/c4/README.md) (how to visualize it) — goals, context, building blocks, runtime, decisions, and known risks.\n\n## License\n\nMIT © [Ahmed Nemreen](https://nemreen.info) · Made in KSA\n","readmeFilename":"README.md"}