io.group

Combines multiple I/O method calls into a single form.

Individual I/O methods await within your action until user input is provided, such that each I/O method call results in a distinct step within the generated app. io.group allows you to group multiple I/O methods together to request input all at once in a single step.

caution

io.confirm and io.confirmIdentity are not supported within an io.group.

Custom validation can be performed on groups by chaining a .validate() method call to the group. Learn more about validation here.

Usage

TypeScript

const [name, email, age] = await io.group([
  io.input.text("Name"),
  io.input.email("Email"),
  io.input.number("Age"),
]);

// or

const { name, email, age } = await io.group({
  name: io.input.text("Name"),
  email: io.input.email("Email"),
  age: io.input.number("Age"),
});

JavaScript

const [name, email, age] = await io.group([
  io.input.text("Name"),
  io.input.email("Email"),
  io.input.number("Age"),
]);

// or

const { name, email, age } = await io.group({
  name: io.input.text("Name"),
  email: io.input.email("Email"),
  age: io.input.number("Age"),
});

Python

name, email, age = await io.group(
  io.input.text("Name"),
  io.input.email("Email"),
  io.input.number("Age"),
)

# or

values = await io.group(
  name=io.input.text("Name"),
  email=io.input.email("Email"),
  age=io.input.number("Age"),
)

print("Name:", values.name)

Props

Receives an array or object of I/O method calls as its first argument.

info

Dynamic inputs are supported, but discouraged as they make the result's types not statically determinable and extracting the results difficult to reason about.

Returns

Returns an array or object (depending on input) of its constituent I/O methods' return values.

Similarly to Promise.all or asyncio.gather, if the contents are defined inline or with constant types, the return values will be correctly typed.

Examples

Named values

TypeScript

Rather than relying on the index-based values returned when providing a list of sub-components to io.group, if you provide an object with named keys, Interval will return the results of the form as an object with values assigned to the provided key for each component. While only slightly more complicated to configure, this can be much more robust at access time or when refactoring the contents of the group.

const { name, email, age } = await io.group({
  name: io.input.text("Name"),
  email: io.input.email("Email"),
  age: io.input.number("Age"),
});

JavaScript

Rather than relying on the index-based values returned when providing a list of sub-components to io.group, if you provide an object with named keys, Interval will return the results of the form as an object with values assigned to the provided key for each component. While only slightly more complicated to configure, this can be much more robust at access time or when refactoring the contents of the group.

const { name, email, age } = await io.group({
  name: io.input.text("Name"),
  email: io.input.email("Email"),
  age: io.input.number("Age"),
});

Python

Rather than relying on the index-based values returned when providing unnamed sub-components to io.group, if you provide keyword arguments Interval will return the results of the form as an object with values assigned to the provided key for each component. While only slightly more complicated to configure, this can be much more robust at access time or when refactoring the contents of the group.

Unfortunately, type inference for these keys on the returned object is not available at this time.

values = await io.group(
  name=io.input.text("Name"),
  email=io.input.email("Email"),
  age=io.input.number("Age"),
);

print("Name:", values.name);
print("Email:", values.email);
print("Age:", values.age);

Customizing continue button choices

TypeScript

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

const {
  choice,
  returnValue: { num1, num2 },
} = await io
  .group({
    num1: io.input.number("First number"),
    num2: io.input.number("Second number"),
  })
  .withChoices(["Add", "Subtract", "Multiply"]);

See Submit buttons for more information.

JavaScript

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

const {
  choice,
  returnValue: { num1, num2 },
} = await io
  .group({
    num1: io.input.number("First number"),
    num2: io.input.number("Second number"),
  })
  .withChoices(["Add", "Subtract", "Multiply"]);

See Submit buttons for more information.

Python

Like with other IO methods, the continue buttons for the group can be customized with the .with_choices() chained method.

response = await io.group(
  num1=io.input.number("First number"),
  num2=o.input.number("Second number"),
).with_choices([
  "Add",
  "Subtract",
  "Multiply",
]);

See Submit buttons for more information.

Was this section useful?