PHPackages levmyshkin/micromodal - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. levmyshkin/micromodal ActiveDrupal-library[Utility & Helpers](/categories/utility) levmyshkin/micromodal ===================== Fork from ghosh/Micromodal. Tiny, dependency-free javascript library for creating accessible modal dialogs. 1.1.0(3y ago)09.3k—8.3%GPL-2.0-or-laterJavaScript Since Feb 28Pushed 3y agoCompare [ Source](https://github.com/levmyshkin/micromodal)[ Packagist](https://packagist.org/packages/levmyshkin/micromodal)[ Docs](https://github.com/levmyshkin/micromodal)[ RSS](/packages/levmyshkin-micromodal/feed)WikiDiscussions master Synced 1mo ago READMEChangelogDependenciesVersions (3)Used By (0) [![](https://camo.githubusercontent.com/f629ea35e27ce5aace6606aa9bc164a985226dcc004d02781d84325a25d61729/68747470733a2f2f7777772e64726f70626f782e636f6d2f732f7462616f6f796934796838706269372f6c6f676f2e706e673f7261773d31)](https://camo.githubusercontent.com/f629ea35e27ce5aace6606aa9bc164a985226dcc004d02781d84325a25d61729/68747470733a2f2f7777772e64726f70626f782e636f6d2f732f7462616f6f796934796838706269372f6c6f676f2e706e673f7261773d31) ### Micromodal.js [](#--micromodaljs) [ ![Made with love](https://camo.githubusercontent.com/008b4cb865a0fbc5c9953de510f8d8e3ea3d9db5758b64c55dd52f29174a33cf/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6d616465253230776974682d6c6f76652d4537363041342e737667) ](#) [ ![License](https://camo.githubusercontent.com/7013272bd27ece47364536a221edb554cd69683b68a46fc0ee96881174c4214c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d626c75652e737667) ](https://opensource.org/licenses/MIT) [ ![Package version](https://camo.githubusercontent.com/424c3e1b05e5dbb51906dc0b01e2536b2234f3d57a18e73ae06ab9ba98e6ee50/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f6d6963726f6d6f64616c2e737667) ](https://www.npmjs.com/package/micromodal) [ ![Build Status](https://camo.githubusercontent.com/f5ba95057c0ef5a1179de3f89f5aab3d43b481b2fef1cd41f70771323964858a/68747470733a2f2f6170692e7472617669732d63692e6f72672f67686f73682f6d6963726f6d6f64616c2e737667) ](https://travis-ci.org/ghosh/micromodal) Tiny, dependency-free javascript library for creating accessible modal dialogs --- [![](https://camo.githubusercontent.com/251ce650d242d920576ea1b32975e7f731c9312a03013e51ceadb6b3e56ddd51/68747470733a2f2f7777772e64726f70626f782e636f6d2f732f3867376672303931746b386f36326a2f6d6963726f6d6f64616c2e6769663f7261773d31)](https://camo.githubusercontent.com/251ce650d242d920576ea1b32975e7f731c9312a03013e51ceadb6b3e56ddd51/68747470733a2f2f7777772e64726f70626f782e636f6d2f732f3867376672303931746b386f36326a2f6d6963726f6d6f64616c2e6769663f7261773d31) The aim of this library is to make modal dialogs accessible and easy to include in your project with minimum configuration. It's only ~1.8kb minified and gzipped - A tiny library for big change. **[Demo and documentation](https://micromodal.now.sh/)** Features -------- [](#features) ✔ Toggles relevant aria attributes on open and close ✔ Closes modal on overlay click ✔ Closes modal on pressing the `esc` key ✔ Traps tab focus within the modal ✔ Focuses on the first focusable element within the modal ✔ Retains the focused element state after closing the modal Installation ------------ [](#installation) **via npm** ``` npm install micromodal --save ``` **via yarn** ``` yarn add micromodal ``` **via CDN direct link** ``` ``` **direct download** ``` curl -O -L https://unpkg.com/micromodal/dist/micromodal.min.js ``` IE 11 and below --------------- [](#ie-11-and-below) Please use this pollyfill suggested [here](https://github.com/ghosh/Micromodal/issues/49#issuecomment-424213347). Changelog --------- [](#changelog) Find the latest changelog [here](https://github.com/ghosh/micromodal/blob/master/CHANGELOG.md). Contributing ------------ [](#contributing) We are always open and invite developers to contribute to Micromodal. We have kept the guidelines and process dead simple, so you invest more time in making modals accessible to all. Micromodal follows the [standardjs](https://standardjs.com/) coding standard and is part of our `package.json` file. It will help us to maintain consistency in the code base. #### Development setup [](#development-setup) 1. Clone Github repo `$ git clone https://github.com/ghosh/micromodal.git` 2. Install `yarn` package manager (Read [installation guide](https://yarnpkg.com/en/docs/install#mac-tab)) 3. Run `yarn install` in the root folder to install all dependencies 4. Run `yarn dev` to start a dev server. This serves the example directory and live reloads when any files are changed 5. \[Optional\] Run `yarn build` to build the files for distribution. This is run automatically as a pre-commit hook as well. 6. Send us pull request and chill Licensing --------- [](#licensing) This project is licensed under [MIT license](https://opensource.org/licenses/MIT). Related ------- [](#related) - [Microtip](https://github.com/ghosh/microtip) - Modern, lightweight, accessible css tooltip library. Just 1kb. Contact ------- [](#contact) You can mention us on Twitter for any questions, suggestions or just send us funny GIF. We ♥️ GIFs. #### Tweet some love [](#tweet-some-love) [Tweet](https://twitter.com/intent/tweet?url=https%3A%2F%2Fgoo.gl%2FsEgnBZ&text=Make%20your%20modal%20dialogs%20accessible%20to%20all%20using%20Micromodal.js%2C%20a%20tiny%20library%20for%20big%20change.&hashtags=a11y "Tweet about Micromodal") about Micromodal and help us to spread the message about the importance of Web accessibility and Inclusive design. Created and maintained by ------------------------- [](#created-and-maintained-by) Indrashish Ghosh – [@\_ighosh](https://twitter.com/_ighosh) 🇮🇳 Kalpesh Singh - [@knowkalpesh](https://twitter.com/knowkalpesh) 🇮🇳 Darpan Kakadia - [@kakadiadarpan](https://twitter.com/kakadiadarpan) 🇩🇪 Contributors - [list](https://github.com/ghosh/micromodal/graphs/contributors) 🌐 ### Health Score 29 — LowBetter than 59% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity24 Limited adoption so far Community19 Small or concentrated contributor base Maturity46 Maturing project, gaining track record Bus Factor1 Top contributor holds 75.9% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~0 days Total 2 Last Release 1175d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/7b36520942f79193ba42311edf66bce9654c126a2d6733a5b3a627a4a217229f?d=identicon)[levmyshkin](/maintainers/levmyshkin) --- Top Contributors [![ghosh](https://avatars.githubusercontent.com/u/4667682?v=4)](https://github.com/ghosh "ghosh (456 commits)")[![dependabot-preview[bot]](https://avatars.githubusercontent.com/in/2141?v=4)](https://github.com/dependabot-preview[bot] "dependabot-preview[bot] (32 commits)")[![kalpeshsingh](https://avatars.githubusercontent.com/u/13119410?v=4)](https://github.com/kalpeshsingh "kalpeshsingh (26 commits)")[![dependabot-support](https://avatars.githubusercontent.com/u/112581971?v=4)](https://github.com/dependabot-support "dependabot-support (22 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (18 commits)")[![kakadiadarpan](https://avatars.githubusercontent.com/u/10805593?v=4)](https://github.com/kakadiadarpan "kakadiadarpan (13 commits)")[![erwstout](https://avatars.githubusercontent.com/u/9441913?v=4)](https://github.com/erwstout "erwstout (3 commits)")[![alesvojta](https://avatars.githubusercontent.com/u/1668328?v=4)](https://github.com/alesvojta "alesvojta (2 commits)")[![bgoewert-seiler](https://avatars.githubusercontent.com/u/142928408?v=4)](https://github.com/bgoewert-seiler "bgoewert-seiler (2 commits)")[![ivan829llc](https://avatars.githubusercontent.com/u/132590440?v=4)](https://github.com/ivan829llc "ivan829llc (2 commits)")[![LukasDrgon](https://avatars.githubusercontent.com/u/15611832?v=4)](https://github.com/LukasDrgon "LukasDrgon (2 commits)")[![roebuk](https://avatars.githubusercontent.com/u/474377?v=4)](https://github.com/roebuk "roebuk (2 commits)")[![simonewebdesign](https://avatars.githubusercontent.com/u/2126073?v=4)](https://github.com/simonewebdesign "simonewebdesign (2 commits)")[![simonw](https://avatars.githubusercontent.com/u/9599?v=4)](https://github.com/simonw "simonw (2 commits)")[![zebapy](https://avatars.githubusercontent.com/u/2199845?v=4)](https://github.com/zebapy "zebapy (2 commits)")[![lost-end-found](https://avatars.githubusercontent.com/u/2519257?v=4)](https://github.com/lost-end-found "lost-end-found (1 commits)")[![luciomartinez](https://avatars.githubusercontent.com/u/4297022?v=4)](https://github.com/luciomartinez "luciomartinez (1 commits)")[![seIncorp](https://avatars.githubusercontent.com/u/34153549?v=4)](https://github.com/seIncorp "seIncorp (1 commits)")[![matthew798](https://avatars.githubusercontent.com/u/379965?v=4)](https://github.com/matthew798 "matthew798 (1 commits)")[![muhroots](https://avatars.githubusercontent.com/u/2930303?v=4)](https://github.com/muhroots "muhroots (1 commits)") --- Tags drupalmodalpopupEBT ### Embed Badge ![Health badge](/badges/levmyshkin-micromodal/health.svg) ``` [![Health](https://phpackages.com/badges/levmyshkin-micromodal/health.svg)](https://phpackages.com/packages/levmyshkin-micromodal) ``` ### Alternatives [wire-elements/modal Laravel Livewire modal component 1.2k3.8M31](/packages/wire-elements-modal)[lullabot/amp A set of useful classes and utilities to convert html to AMP html (See https://www.ampproject.org/) 3802.9M10](/packages/lullabot-amp)[drupal/core-composer-scaffold A flexible Composer project scaffold builder. 5341.9M446](/packages/drupal-core-composer-scaffold)[kartik-v/bootstrap-popover-x Bootstrap Popover Extended - Popover with modal behavior, styling enhancements and more. 1143.4M3](/packages/kartik-v-bootstrap-popover-x)[pboivin/filament-peek Full-screen page preview modal for Filament 253319.6k12](/packages/pboivin-filament-peek)[kartik-v/yii2-dialog An asset bundle for bootstrap3-dialog for Yii 2.0 framework. 496.2M18](/packages/kartik-v-yii2-dialog) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)