{"id":20430736,"url":"https://github.com/jaguar-dart/observable_ish","last_synced_at":"2025-10-12T15:47:12.953Z","repository":{"id":53485278,"uuid":"138623043","full_name":"Jaguar-dart/observable_ish","owner":"Jaguar-dart","description":"Observable state and events for browser and Flutter.","archived":false,"fork":false,"pushed_at":"2024-09-19T12:30:43.000Z","size":54,"stargazers_count":25,"open_issues_count":1,"forks_count":5,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-12-09T23:12:27.663Z","etag":null,"topics":["binding","emitter","events","flutter","list","map","mobile","observable","pipe","react","react-native","reactive","set","ui"],"latest_commit_sha":null,"homepage":null,"language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Jaguar-dart.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}},"created_at":"2018-06-25T16:42:05.000Z","updated_at":"2024-10-28T15:56:02.000Z","dependencies_parsed_at":"2024-08-02T23:05:45.705Z","dependency_job_id":null,"html_url":"https://github.com/Jaguar-dart/observable_ish","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaguar-dart%2Fobservable_ish","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaguar-dart%2Fobservable_ish/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaguar-dart%2Fobservable_ish/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaguar-dart%2Fobservable_ish/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Jaguar-dart","download_url":"https://codeload.github.com/Jaguar-dart/observable_ish/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":230527866,"owners_count":18240051,"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":["binding","emitter","events","flutter","list","map","mobile","observable","pipe","react","react-native","reactive","set","ui"],"created_at":"2024-11-15T08:08:49.562Z","updated_at":"2025-10-12T15:47:07.911Z","avatar_url":"https://github.com/Jaguar-dart.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# observable_ish\n\nWrite elegant reactive cross-platform client side application using observable states and event emitters. \n\nProvides:\n\n1. [Reactive Values][RxValue]\n2. [Reactive Lists][RxList]\n3. [Reactive Sets][RxSet]\n4. [Reactive Maps][RxMap]\n5. [Event emitter][Emitter]\n\n## Philosophy\n\nObservable-ish provides a light-weight non-intrusive reactive framework to build cross-platform UI. It uses Dart's \nasynchronous `Stream`s to emit and listen to changes.\n\nVarious observable types like [`RxValue`][RxValue], [`RxList`][RxList], [`RxSet`][RxSet] and [`RxMap`][RxMap] can be \nused to update UI automatically on changes. Events can be passed up the widget tree using event [`Emitter`][Emitter].\n\n## Reactive values\n\n[`RxValue`][RxValue] can be used to encapsulate a simple observable value. \n\n### Getting and setting value\n\n[`RxValue`][RxValue] exposes field [`value`][RxValue_value] to get set current value. \n\n\n```dart\nmain() {\n  final rxInts = RxValue\u003cint\u003e(initial: 5);\n  int got = rxInts.value; // Gets current value\n  rxInts.value = 10;      // Sets current value\n}\n```\n\nWhen a value that is different from the existing value is set, the change is notified through various ways explained in the\nsection.\n\n### Listening to changes\nIt provides few flexible ways to listen to changes:\n\n1. [onChange: Record of changes][RxValue_onChange]\n2. [values: Stream of new values][RxValue_values]\n3. [listen: Callback function with new value][RxValue_listen]\n\n```dart\nmain() {\n  final rxInts = RxValue\u003cint\u003e(initial: 5);\n  print(rxInts.value);  // =\u003e 5\n  rxInts.values.listen((int v) =\u003e print(v));  // =\u003e 5, 20, 25\n  rxInts.value = 20;\n  rxInts.value = 25;\n}\n```\n\n### Binding to a value\n\nBinding an `RxValue` to a `Stream` (using method [`bindStream`][RxValue_bindStream]) or another `RxValue` \n(using method [`bind`][RxValue_bind]) changes its value when the source `Stream` emits or `RxValue` changes. This is very \nuseful in scenarios where one would like to change a model's value or widget's property when control changes. For example, \nchange a text field's value when a checkbox is toggled.\n\n```dart\n  textBox.value.bindStream(checkBox.checked.map((bool v) =\u003e v?'Female': 'Male'));\n```\n\n### Full examples\n\n```dart\nmain() {\n  final rxInts = RxValue\u003cint\u003e(initial: 5);\n  print(rxInts.value);  // =\u003e 5\n  rxInts.value = 10;\n  rxInts.value = 15;\n  rxInts.values.listen((int v) =\u003e print(v));  // =\u003e 15, 20, 25\n  rxInts.value = 20;\n  rxInts.value = 25;\n}\n```\n\n## Composite reactive objects\n\nObservable-ish is designed to be non-intrusive. The philosophy is to separate the model and its reactive cousin into \ndifferent classes.\n\n```dart\nclass RxUser {\n  final name = RxValue\u003cString\u003e();\n  final age = RxValue\u003cint\u003e();\n}\n\nclass User {\n  final rx = RxUser();\n\n  User({String name, int age}) {\n    this.name = name;\n    this.age = age;\n  }\n\n  String get name =\u003e rx.name.value;\n  set name(String value) =\u003e rx.name.value = value;\n\n  int get age =\u003e rx.age.value;\n  set age(int value) =\u003e rx.age.value = value;\n}\n\nmain() {\n  final user = User(name: 'Messi', age: 30);\n  user.age = 31;\n  print(user.age);  // =\u003e 31\n  print('---------');\n  user.age = 32;\n  user.rx.age.listen((int v) =\u003e print(v));  // =\u003e 20, 25\n  user.age = 33;\n  user.age = 34;\n  user.age = 35;\n}\n```\n\n## Event emitter\n\n`Emitter`s provide a simple interface to emit and listen to events. It is designed to inter-operate with `RxValue` to provide\nmaximum productivity.\n\n### Listening to a event\n\n1. [on: Execute callback on event][Emitter_on]\n2. [listen: Similar to Stream][Emitter_listen]\n3. [asStream: Obtain event as Stream][Emitter_asStream]\n\n### Piping events\n\n[`pipeTo`][Emitter_pipeTo] pipes events to another `Emitter`.\n\n[`pipeToValue`][Emitter_pipeToValue] pipes events to the given `RxValue`. This could be very helpful in binding events \nto observable values.\n\n### Emitting events\n\n`emit`, `emitOne`, `emitAll`, `emitStream` and `emitRxValue` provides various ways to emit events using the `Emitter`\n\n## Reactive Lists\n\n`RxList` notifies changes (addition, removal, clear, setting) of its elements.\n\n### Updating RxList\n\n`RxList` implements Dart's `List`. \n\nBesides `List`'s methods, `RxList` provides convenient methods like [`addIf`][RxList_addIf] and [`addAllIf`][RxList_addAllIf] \nto add elements based on a condition. This is very useful in writing UI in Dart DSL (as in Flutter and Nuts).\n\n```dart\nmain() {\n  final rxInts = RxList\u003cint\u003e();\n  rxInts.onChange.listen((c) =\u003e print(c.element)); // =\u003e 5\n  rxInts.addIf(5 \u003c 10, 5);\n  rxInts.addIf(5 \u003e 9, 9);\n}\n```\n\nUse `assign` and `assignAll` methods to replace existing contents of the list with new content.\n\n### Listening for changes\n\n[`onChange`][RxList_onChange] exposes a `Stream` of record of change of the `List`.\n\n## Reactive Sets\n\n`RxSet` notifies changes (addition and removal) of its elements.\n\n### Updating RxSet\n\n`RxSet` implements Dart's `Set`. \n\nBesides `Set`'s methods, `RxSet` provides convenient methods like [`addIf`][RxSet_addIf] and [`addAllIf`][RxSet_addAllIf] \nto add elements based on a condition. This is very useful in writing UI in Dart DSL (as in Flutter and Nuts).\n\n```dart\nmain() {\n  final rxInts = RxSet\u003cint\u003e();\n  rxInts.onChange.listen((c) =\u003e print(c.element)); // =\u003e 5\n  rxInts.addIf(5 \u003c 10, 5);\n  rxInts.addIf(5 \u003e 9, 9);\n}\n```\n\n### Listening for changes\n\n[`onChange`][RxSet_onChange] exposes a `Stream` of record of change of the `Set`.\n\n### Binding\n\n`bindBool` and `bindBoolValue` allows removing or adding the given element based on the `Stream` of\n`bool`s or `RxValue` of `bool`s.\n\n`bindOneByIndexStream` and `bindOneByIndex` allows removing all but the one element from a given `Iterable`\nof elements based on index `Stream` or `RxValue`.\n\n## Reactive Maps\n\n`RxMap` notifies changes (addition, removal, clear, setting) of its elements.\n\n### Updating RxMap\n\n`RxMap` implements Dart's `Map`. \n\nBesides `Map`'s methods, `RxMap` provides convenient methods like `addIf` and `addAllIf` to add elements based on a \ncondition. This is very useful in writing UI in Dart DSL (as in Flutter and Nuts).\n\n### Listening for changes\n\n`onChange` exposes a `Stream` of record of change of the `Map`.\n\n[RxValue]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue-class.html\n[RxList]: https://pub.dartlang.org/documentation/observable_ish/latest/list_list/RxList-class.html\n[RxSet]: https://pub.dartlang.org/documentation/observable_ish/latest/set_set/RxSet-class.html\n[RxMap]: https://pub.dartlang.org/documentation/observable_ish/latest/map_map/RxMap-class.html\n[Emitter]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter-class.html\n[RxValue_value]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/value.html\n[RxValue_onChange]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/onChange.html\n[RxValue_values]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/values.html\n[RxValue_listen]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/listen.html\n[RxValue_bindStream]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/bindStream.html\n[RxValue_bind]: https://pub.dartlang.org/documentation/observable_ish/latest/value_value/RxValue/bind.html\n[RxList_addIf]: https://pub.dartlang.org/documentation/observable_ish/latest/list_list/RxList/addIf.html\n[RxList_addAllIf]: https://pub.dartlang.org/documentation/observable_ish/latest/list_list/RxList/addAllIf.html\n[RxList_onChange]: https://pub.dartlang.org/documentation/observable_ish/latest/list_list/RxList/onChange.html\n[RxSet_addIf]: https://pub.dartlang.org/documentation/observable_ish/latest/set_set/RxSet/addIf.html\n[RxSet_addAllIf]: https://pub.dartlang.org/documentation/observable_ish/latest/set_set/RxSet/addAllIf.html\n[RxSet_onChange]: https://pub.dartlang.org/documentation/observable_ish/latest/set_set/RxSet/onChange.html\n[Emitter_on]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter/on.html\n[Emitter_listen]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter/listen.html\n[Emitter_asStream]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter/asStream.html\n[Emitter_pipeTo]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter/pipeTo.html\n[Emitter_pipeToValue]: https://pub.dartlang.org/documentation/observable_ish/latest/event_event/Emitter/pipeToValue.html","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjaguar-dart%2Fobservable_ish","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjaguar-dart%2Fobservable_ish","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjaguar-dart%2Fobservable_ish/lists"}