{"id":15651795,"url":"https://github.com/lacolaco/reactive-store","last_synced_at":"2025-04-15T11:54:32.881Z","repository":{"id":37748918,"uuid":"120979802","full_name":"lacolaco/reactive-store","owner":"lacolaco","description":"A store implementation for state management with RxJS","archived":false,"fork":false,"pushed_at":"2025-03-31T18:29:35.000Z","size":3005,"stargazers_count":32,"open_issues_count":21,"forks_count":4,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-09T19:53:56.388Z","etag":null,"topics":["library","nodejs","rxjs","state-management","typescript"],"latest_commit_sha":null,"homepage":"https://yarn.pm/@lacolaco/reactive-store","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/lacolaco.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"github":["lacolaco"]}},"created_at":"2018-02-10T03:13:59.000Z","updated_at":"2025-02-19T22:15:31.000Z","dependencies_parsed_at":"2023-10-21T00:29:03.900Z","dependency_job_id":"ac1cf8a9-843f-4b56-bcca-4c7f4069c878","html_url":"https://github.com/lacolaco/reactive-store","commit_stats":{"total_commits":434,"total_committers":6,"mean_commits":72.33333333333333,"dds":0.4193548387096774,"last_synced_commit":"5e3fa08ee0058bb4811207a1fb4a6d936de56147"},"previous_names":["lacolaco/observable-state"],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lacolaco%2Freactive-store","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lacolaco%2Freactive-store/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lacolaco%2Freactive-store/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lacolaco%2Freactive-store/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lacolaco","download_url":"https://codeload.github.com/lacolaco/reactive-store/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249067773,"owners_count":21207395,"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":["library","nodejs","rxjs","state-management","typescript"],"created_at":"2024-10-03T12:40:11.415Z","updated_at":"2025-04-15T11:54:32.861Z","avatar_url":"https://github.com/lacolaco.png","language":"TypeScript","readme":"# @lacolaco/reactive-store\n\nVery simple store implementation for state management with RxJS.\n\nhttps://yarn.pm/@lacolaco/reactive-store\n\n[![CI](https://github.com/lacolaco/reactive-store/actions/workflows/ci.yml/badge.svg)](https://github.com/lacolaco/reactive-store/actions/workflows/ci.yml)\n\n[![npm version](https://badge.fury.io/js/%40lacolaco%2Freactive-store.svg)](https://badge.fury.io/js/%40lacolaco%2Freactive-store)\n\n## Install\n\n```\n$ yarn add rxjs @lacolaco/reactive-store\n```\n\n## Concept\n\n- RxJS: Use the ecosystem\n- TypeScript: Type-safe state management\n- Simple: Easy to understand what the library does and doesn't\n\n## How to Use\n\n- [Stackblitz Demo](https://stackblitz.com/edit/typescript-36dxgn?file=index.ts)\n- [Angular Examples](/examples/example-angular/src/app/examples/)\n\n### Create a store: `new Store({ initialValue })`\n\n```ts\nimport { Store } from '@lacolaco/reactive-store';\n\nexport interface CounterState {\n  count: number;\n}\n\nexport const initialValue: CounterState = {\n  count: 0,\n};\n\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue });\n```\n\n### Use the store\n\n#### Get the current value: `.value: T`\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue: 1 });\n\nconsole.log(counterStore.value); // =\u003e 1\n```\n\n#### Observe value changes: `.valueChanges: Observable\u003cT\u003e`\n\n`.valueChange` returns a _raw_ observable of the store.\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue: 1 });\n\ncounterStore.valueChanges.subscribe((value) =\u003e {\n  console.log(value); // =\u003e 1\n});\n\n// You can use `pipe` and operators of RxJS.\nconst doubled$: Observable\u003cnumber\u003e = counterStore.valueChanges.pipe(map((value) =\u003e value * 2));\n```\n\n#### Update the store: `.update((value: T) =\u003e T): void`\n\n`update` takes a function which takes the current value and returns a new value.\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue: 1 });\n\ncounterStore.update((value) =\u003e value + 1);\n\nconsole.log(counterStore.value); // =\u003e 2\n```\n\n#### Observe scoped value: `.select((value: T) =\u003e U): Observable\u003cU\u003e`\n\n`select` method is for mapping and memoize the scoped value.\nThis is using internally it uses RxJS's `map` and `distinctUntilChanged` operators.\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({\n  initialValue: { count: 1 },\n});\n\ncounterStore.valueChanges.subscribe((value) =\u003e {\n  console.log(value); // =\u003e { count: 1 }\n});\n\nconst selected$: Observable\u003cnumber\u003e = counterStore.select((value) =\u003e value.count);\n\nselected$.subscribe((value) =\u003e {\n  console.log(value); // =\u003e 1\n});\n```\n\n#### Listen update events: `.storeUpdateChanges: Observable\u003cStoreUpdateChange\u003cT\u003e\u003e`\n\nA store dispatchs a change event every time updating the store.\nThis is for debugging or integrating with other tools.\n\n```ts\nconst counterStore = new Store\u003cCounterState\u003e({\n  initialValue,\n});\n\ncounterStore.storeUpdateChanges.subscribe((change) =\u003e {\n  console.log(`Previous Value`, change.previousValue);\n  console.log(`Current Value`, change.currentValue);\n  console.log(`Label`, change.label);\n});\n```\n\n**label** is a string value you can pass to `update` as an option.\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue: 1 });\n\ncounterStore.update((value) =\u003e value + 1, { label: 'increment' });\n```\n\n#### Reset the store: `.reset(): void`\n\n`reset` the store with the initial value.\n\n```ts\nexport const counterStore = new Store\u003cCounterState\u003e({ initialValue: 1 });\n\ncounterStore.reset();\n```\n\n---\n\n### License\n\nMIT\n\n### Author\n\nSuguru Inatomi a.k.a. [@lacolaco](https://twitter.com/laco2net)\n","funding_links":["https://github.com/sponsors/lacolaco"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flacolaco%2Freactive-store","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flacolaco%2Freactive-store","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flacolaco%2Freactive-store/lists"}