{"id":29709720,"url":"https://github.com/wherejuly/69-abbr-title-tap","last_synced_at":"2025-07-23T20:11:24.557Z","repository":{"id":303820682,"uuid":"1014743314","full_name":"WhereJuly/69-abbr-title-tap","owner":"WhereJuly","description":"A drop-in replacement for \u003cabbr title='...'\u003e tag tap behavior on mobile devices, simulating native desktop hover tooltip effect.","archived":false,"fork":false,"pushed_at":"2025-07-09T15:01:39.000Z","size":195,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-07-09T16:24:06.144Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/WhereJuly.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"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,"zenodo":null}},"created_at":"2025-07-06T10:27:34.000Z","updated_at":"2025-07-09T15:01:42.000Z","dependencies_parsed_at":"2025-07-09T16:39:04.207Z","dependency_job_id":null,"html_url":"https://github.com/WhereJuly/69-abbr-title-tap","commit_stats":null,"previous_names":["wherejuly/69-abbr-title-tap"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/WhereJuly/69-abbr-title-tap","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WhereJuly%2F69-abbr-title-tap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WhereJuly%2F69-abbr-title-tap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WhereJuly%2F69-abbr-title-tap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WhereJuly%2F69-abbr-title-tap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/WhereJuly","download_url":"https://codeload.github.com/WhereJuly/69-abbr-title-tap/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WhereJuly%2F69-abbr-title-tap/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266739753,"owners_count":23976662,"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","status":"online","status_checked_at":"2025-07-23T02:00:09.312Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":[],"created_at":"2025-07-23T20:11:23.210Z","updated_at":"2025-07-23T20:11:24.542Z","avatar_url":"https://github.com/WhereJuly.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# abbr-title-tap\n\nThis tiny package drop-in brings native-like `\u003cabbr title=\"...\"\u003e` hover behavior from desktop browsers to mobile. It displays the title text near the `abbr` tag on tap, and hides it when tapping elsewhere.\n\n**Package Status**\n\n[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=WhereJuly_69-abbr-title-tap\u0026metric=alert_status)](https://sonarcloud.io/summary/new_code?id=WhereJuly_69-abbr-title-tap)\n[![Technical Debt](https://sonarcloud.io/api/project_badges/measure?project=WhereJuly_69-abbr-title-tap\u0026metric=sqale_index)](https://sonarcloud.io/summary/new_code?id=WhereJuly_69-abbr-title-tap)\n![npm bundle size](https://img.shields.io/bundlephobia/min/abbr-title-tap)\n![npm minzip size](https://img.shields.io/bundlephobia/minzip/abbr-title-tap)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?color=green)](https://opensource.org/licenses/MIT)\n\n## Installation\n\n**CDN (Browser)**\n\nAdd this in your `index.html` `head` tag. This makes it work as soon as your page loads.\n\n```html\n\u003c!-- From unpkg --\u003e\n\u003cscript src=\"https://unpkg.com/abbr-title-tap\"\u003e\u003c/script\u003e\n\u003clink rel=\"stylesheet\" href=\"https://unpkg.com/abbr-title-tap/styles.min.css\" /\u003e\n```\n\n## Programmatic Usage\n\nFor programmatic usage install it via **npm**:\n\n```bash\nnpm install abbr-title-tap\n```\n\nIf not run vial HTML, then import the package code and styles like this.\n\n```typescript\nimport 'abbr-title-tap/styles.css';\nimport 'abbr-title-tap';\n```\n\nAlternatively, the following will do the same as the `script` tag above in HTML. CSS should be imported as well. Note, either way, it runs a singleton so that just a single `TapDetector` class instance is run.\n\n```typescript\nimport 'abbr-title-tap/styles.css';\n\nimport { Init } from 'abbr-title-tap';\n\nnew Init();\n```\n\n### Advanced\n\nThis is the manual initialization. This is not anymore a singleton, so ensure you do not create multiple redundant `TapDetector` instances.\n\n```typescript\nimport { AbbrTapHandler, TapDetector } from 'abbr-title-tap';\n\nnew TapDetector(document, 'abbr', new AbbrTapHandler());\n```\n\nFormally you could listen to a tap event on any selector you want and provide your own custom tap handler. See the `TapDetector`, `ATapHandler` and `AbbrTapHandler` classes JSDoc hoverable blocks for more info and dig in the source.\n\nYou could also instantiate multiple `TapDetector` instances for handling different HTML selectors with a different handlers (not tested actually).\n\n## Development\n\n- [Requirements](./.a\u0026cd/requirements.md)\n\n### Running Tests\n\n- Automated (Playwright): `npm run test:e2e` will run test from `tests/e2e` folder. Used for unit/integration tests;\n- Manual acceptance testing: `npm run run:test:manual` will start the server on `localhost:3000` serving the html from `tests/manual/index.html` and scripts from `tests/.builds`. Used for manual acceptance testing. The script rebuilds the engaged dependencies to refresh imported files on each run.\n\n## Maintenance\n\nThe package is written in TypeScript with the informative JSDoc blocks available on hover for public interface (e.g. in VS Code) for comfortable programmatic usage. The code is carefully crafted with TDD allowing simple extension. The project is production-ready and actively maintained.\n\n### Contributions\n\nFilling issues, questions in Discussions are all welcome.\n\n## License\n\nThis project is licensed under the MIT License. See the [LICENSE](./LICENSE) file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwherejuly%2F69-abbr-title-tap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwherejuly%2F69-abbr-title-tap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwherejuly%2F69-abbr-title-tap/lists"}