Codemods

Alert Transform

Converts a v6 Alert component to a v7 ComponentLevelNotification component.

Automatic Changes

• Renames the import and usages of Alert to ComponentLevelNotification.
• Renames the showStateIcon prop to showIcon.
• Attempts to transform the deprecated theme prop to the className prop. If it cannot, deletes the theme prop.

For example:

1import { Alert } from '@americanexpress/dls-react6';
2
3export default function Page() {
4  return (
5    <Alert showStateIcon={false} {...otherProps}>
6      Text
7    </Alert>
8  );
9}

Transforms into:

1import { ComponentLevelNotification } from '@americanexpress/dls-react';
2
3export default function Page() {
4  return (
5    <ComponentLevelNotification showIcon={false} {...otherProps}>
6      Text
7    </ComponentLevelNotification>
8  );
9}

Manual Changes

Aria Role

In v6, role gets its value based on the aria-live value. If aria-live is assertive, then role is alert. Otherwise, it has no role. In v7, the role is a prop, and the role is derived from the role prop, if available. Otherwise, it derives the role from the aria-live.