{"id":21980547,"url":"https://github.com/svnrnns/mitt-react","last_synced_at":"2026-03-02T14:37:35.356Z","repository":{"id":249646953,"uuid":"832103742","full_name":"svnrnns/mitt-react","owner":"svnrnns","description":"Lightweight utility for integrating mitt with React","archived":false,"fork":false,"pushed_at":"2025-03-22T09:24:00.000Z","size":7,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-22T09:29:12.445Z","etag":null,"topics":["event-emitter","event-handling","event-management","event-subscriptions","mitt","react-events","react-hooks","react-utility"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/mitt-react","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/svnrnns.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-07-22T11:08:35.000Z","updated_at":"2025-03-22T09:24:03.000Z","dependencies_parsed_at":"2024-07-22T13:22:43.652Z","dependency_job_id":"be2467bc-14ee-4b30-b489-217366aec5dd","html_url":"https://github.com/svnrnns/mitt-react","commit_stats":null,"previous_names":["svnrnns/mitt-react"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svnrnns%2Fmitt-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svnrnns%2Fmitt-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svnrnns%2Fmitt-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svnrnns%2Fmitt-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/svnrnns","download_url":"https://codeload.github.com/svnrnns/mitt-react/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246981136,"owners_count":20863825,"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":["event-emitter","event-handling","event-management","event-subscriptions","mitt","react-events","react-hooks","react-utility"],"created_at":"2024-11-29T17:11:55.851Z","updated_at":"2026-03-02T14:37:35.349Z","avatar_url":"https://github.com/svnrnns.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Mitt React\n\n`mitt-react` is a lightweight utility for integrating the mitt event emitter with React functional components. It provides hooks for listening to and emitting events in a React-friendly way. \u003cbr /\u003e\n\nIn more detail, this package offers a hook that automatically handles event subscription and unsubscription using the `useEffect` hook. This simplifies the process of managing event listeners in React components, ensuring they are properly set up and cleaned up to avoid memory leaks.\n\n## Installation\n\n```bash\nnpm install mitt-react\n```\n\n## Usage\n\n### useEventListener (hook)\n\nThe `useEventListener` hook allows you to listen to custom events in your React components.\n\n```jsx\nimport React, { useState } from \"react\";\nimport { useEventListener } from \"mitt-react\";\n\nconst MyComponent = () =\u003e {\n  const [message, setMessage] = useState(\"\");\n\n  useEventListener(\"customEvent\", (data) =\u003e {\n    setMessage(data);\n  });\n\n  return (\n    \u003cdiv\u003e\n      \u003cp\u003e{message}\u003c/p\u003e\n    \u003c/div\u003e\n  );\n};\n\nexport default MyComponent;\n```\n\n### useEventEmit / eventEmit (function)\n\nThe `eventEmit` function allows you to emit custom events.\n\n```jsx\nimport React from \"react\";\nimport { eventEmit } from \"mitt-react\";\n\nconst MyEmitterComponent = () =\u003e {\n  const handleClick = () =\u003e {\n    eventEmit(\"customEvent\", \"Hello, World!\");\n  };\n\n  return \u003cbutton onClick={handleClick}\u003eEmit Event\u003c/button\u003e;\n};\n\nexport default MyEmitterComponent;\n```\n\n## API\n\n### useEventListener\n\nA hook to listen for a custom event.\n\n| Param     | Type     | Nullable | Desc                                            |\n| --------- | -------- | -------- | ----------------------------------------------- |\n| eventName | string   | \u0026cross;  | The name of the event to listen for             |\n| handler   | Function | \u0026cross;  | The function to call when the event is emitted. |\n\n### useEventEmit / eventEmit\n\nA function to emit a custom event.\n\n| Param     | Type   | Nullable | Desc                                   |\n| --------- | ------ | -------- | -------------------------------------- |\n| eventName | string | \u0026cross;  | The name of the event to emit.         |\n| data      | any    | \u0026cross;  | The data to pass to the event handler. |\n\n### Types\n\nThese types can be imported this way:\n\n```js\nimport type { EventMap } from \"mitt-vue\";\n```\n\nHere is the list of types used in the package.\n\n```ts\nexport type EventMap = Record\u003cEventType, unknown\u003e;\nexport type EventCallback = (...args: any[]) =\u003e void;\n```\n\n## Contribution\n\nContributions are welcome! Please open an issue or submit a pull request on GitHub.\n\n## License\n\nThis project is licensed under the MIT License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvnrnns%2Fmitt-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsvnrnns%2Fmitt-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvnrnns%2Fmitt-react/lists"}