ople
Event-driven, observable data flow for React 💥👀
Usage
The createOple
function constructs an Ople object, which is both observable
and readonly to React components. Expose methods for React components to call,
and expose events for React components to subscribe to.
TODO: document the "createOple" function
Classes
There are two ways to declare an Ople
subclass.
Pick whichever you prefer!
createClass
Classes made by createClass
meet the following criteria:
- extends the
Ople
class for event emitting and disposable effects - requires the
new
keyword to be constructed - can be extended
// Declare your props in TodoProps // Declare your state and methods in TodoState // Declare your events in TodoEvents // The type for `Todo` is declared like so:
extends Ople
The Ople
class can be extended by any class. This makes your class compatible with
Ople mixins, and it can even emit its own events.
The initOple
function lets your class create reactions and event listeners with
automatic disposal. If you create an Ople object inside initOple
's callback,
it will be attached to the Ople context, which means the attached Ople object will
have its dispose
method called when the Ople context is disposed.
// Declare your props in TodoProps // Declare your events in TodoEvents // BAD: Ople objects are readonly outside their initializer.todo.done = true // GOOD: Exposing a method is best practice.todo.toggleDone
Mixins
Mixins are functions that attach state, event listeners, and reactions to the
Ople
context in which they are called. Any function can be a mixin, just like
any function can be a React hook.
{ // TODO: mixin example} const state =
Ople also provides a few mixin helpers.
setEffect
The setEffect
function lets you attach a disposable object to the current
Ople context, so the former is disposed of when the latter is, but not vice
versa.
You must provide an "owner" object as a cache key, in case you need the effect disposed of before the Ople context is disposed.
Then, inside an Ople context, we can use our subscribe
mixin.
// The `source` can be any object from your favorite library,// assuming it has a `subscribe` method that returns a disposable.
setState
The setState
function is made for mixins that need to update state
by merging patch objects.
getOple
and expectOple
These functions are for accessing the current Ople context. Use getOple
if you want to check for null
manually. Otherwise, use expectOple
to
throw an error when no Ople context is active.