{"id":28099130,"url":"https://github.com/stadgent/npm_package_modal","last_synced_at":"2025-05-13T17:59:34.236Z","repository":{"id":43982049,"uuid":"211861321","full_name":"StadGent/npm_package_modal","owner":"StadGent","description":null,"archived":false,"fork":false,"pushed_at":"2023-05-08T11:57:57.000Z","size":834,"stargazers_count":2,"open_issues_count":5,"forks_count":0,"subscribers_count":4,"default_branch":"develop","last_synced_at":"2025-04-17T13:37:27.267Z","etag":null,"topics":["d09check22","javascript","node","nodejs","npm","web"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/StadGent.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-09-30T13:03:57.000Z","updated_at":"2023-02-22T08:41:41.000Z","dependencies_parsed_at":"2024-06-21T13:09:01.854Z","dependency_job_id":null,"html_url":"https://github.com/StadGent/npm_package_modal","commit_stats":{"total_commits":62,"total_committers":6,"mean_commits":"10.333333333333334","dds":0.5806451612903225,"last_synced_commit":"b62020e51625e44447075de87cf957569adc88ee"},"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StadGent%2Fnpm_package_modal","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StadGent%2Fnpm_package_modal/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StadGent%2Fnpm_package_modal/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StadGent%2Fnpm_package_modal/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/StadGent","download_url":"https://codeload.github.com/StadGent/npm_package_modal/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254000311,"owners_count":21997428,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["d09check22","javascript","node","nodejs","npm","web"],"created_at":"2025-05-13T17:59:33.223Z","updated_at":"2025-05-13T17:59:34.229Z","avatar_url":"https://github.com/StadGent.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# City of Ghent Modal\n\nThis is a fully accessible modal library. \nIt includes a body scroll lock, tab trap,\nroute events and aria-hidden for obscured contents.\n\nIt was created to support the [City of Ghent styleguide](https://stijlgids.stad.gent).\n\n## Usage\n\n### CommonJS\n\n```javascript\nconst Modal = require('@digipolis-gent/modal').default;\n\nconst modal = new Modal(element, options);\n```\n\n### ES Imports\n\n```javascript\nimport Modal from '@digipolis-gent/modal';\n\nconst modal = new Modal(element, options);\n```\n\n### Browser\n\n**HTML**:\n\n```html\n\u003cscript src=\"node_modules/@digipolis-gent/modal/dist/modal.js\"\u003e\u003c/script\u003e\n```\n\n**JS**:\n\n```js\nvar modal = new Modal(element, options);\n```\n\n## Options\n\nThe second parameter in the constructor is an options object.\n\n| property     | type     | default value | description                                                        |\n|--------------|----------|---------------|--------------------------------------------------------------------|\n| changeHash   | boolean  | true          | Possibility to alter the URL fragment when the modal opens/closes. |\n| enableEscape | boolean  | true          | Allow closing the modal using the escape key.                      |\n| resizeEvent  | function | undefined     | Add a user defined throttled resizeEvent.                          |\n\n### ResizeEvent\n\nThis custom function will be attached to the window resize event.\nIt receives two functions as parameters to open and close the modal.\n\nExample:\n\n```javascript\n  const filter = document.querySelector('#filter');\n\n  new Modal(filter, {\n    /**\n    * The modal is always visible from tablet and up,\n    * this is atypical.\n    */\n    resizeEvent: (open, close) =\u003e {\n      if (window.innerWidth \u003e 960) {\n        close();\n        filter.setAttribute('aria-hidden', 'false');\n      }\n      else if (!filter.classList.contains('visible')) {\n        filter.setAttribute('aria-hidden', 'true');\n      }\n    }\n  });\n```\n\n## Development\n\n### Setup\n\nIf you'd like to make adjustments to the source code, you can set up this\nproject locally. \n\nTo clone the repo and install dependencies:\n\n```bash\n$ git clone git@github.com:StadGent/npm_package_modal.git\n$ cd npm_package_modal\n$ npm install\n```\n\n### Dev\n\n```shell\n$ npm run dev\n```\n\n### Build\n\n```shell\n$ npm run build\n```\n\n## Contributing\n\nThanks for your interest in contributing! [Get started here](.github/CONTRIBUTING.md).\n\n## Authors\n\n- Bart Delrue - [GitHub](https://github.com/delrueba)\n- Helena Standaert - [GitHub](https://github.com/hstandaert)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstadgent%2Fnpm_package_modal","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstadgent%2Fnpm_package_modal","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstadgent%2Fnpm_package_modal/lists"}