Shape Step

The shape step allows for the selection of flat colors. The behavior of this step differs slightly from others. The shape step does not have variants exposed directly, instead it has a single option that is a list of color objects containing the data you require. The user may select a color from this list.

const colors = await shapeStep.getColors();
await shapeStep.setColor(colors[0]);

The interface for this function differs slightly from the typical shared interface getVariants and selectVariant. This is because the shape step provides an abstraction over the variants themselves. The user may select a color from this list.

// The colors can be found with the following.
const stroke = color.stroke;
const fill = color.fill;

// The name can be obtained from the underlying variant.
const variant = color.variant;
const name = variant.getName();