{"id":23410843,"url":"https://github.com/adenekan41/use-responsive-query","last_synced_at":"2025-09-08T12:44:35.702Z","repository":{"id":57388321,"uuid":"347503824","full_name":"adenekan41/use-responsive-query","owner":"adenekan41","description":"🚀 An extremely powerful but easy to use hook for listening to media events in react.","archived":false,"fork":false,"pushed_at":"2021-03-15T00:04:28.000Z","size":115,"stargazers_count":9,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-08-13T09:27:16.084Z","etag":null,"topics":["media-queries","react-hooks","typescript","utility"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/use-responsive-query","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/adenekan41.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}},"created_at":"2021-03-13T23:41:55.000Z","updated_at":"2022-10-27T21:52:43.000Z","dependencies_parsed_at":"2022-09-02T04:01:21.696Z","dependency_job_id":null,"html_url":"https://github.com/adenekan41/use-responsive-query","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/adenekan41/use-responsive-query","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adenekan41%2Fuse-responsive-query","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adenekan41%2Fuse-responsive-query/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adenekan41%2Fuse-responsive-query/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adenekan41%2Fuse-responsive-query/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/adenekan41","download_url":"https://codeload.github.com/adenekan41/use-responsive-query/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adenekan41%2Fuse-responsive-query/sbom","scorecard":{"id":166186,"data":{"date":"2025-08-11","repo":{"name":"github.com/adenekan41/use-responsive-query","commit":"823196d4a2fd3a0bf212c192694ed5688e7120e6"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Code-Review","score":0,"reason":"Found 0/8 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"Vulnerabilities","score":0,"reason":"46 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-6fw4-hr69-g3rv","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6","Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj","Warn: Project is vulnerable to: GHSA-3f95-r44v-8mrg","Warn: Project is vulnerable to: GHSA-28xr-mwxg-3qc8","Warn: Project is vulnerable to: GHSA-9p95-fxvg-qgq2","Warn: Project is vulnerable to: GHSA-9w5j-4mwv-2wj8","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6","Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v","Warn: Project is vulnerable to: GHSA-38fc-wpqx-33j7","Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7","Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-16T14:56:07.369Z","repository_id":57388321,"created_at":"2025-08-16T14:56:07.369Z","updated_at":"2025-08-16T14:56:07.369Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":274188068,"owners_count":25237847,"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-09-08T02:00:09.813Z","response_time":121,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","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":["media-queries","react-hooks","typescript","utility"],"created_at":"2024-12-22T17:52:37.750Z","updated_at":"2025-09-08T12:44:35.680Z","avatar_url":"https://github.com/adenekan41.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cbr /\u003e\n\u003cp align=\"center\"\u003e\n\t\u003ca href=\"https://i.ibb.co/b7WjPCP/Group-38.png\"\u003e\n\t\t\u003cimg src=\"https://i.ibb.co/b7WjPCP/Group-38.png\" width=\"260\" alt=\"use-responsive-query\"\u003e\n\t\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e An extremely powerful but easy to use hook for listening to media events in React.\u003c/p\u003e\n\n\u003chr / \u003e\n\u003cbr /\u003e\n\n[![npm](https://badge.fury.io/js/use-responsive-query.svg)](https://www.npmjs.com/package/use-responsive-query)\n\n[![NPM](https://nodei.co/npm/use-responsive-query.png?downloads=true\u0026downloadRank=true\u0026stars=true)](https://nodei.co/npm/use-responsive-query/)\n\n\u003cbr /\u003e\n\n### 🔍 [Try out the interactive Demo](https://codesandbox.io/s/use-responsive-query-1ep5q?file=/src/App.js) on codesandbox\n\n## ⚡️About\n\n[Use Responsive Query](https://github.com/adenekan41/use-responsive-query), An\nextremely powerful but easy to use hook for listening to media events in React.\nURQ create an experience of a javascript like **reactive accomodation** for your\nreact application.\n\n## ✨ Features\n\n- 🚀 Typescript support\n- 📦 Light Weight ~675b (gzipped)\n- 🔧 Cross platform supported\n- 🙅‍♂️ Zero dependencies\n- ✅ Fully tested and reliable\n- ⚒ CommonJS, ESM \u0026 browser standalone support\n\n## ⬇ Installing [use-responsive-query](https://github.com/adenekan41/use-responsive-query)\n\n### Using NPM\n\n```bash\nnpm i use-responsive-query\n```\n\n### Using Yarn\n\n```bash\nyarn add use-responsive-query\n```\n\n## 🛠 Usage\n\nGetting familiar with the libary and all you need is to understand how\n[media queries](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries)\nworks, **URQ** is create with support and flexibility in mind, we have\nochestrated some set of standard screen sizes to make work easier for you.\n\nHere are some few primary ranges you need to get aquantained with.\n\n- `xs`: `320px` Extra small devices (portrait phones, less than 320px)\n- `sm`: `320px` Extra small devices (portrait phones, less than 576px)\n- `md`: `768px` Small devices (landscape phones, less than 768px)\n- `lg`: `992px` Medium devices (tablets, less than 992px)\n- `xl`: `1200px` Large devices (desktops, less than 1200px)\n\n```jsx\nimport useResponsiveQuery from 'use-responsive-query';\n\nexport default function App() {\n  const isSmallDevices = useResponsiveQuery('md'); // Small devices (landscape phones, less than 768px)\n\n  return (\n    \u003cdiv className=\"App\"\u003e\n      {isSmallDevices \u0026\u0026 \u003ch1\u003eHello Use responsive query\u003c/h1\u003e}\n      \u003ch2\u003eStart hacking!!! (see changes up)\u003c/h2\u003e\n    \u003c/div\u003e\n  );\n}\n```\n\njust like that very easy and staight forward. Easy right ?, we are also created\naccomodative access for you so you can write your raw query wiht **URQ** like\nthis.\n\n```jsx\nimport useResponsiveQuery from 'use-responsive-query';\n\nexport default function App() {\n  const isMin300 = useResponsiveQuery('(min-width: 300px)'); // a truthy value is called immediately our window matches this value\n\n  return (\n    \u003cdiv className=\"App\"\u003e\n      {isMin300 \u0026\u0026 \u003ch1\u003eHello Use responsive query\u003c/h1\u003e}\n      \u003ch2\u003eStart hacking!!! (see changes up)\u003c/h2\u003e\n    \u003c/div\u003e\n  );\n}\n```\n\nMoreover, we call this pacakage the most flexible and easy to libary and we say\nthat with every use case and intent in mind, if you are wondering how you can\ncreate your own custom config for your team here is how.\n\n## 🔧 Creating your own config\n\n**URQ** give you a creative option to modify your default primary media ranges\nand lets you created a unique configuration access for your team.\n\n```jsx\nimport useResponsiveQuery from 'use-responsive-query';\n\nconst config = {\n  sm: '400px',\n};\n\nexport default function App() {\n  const isSmall = useResponsiveQuery('sm', config); // a truthy value is called immediately our window matches \u003c400px\n\n  return (\n    \u003cdiv className=\"App\"\u003e\n      {isSmall \u0026\u0026 \u003ch1\u003eHello Use responsive query\u003c/h1\u003e}\n      \u003ch2\u003eStart hacking!!! (see changes up)\u003c/h2\u003e\n    \u003c/div\u003e\n  );\n}\n```\n\nMIT © [codewonders.dev](https://codewonders.dev) \u0026nbsp;\u0026middot;\u0026nbsp; GitHub\n[@adenekan41](https://github.com/adenekan41) \u003e \u0026nbsp;\u0026middot;\u0026nbsp;\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadenekan41%2Fuse-responsive-query","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadenekan41%2Fuse-responsive-query","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadenekan41%2Fuse-responsive-query/lists"}