Widgets

Widgets are components that can render UI elements and visualizations on the screen. To preview their rendering, you can expand widgets directly on the app's Dataflow canvas or arrange them on the Layout view. Widgets are the only components that can capture user input or interactions, such as clicks, scrolls, and other mouse or touchpad gestures.

The following are the categories of widgets supported in Kelp:

🗃️ Charts

5 items

🗃️ Tables

3 items

🗃️ Vega Charts

2 items

📄️ Calendar

Displays calendar and lets the user select a date.

📄️ Card

An SVG icon that can be used as a button.

📄️ Code Editor

A versatile text and code editor that you can embed in your app.

📄️ Entity Browser

Provides a generic entity browser/picker/selector in a folder-like structure (similar to a common file browser).

📄️ Form

Dynamically generates an HTML form out of a JSON schema using the the react-jsonschema-form library. It supports customizing the form's look and feel using a UI schema.

📄️ List

List widget displays a list of items with one or many numeric properties. Numeric values are overlaid over the item names as colored bars, effectively creating a nice scrollable bar chart.

📄️ Log

Records all incoming events and outputs a text/JSON representation of each event or signal with its timestamp. It is often used for tracing events on one or many streams.

📄️ Message Input

Enabling users to input and submit short text messages in chat and similar applications.

📄️ Metric Card

Displays a list of metrics with labels, change over a time period, and a sparkline chart.

📄️ Multi Select

Use Multi Select widget for choosing multiple items in a list.

📄️ Navbar

Navbars present useful navigation controls usually at the top of an application.

📄️ Property List

Displays a list of name-value pairs as a simple two-column table. Its used for displaying properties of an object or an arbitrary list of name/value pairs.

📄️ Text

Renders rich HTML text from Markdown formatted input.