{"id":15979102,"url":"https://github.com/perry-mitchell/react-obstate","last_synced_at":"2026-06-18T22:32:15.957Z","repository":{"id":58268369,"uuid":"529955950","full_name":"perry-mitchell/react-obstate","owner":"perry-mitchell","description":"React hooks for the generic object state management library","archived":false,"fork":false,"pushed_at":"2023-08-23T07:58:31.000Z","size":269,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-11-12T22:23:45.379Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","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/perry-mitchell.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2022-08-28T19:12:34.000Z","updated_at":"2022-08-29T17:44:44.000Z","dependencies_parsed_at":"2023-01-19T04:03:21.091Z","dependency_job_id":null,"html_url":"https://github.com/perry-mitchell/react-obstate","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/perry-mitchell/react-obstate","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/perry-mitchell%2Freact-obstate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/perry-mitchell%2Freact-obstate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/perry-mitchell%2Freact-obstate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/perry-mitchell%2Freact-obstate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/perry-mitchell","download_url":"https://codeload.github.com/perry-mitchell/react-obstate/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/perry-mitchell%2Freact-obstate/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34510283,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-18T02:00:06.871Z","response_time":128,"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":[],"created_at":"2024-10-07T23:41:12.068Z","updated_at":"2026-06-18T22:32:15.941Z","avatar_url":"https://github.com/perry-mitchell.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Obstate\n\u003e React hooks for the generic object state management library `obstate`\n\n[![react-obstate](https://img.shields.io/npm/v/react-obstate?color=blue\u0026label=react-obstate\u0026logo=npm\u0026style=flat-square)](https://www.npmjs.com/package/react-obstate) ![Tests](https://github.com/perry-mitchell/react-obstate/actions/workflows/test.yml/badge.svg)\n\n[`obstate`](https://github.com/perry-mitchell/obstate) is a generic state management library that uses proxies to wrap objects to allow for easy state change notifications. These notifications are used in the hooks provided by this library so that `obstate` states can be used in React projects with ease. It's primarily designed to allow for a global state instance to be used both manually and via React components.\n\n## Installation\n\nInstall by running: `npm install react-obstate obstate --save-dev`.\n\n`obstate` is a peer dependency of this library.\n\n## Usage\n\nIn your component simply import the hook you desire and pass a (global) `obstate` state instance to it:\n\n```tsx\nimport React from \"react\";\nimport { createStateObject } from \"obstate\";\nimport { useSingleState } from \"react-obstate\";\n\nconst globalState = createStateObject({\n    test: 100\n});\n\nexport function ReactComponent(props) {\n    const [currentValue, setValue] = useSingleState(globalState, \"test\");\n    return (\n        \u003cdiv\u003e\n            \u003cp\u003eThe current value is: {currentValue}\u003c/p\u003e\n            \u003cbutton onClick={() =\u003e setValue(currentValue + 1)}\u003eIncrement\u003c/button\u003e\n        \u003c/div\u003e\n    );\n}\n```\n\nThe `useSingleState` hook allows for reading and updating a single property in an `obstate` instance.\n\nYou can also work with a full state object just as easily:\n\n```tsx\nimport React from \"react\";\nimport { createStateObject } from \"obstate\";\nimport { useState } from \"react-obstate\";\n\nconst globalState = createStateObject({\n    test: 100,\n    on: false\n});\n\nexport function ReactComponent(props) {\n    const [state, setPartial /*, setFull */] = useState(globalState);\n    return (\n        \u003cdiv\u003e\n            \u003cp\u003eThe current value is: {state.test}\u003c/p\u003e\n            \u003cp\u003ePower is \u003cstrong\u003e\u003c/strong\u003e\u003c/p\u003e\n            \u003cbutton onClick={() =\u003e setPartial({ test: state.test + 1 })}\u003eIncrement\u003c/button\u003e\n            \u003cbutton onClick={() =\u003e setPartial({ on: !state.on })}\u003eToggle\u003c/button\u003e\n        \u003c/div\u003e\n    );\n}\n```\n\nThe `useState` hook allows for reading and updating an entire `obstate` instance. The first parameter returned is the full state value at the current point in time (minus the `obstate` event emitter interface). The second is a partial-update method and the third is a full-update method.\n\nPartial updates allow for specifying only the properties you wish to update, whereas full updates completely rewrite the state object.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fperry-mitchell%2Freact-obstate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fperry-mitchell%2Freact-obstate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fperry-mitchell%2Freact-obstate/lists"}