Skip to main content

Adding to Canvas

The Input Widget is available in the component palette in the Form Builder.

Steps​

  1. Open your form in the Form Builder
  2. Add a Row to the canvas if one is not already in place — see Building Layouts
  3. Locate the Input widget in the component palette
  4. Drag the widget into an empty Row segment
  5. The widget is added with default settings applied
info

Input widgets must be placed inside a Row segment. They cannot be dropped directly onto the canvas.

Selecting the Input Mode​

After placing the widget in a segment, open the Properties Panel on the left side and select the input mode:

  • Text — standard single-line text input
  • Text with Copy — text input with a copy-to-clipboard button
  • Date — date picker
  • Time — time picker
  • Date & Time — combined date and time picker
  • Phone — phone number input with configurable mask
  • Currency — formatted numeric and currency input
  • Password — masked input with visibility toggle
info

The mode you select determines which properties are shown in the panel. You can change the mode at any time during design, but mode-specific settings (such as date formats, currency configuration, or phone masks) will need to be reconfigured after switching.

Next Steps​

  • Properties — full reference for all widget-level settings per mode
  • Input Events — understand when and how events are sent to the backend