diff --git a/__snapshots__/notification/component/chromium/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/component/chromium/DBNotification-should-have-same-aria-snapshot.yaml
index 8247277d6e80..984a82eea26b 100644
--- a/__snapshots__/notification/component/chromium/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/component/chromium/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,2 +1 @@
-- article:
- - paragraph: Test
\ No newline at end of file
+- paragraph: Test
\ No newline at end of file
diff --git a/__snapshots__/notification/component/firefox/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/component/firefox/DBNotification-should-have-same-aria-snapshot.yaml
index 8247277d6e80..984a82eea26b 100644
--- a/__snapshots__/notification/component/firefox/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/component/firefox/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,2 +1 @@
-- article:
- - paragraph: Test
\ No newline at end of file
+- paragraph: Test
\ No newline at end of file
diff --git a/__snapshots__/notification/component/mobile-chrome/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/component/mobile-chrome/DBNotification-should-have-same-aria-snapshot.yaml
index 8247277d6e80..984a82eea26b 100644
--- a/__snapshots__/notification/component/mobile-chrome/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/component/mobile-chrome/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,2 +1 @@
-- article:
- - paragraph: Test
\ No newline at end of file
+- paragraph: Test
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/chromium/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/chromium/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/chromium/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/chromium/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/firefox/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/firefox/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/firefox/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/firefox/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/mobile-chrome/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/mobile-chrome/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/mobile-chrome/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/mobile-chrome/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/mobile-safari/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/mobile-safari/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/mobile-safari/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/mobile-safari/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/__snapshots__/notification/showcase/webkit/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml b/__snapshots__/notification/showcase/webkit/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
index 5dc551d555f5..c90a5aab869f 100644
--- a/__snapshots__/notification/showcase/webkit/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/notification/showcase/webkit/should-have-same-aria-snapshot/DBNotification-should-have-same-aria-snapshot.yaml
@@ -1,179 +1,130 @@
- main:
- heading "DBNotification" [level=1]
- link "Density"
- - article:
- - text: Headline
- - paragraph: functional
- - article:
- - text: Headline
- - paragraph: regular (Default)
- - article:
- - text: Headline
- - paragraph: expressive
+ - text: Headline
+ - paragraph: functional
+ - text: Headline
+ - paragraph: regular (Default)
+ - text: Headline
+ - paragraph: expressive
- link "Variant"
- - article:
- - text: Headline
- - paragraph: (Default) Docked
- - article:
- - text: Headline
- - paragraph: Standalone
- - article:
- - text: Headline
- - paragraph: Overlay
+ - text: Headline
+ - paragraph: (Default) Docked
+ - text: Headline
+ - paragraph: Standalone
+ - text: Headline
+ - paragraph: Overlay
- link "Semantic"
- - article:
- - text: Headline
- - paragraph: (Default) Adaptive
- - article:
- - text: Headline
- - paragraph: Neutral
- - article:
+ - text: Headline
+ - paragraph: (Default) Adaptive
+ - text: Headline
+ - paragraph: Neutral
+ - alert:
- text: Headline
- paragraph: Critical
- - article:
+ - status:
- text: Headline
- paragraph: Informational
- - article:
+ - status:
- text: Headline
- paragraph: Successful
- - article:
+ - alert:
- text: Headline
- paragraph: Warning
- link "Closeable"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - button "Close"
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - button "Close"
- link "Visual"
- - article:
- - paragraph: (Default) Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Image
+ - paragraph: (Default) Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Image
- link "Show Icon"
- - article:
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Link Variant"
- - article:
- - paragraph: (Default) Block
- - link "Textlink"
- - article:
- - paragraph: Inline
- - link "Textlink"
+ - paragraph: (Default) Block
+ - link "Textlink"
+ - paragraph: Inline
+ - link "Textlink"
- link "Show Headline"
- - article:
- - text: Headline
- - paragraph: (Default) True
- - article:
- - paragraph: "False"
+ - text: Headline
+ - paragraph: (Default) True
+ - paragraph: "False"
- link "Show Timestamp"
- - article:
- - paragraph: (Default) False
- - article:
- - paragraph: "True"
- - text: 10 min ago
+ - paragraph: (Default) False
+ - paragraph: "True"
+ - text: 10 min ago
- link "Examples - VariantDocked":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantStandalone":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
- link "Examples - VariantOverlay":
- - article:
- - paragraph: Text
- - article:
- - paragraph: Text & Icon
- - article:
- - img "this is a fancy placeholder"
- - paragraph: Text & Preview Image
- - article:
- - text: Headline
- - paragraph: Text & Headline
- - article:
- - paragraph: Text & Textlink Inline
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block
- - link "Textlink"
- - article:
- - paragraph: Text & Textlink Block & Timed
- - text: 10 min ago
- - link "Textlink"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
- - link "Textlink"
- - button "Close"
- - article:
- - paragraph: Text & Timed
- - text: 10 min ago
- - article:
- - paragraph: Text & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
- - article:
- - text: Headline
- - paragraph: Text & Icon & Headline & Timed & Closeable
- - text: 10 min ago
- - button "Close"
\ No newline at end of file
+ - paragraph: Text
+ - paragraph: Text & Icon
+ - img "this is a fancy placeholder"
+ - paragraph: Text & Preview Image
+ - text: Headline
+ - paragraph: Text & Headline
+ - paragraph: Text & Textlink Inline
+ - link "Textlink"
+ - paragraph: Text & Textlink Block
+ - link "Textlink"
+ - paragraph: Text & Textlink Block & Timed
+ - text: 10 min ago
+ - link "Textlink"
+ - text: Headline
+ - paragraph: Text & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Textlink Inline & Closeable
+ - link "Textlink"
+ - button "Close"
+ - paragraph: Text & Timed
+ - text: 10 min ago
+ - paragraph: Text & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
+ - text: Headline
+ - paragraph: Text & Icon & Headline & Timed & Closeable
+ - text: 10 min ago
+ - button "Close"
\ No newline at end of file
diff --git a/packages/components/src/components/notification/notification.lite.tsx b/packages/components/src/components/notification/notification.lite.tsx
index 5fe10cce89c9..70a2f0419cd7 100644
--- a/packages/components/src/components/notification/notification.lite.tsx
+++ b/packages/components/src/components/notification/notification.lite.tsx
@@ -12,6 +12,7 @@ import {
cls,
getBoolean,
getBooleanAsString,
+ getNotificationRole,
stringPropVisible
} from '../../utils';
import DBButton from '../button/button.lite';
@@ -37,10 +38,11 @@ export default function DBNotification(props: DBNotificationProps) {
// jscpd:ignore-end
return (
-
-
+
);
}
diff --git a/packages/components/src/utils/index.ts b/packages/components/src/utils/index.ts
index e7d32fa96d26..9a7db9119967 100644
--- a/packages/components/src/utils/index.ts
+++ b/packages/components/src/utils/index.ts
@@ -178,3 +178,21 @@ export const isKeyboardEvent = (
event?: ClickEvent | GeneralKeyboardEvent
): event is GeneralKeyboardEvent =>
(event as GeneralKeyboardEvent).key !== undefined;
+
+/**
+ * Maps semantic values to appropriate ARIA roles for notifications
+ * @param semantic - The semantic type of the notification
+ * @returns The appropriate ARIA role or undefined for default behavior
+ */
+export const getNotificationRole = (semantic?: string): string | undefined => {
+ switch (semantic) {
+ case 'critical':
+ case 'warning':
+ return 'alert';
+ case 'informational':
+ case 'successful':
+ return 'status';
+ default:
+ return undefined;
+ }
+};