Widgets for React

The widget library allows developers to quickly develop composable and reusable React components by defining a common interface for passing data across different modules of an application.

Installation

You can install with npm install widgets-for-react or yarn add widgets-for-react.

Basic usage

You can create a hello world widget application as follows:

let hello_world_app =
  stateful<string>()(s =>
    div<string>({ className:"form-group" })(
      label<string>("Type text here", { htmlFor:"main-input", label_position: "before" })(
        div<string>({ className:"input-group" })(
          string({ id:"main-input", className:"form-control" })(s)
        )
      )
    )
  )("Hello world!")

Widgets have a run method which can be invoked in order to embed the widget in a normal React application, as follows:

<div>
  { hello_world_app.run(res =>
    console.log("The widget has produced some output data", res)) }
</div>