Skip to main content
Big news! Interval has been acquired by Meter. Learn more →

Submit buttons

By default, each "step" within your action that requests user input renders a single submit button allowing the person running the action to move on when they've filled out the form.

You may want to customize this button, or provide multiple paths forward, allowing for branching logic so that one action can do more than one thing and the person running the action can flexibly change behavior as needed.

To accomplish this, chain any I/O method or group with withChoices(), and pass an array of options defining the available paths forward. Each provided option will render a button in the action UI, and change the I/O method or group return value to contain a choice identifying the chosen button in addition to the usual return value(s) from the I/O methods.

Perform any conditional logic or branching based off this choice value as you would any variable.

let { choice, returnValue } = await io.input
.number("Enter a number")
"Round up",
{ label: "Make it negative", value: "negate", theme: "secondary" },
{ label: "Divide by zero", value: "divide-by-zero", theme: "danger" },

if (choice === "Round up") {
returnValue = Math.ceil(returnValue);

If you want the value returned as choice to be different than the button label, or want to customize the button theme, you can customize it by passing an object with label, value, and optional theme properties for the option.

The first option passed to withChoices effectively serves as the default, and will be chosen if the person running the action submits the form with ⌘+Enter or Ctrl+Enter.

Usage with

Like with other IO methods, the submit buttons for an can be customized with the .withChoices() chained method.

const {
returnValue: { num1, num2 },
} = await io
num1: io.input.number("First number"),
num2: io.input.number("Second number"),
.withChoices(["Add", "Subtract", "Multiply"]);
Did this section clearly explain what you wanted to learn?