diff --git a/src/components/BannerNotification/BannerNotification.module.css b/src/components/BannerNotification/BannerNotification.module.css index 566143f22..4b62c1158 100644 --- a/src/components/BannerNotification/BannerNotification.module.css +++ b/src/components/BannerNotification/BannerNotification.module.css @@ -8,9 +8,6 @@ * Message of information, success, caution, or warning to the user. */ .banner { - /* Position is relative to allow for absolute-positioned close button. */ - position: relative; - /* Grid is used to separate the icon from the text with correct spacing. */ display: flex; gap: 1rem; padding: 1rem; diff --git a/src/components/BannerNotification/BannerNotification.tsx b/src/components/BannerNotification/BannerNotification.tsx index bdb28bcd9..090014182 100644 --- a/src/components/BannerNotification/BannerNotification.tsx +++ b/src/components/BannerNotification/BannerNotification.tsx @@ -21,12 +21,12 @@ export type BannerNotificationProps = { */ className?: string; /** - * Callback when banner is dismissed. When passed in, renders banner with a close icon in the top right. + * Callback when notification is dismissed. When passed in, renders banner with a close icon in the top right. */ onDismiss?: () => void; // Design API /** - * + * Whether the button layout for the call to action is vertical or horizontal. */ buttonLayout?: 'vertical' | 'horizontal'; /** @@ -42,7 +42,7 @@ export type BannerNotificationProps = { */ subTitle?: string; /** - * The title/heading of the banner + * The title/heading of the notification */ title?: string; }; @@ -125,7 +125,7 @@ export const BannerNotification = ({ )} - + {/* TODO-AH: Use `Button` properly */} {onDismiss && ( + )} + + ); +}; diff --git a/src/components/Toast/__snapshots__/Toast-v2.test.ts.snap b/src/components/Toast/__snapshots__/Toast-v2.test.ts.snap new file mode 100644 index 000000000..9c242381b --- /dev/null +++ b/src/components/Toast/__snapshots__/Toast-v2.test.ts.snap @@ -0,0 +1,100 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` (v2) Error story renders snapshot 1`] = ` +
+
+ + + error + + + +

+ You've got toast! +

+
+
+`; + +exports[` (v2) NotDismissable story renders snapshot 1`] = ` +
+
+ + + success + + + +

+ You've got toast! +

+
+
+`; + +exports[` (v2) Success story renders snapshot 1`] = ` +
+
+ + + success + + + +

+ You've got toast! +

+
+
+`;