{"id":18654993,"url":"https://github.com/ethworks/reactive-properties","last_synced_at":"2025-07-18T10:07:18.875Z","repository":{"id":44217100,"uuid":"207537259","full_name":"EthWorks/reactive-properties","owner":"EthWorks","description":"Simple reactive property system","archived":false,"fork":false,"pushed_at":"2022-02-11T01:01:14.000Z","size":309,"stargazers_count":19,"open_issues_count":3,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-06-03T12:04:19.268Z","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":"unlicense","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EthWorks.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-09-10T11:09:06.000Z","updated_at":"2022-08-22T11:09:25.000Z","dependencies_parsed_at":"2022-08-24T20:10:48.473Z","dependency_job_id":null,"html_url":"https://github.com/EthWorks/reactive-properties","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/EthWorks/reactive-properties","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EthWorks%2Freactive-properties","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EthWorks%2Freactive-properties/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EthWorks%2Freactive-properties/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EthWorks%2Freactive-properties/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EthWorks","download_url":"https://codeload.github.com/EthWorks/reactive-properties/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EthWorks%2Freactive-properties/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265738459,"owners_count":23820162,"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-11-07T07:17:22.666Z","updated_at":"2025-07-18T10:07:18.852Z","avatar_url":"https://github.com/EthWorks.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n  \u003cimg width=\"500\" src=\"https://raw.githubusercontent.com/UniLogin/reactive-properties/master/logo.png\"\u003e\n  \u003cbr\u003e\n\n[![NPM](https://img.shields.io/npm/v/reactive-properties.svg)](https://www.npmjs.com/package/reactive-properties)\n[![CircleCI](https://img.shields.io/circleci/build/github/UniLogin/reactive-properties/master.svg)](https://circleci.com/gh/UniLogin/reactive-properties/tree/master)\n[![License](https://img.shields.io/github/license/UniLogin/reactive-properties.svg)](https://github.com/UniLogin/reactive-properties/blob/master/UNLICENSE)\n\n\u003c/div\u003e\n\n# reactive-properties\n\nA lightweight alternative for RX and Redux, that utilises react hooks and dramatically reduces the amount of boiler plate code for the typical React application.\n\n## Installation\n```\nnpm install --save reactive-properties\nyarn add reactive-properties\n```\n\n## Documetation\n\n### `Property`\n\n```typescript\ninterface Property\u003cT\u003e {\n  \n  get(): T // returns the current value\n\n  subscribe(callback: () =\u003e void): () =\u003e void // subscribe to future values\n\n}\n```\n\nProperty is just a variable that can be observed.\n\nTo get the current value use the `get` method. To subscribe to future updates, use the `subscribe` method. Subscribe returns a function which can be called to unsubscribe from updates.\n\n#### Piping\n\nFor developer convenience all properties have a `pipe` method. It can be used to apply operators to a property.\n\n```typescript\nproperty.pipe(\n  withEffect(() =\u003e { ... }),\n  map(x =\u003e x * 2),\n)\n```\n\n### `State`\n\nSimplest property implementation. You provide the default value and can call the `set` method to update the value.\n\n```typescript\nconst state = new State(5)\n\nconsole.log(state.get()) // prints 5\n\nstate.set(42)\n\nconsole.log(state.get()) // prints 42\n\nstate.subscribe(() =\u003e console.log('Update:', state.get()))\n\nstate.set(99) // \"Update: 99\" is printed to the console\n\n```\n\nSends update notifications to all subscribers when the new value is set.\n\n\n### `combine`\n\nUsed to combine multiple properties into one.\n\n```typescript\nconst a = new State(2)\nconst b = new State(2)\n\nconst sum = combine([a, b], (a, b) =\u003e a + b) // sum is 4\n\nb.set(5) // sum is now 7\n\na.set(6) // sum is now 11\n```\n\nUpdates every time when one of the source properties update.\n\n### `map` operator\n\nWorks similarly to `Array.map`. Creates a new property which will always have values that are obtained by mapping the original property's values with the provided function.\n\n### `withEffect` operator\n\nProvides a way to add custom imperative logic when something starts observing the property.\n\n```typescript\nproperty.pipe(\n  withEffect(() =\u003e {\n    console.log('Property started to be observed')\n\n    return () =\u003e console.log('All observers unsubscribed')\n  })\n)\n```\n\nWorks similarly to `React`'s `useEffect`. Can be usefull to start and stop background tasks when user visits a specific page, for example.\n\n\n### `forEach` operator\n\nCalls provided callback for each value that a property has. Including the current one.\n\n### `waitFor` operator\n\nConverts the property to a promise that resolves when the provided predicate returns true. Promise resolves with the first value that matched the predicate.\n\n### `dedupBy` operator\n\nStops updates when property values don't change. Example:\n\n```typescript\nconst state = new State(0)\n\nstate.forEach(console.log) // prints 0\n\nstate.set(0) // nothing printed\n\nstate.set(1) // prints 1\n\nstate.set(1) // nothing printed\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fethworks%2Freactive-properties","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fethworks%2Freactive-properties","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fethworks%2Freactive-properties/lists"}