This migration guide focuses on the process of migrating from Orbit v21 to v22.0, as some breaking changes were introduced. With this guide, we aim to walk through all the breaking changes and how they can be addressed, allowing the migration to be smoother and effortlessly.

The label prop in the SegmentedSwitch component now only accepts a string.

It used to accept a React node for translations, but this could lead to some unexpected or wrong HTML structure.

This change also allows for the aria-label attribute of the wrapper div to have the same value as the label prop.

The label prop in the InputSelect component now only accepts a string.

It used to accept a React node for translations, but this could lead to some unexpected or wrong HTML structure.

This change also allows for the aria-label attribute of the Modal Dialog rendered on Mobile to have the same value as the label prop.

The helpClosable prop in the ErrorFormTooltip component has been removed.

Because of that, the helpClosable prop was also removed from the components using the ErrorFormTooltip component internally, namely:

• InputField
• InputFile
• InputGroup
• InputSelect
• Select
• Textarea

Please adapt your code to remove the helpClosable prop from these components. Note that tooltip will still be closable on the outside click or when the associated input element loses focus.

Before:

import InputField from "@kiwicom/orbit-components/lib/InputField";
<InputField helpClosable={false} />;

Now:

import InputField from "@kiwicom/orbit-components/lib/InputField";
<InputField />;