A simple widget to switch between options

This repository contains the ui-switch-options node for the flowfuse Node-RED Dashboard 2.0.

It allows you to create a widget that lets users switch between different options using "Previous" and "Next" buttons. It's designed to provide a simple way to navigate through a list of options and return the selected value

The usual method of installing is to use Manage Palette in the Node-RED editor and search for @vincentgloss/node-red-dashboard-2-ui-switch-options and install it.

Using npm directly, cd into your node red user directory (usually .node-red in your home folder) and from there run
``npm install @vincentgloss/node-red-dashboard-2-ui-switch-options`

`$3`

- payload (string): A valid value of the option to be selected. This is also emitted whenever an option is switched.

`$3`

- Name: The name of the node, which helps identify it in the Node-RED editor. - Group: The display group in which the widget will be shown on the dashboard. - Size: The dimensions of the widget. This will automatically adjust based on the group configuration. - Options: A list of options for the widget. Each option should have alabel (accepts plain html) and a value. These are the options users can switch between. - Label: A text label (optional, accepts plain html) that appears above the widget on the dashboard. - Prev Icon: If provided, this Material Design icon will replace the default prev icon. No need to include themdiprefix. - Next Icon: If provided, this Material Design icon will replace the default next icon. No need to include themdiprefix. - Icon Color: The color of the prev and next icons. The colors may be recognized names such as "red" or "skyblue," or may be numerically specified, e.g.,#AEEA00. The set of named colors can be found here. - Icon Size: The size of the prev and next icons. The size may be numerically specified inpx. - Button Color: The color of the prev and next buttons. The colors may be recognized names such as "red" or "skyblue," or may be numerically specified, e.g.,#AEEA00`. The set of named colors can be found here.

Example images from the widget in the Dashboard

!ui-switch-option1
!ui-switch-option2

A simple widget to switch between options

This repository contains the ui-switch-options node for the flowfuse Node-RED Dashboard 2.0.

The usual method of installing is to use Manage Palette in the Node-RED editor and search for @vincentgloss/node-red-dashboard-2-ui-switch-options and install it.

Using npm directly, cd into your node red user directory (usually .node-red in your home folder) and from there run
``


npm install @vincentgloss/node-red-dashboard-2-ui-switch-options

$3

- payload (string): A valid value of the option to be selected. This is also emitted whenever an option is switched.

$3

- Name: The name of the node, which helps identify it in the Node-RED editor.
- Group: The display group in which the widget will be shown on the dashboard.
- Size: The dimensions of the widget. This will automatically adjust based on the group configuration.
- Options: A list of options for the widget. Each option should have a

label (accepts plain html) and a value

. These are the options users can switch between.
- Label: A text label (optional, accepts plain html) that appears above the widget on the dashboard.
- Prev Icon: If provided, this Material Design icon will replace the default prev icon. No need to include the

mdi

 prefix.
- Next Icon: If provided, this Material Design icon will replace the default next icon. No need to include the

mdi

 prefix.
- Icon Color: The color of the prev and next icons. The colors may be recognized names such as "red" or "skyblue," or may be numerically specified, e.g.,

#AEEA00

. The set of named colors can be found here.
- Icon Size: The size of the prev and next icons. The size may be numerically specified in

.
- Button Color: The color of the prev and next buttons. The colors may be recognized names such as "red" or "skyblue," or may be numerically specified, e.g.,

#AEEA00`. The set of named colors can be found here.