{"id":17808286,"url":"https://github.com/loaderb0t/textarea-selection-bounds","last_synced_at":"2025-10-05T14:35:32.223Z","repository":{"id":230055747,"uuid":"778336296","full_name":"LoaderB0T/textarea-selection-bounds","owner":"LoaderB0T","description":"A handy package to get the bounds of the current text selection in a textarea element","archived":false,"fork":false,"pushed_at":"2025-03-03T13:50:57.000Z","size":1134,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-05T10:02:38.959Z","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/LoaderB0T.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}},"created_at":"2024-03-27T14:31:37.000Z","updated_at":"2025-03-03T13:50:54.000Z","dependencies_parsed_at":"2024-03-27T16:30:20.371Z","dependency_job_id":"c77ea622-fd1c-4e11-a004-bfe5b3515d82","html_url":"https://github.com/LoaderB0T/textarea-selection-bounds","commit_stats":null,"previous_names":["loaderb0t/textarea-selection-bounds"],"tags_count":0,"template":false,"template_full_name":"LoaderB0T/typescript-starter","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LoaderB0T%2Ftextarea-selection-bounds","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LoaderB0T%2Ftextarea-selection-bounds/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LoaderB0T%2Ftextarea-selection-bounds/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LoaderB0T%2Ftextarea-selection-bounds/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LoaderB0T","download_url":"https://codeload.github.com/LoaderB0T/textarea-selection-bounds/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246763956,"owners_count":20829800,"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":[],"created_at":"2024-10-27T15:10:14.330Z","updated_at":"2025-10-05T14:35:32.134Z","avatar_url":"https://github.com/LoaderB0T.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![npm](https://img.shields.io/npm/v/textarea-selection-bounds?color=%2300d26a\u0026style=for-the-badge)](https://www.npmjs.com/package/textarea-selection-bounds)\n[![Demo Codepen](https://img.shields.io/badge/demo-codepen-blue?style=for-the-badge\u0026logo=codepen)](https://codepen.io/Janik-Schumacher/pen/gOyGxed)\n[![Build Status](https://img.shields.io/github/actions/workflow/status/LoaderB0T/textarea-selection-bounds/build.yml?branch=main\u0026style=for-the-badge)](https://github.com/LoaderB0T/textarea-selection-bounds/actions/workflows/build.yml)\n[![Sonar Quality Gate](https://img.shields.io/sonar/quality_gate/LoaderB0T_textarea-selection-bounds?server=https%3A%2F%2Fsonarcloud.io\u0026style=for-the-badge)](https://sonarcloud.io/summary/new_code?id=LoaderB0T_textarea-selection-bounds)\n[![bundle size](https://img.shields.io/bundlephobia/minzip/textarea-selection-bounds?color=%23FF006F\u0026label=Bundle%20Size\u0026style=for-the-badge)](https://bundlephobia.com/package/textarea-selection-bounds)\n\n# textarea-selection-bounds\n\nEasily get the bounds of a selection in a textarea or text input element.\n\n## Motivation 💥\n\n**textarea-selection-bounds** is a simple library that allows you to get the bounds of a selection in a textarea or text input element. It is written in TypeScript and has no dependencies. It is perfect to overlay content on top of a textarea or text input element that should follow the selection.\n\n`top` \u0026 `left` are the coordinates of the top-left corner of the selection. They are relative to the window (fixed). `width` \u0026 `height` are the dimensions of the selection.\n\n⚠️ Caution ⚠️: If you want to style an element that follows the selection, make sure to set the `position` of the element to `fixed` and use the `top` and `left` values from the bounds object.\n\n## Demo 🚀\n\nSee the [Codepen](https://codepen.io/Janik-Schumacher/pen/gOyGxed) for a live demo.\n\n## Features 🔥\n\n✅ Get top, left, width, and height of a selection in a textarea or text input element.\n\n✅ Zero dependencies.\n\n✅ Strongly typed.\n\n## Built With 🔧\n\n- [TypeScript](https://www.typescriptlang.org/)\n\n## Installation 📦\n\n```console\npnpm i textarea-selection-bounds\n// or\nyarn add textarea-selection-bounds\n// or\nnpm i textarea-selection-bounds\n```\n\n## Usage Example 🚀\n\n```typescript\nimport { TextareaSelectionBounds } from \"./textarea-selection-bounds\";\n```\n\n```typescript\nconst textArea = document.querySelector('textarea');\nif (textArea) {\n  const bounds = new TextareaSelectionBounds(textArea);\n  console.log(bounds.getBounds());\n}\n```\n\n## Contributing 🧑🏻‍💻\n\nContributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.\n\nIf you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag \"enhancement\".\nDon't forget to give the project a star! Thanks again!\n\n1. Fork the Project\n2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)\n3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)\n4. Push to the Branch (`git push origin feature/AmazingFeature`)\n5. Open a Pull Request\n\n## License 🔑\n\nDistributed under the MIT License. See `LICENSE.txt` for more information.\n\n## Contact 📧\n\nJanik Schumacher - [@LoaderB0T](https://twitter.com/LoaderB0T) - [linkedin](https://www.linkedin.com/in/janikschumacher/)\n\nProject Link: [https://github.com/LoaderB0T/textarea-selection-bounds](https://github.com/LoaderB0T/textarea-selection-bounds)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Floaderb0t%2Ftextarea-selection-bounds","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Floaderb0t%2Ftextarea-selection-bounds","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Floaderb0t%2Ftextarea-selection-bounds/lists"}