Merge branch 'bug/187' into development

a-ui · Oct 17, 2023 · dfb61ee · dfb61ee
2 parents 31c6e68 + 20c108b
commit dfb61ee
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,14 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## Unreleased
+
+### Fixed
+
+- An `Alert` component without a title label will no longer add a margin pushing the description down.
+
+=======
+
 ## 7.0.4
 
 ### Changed

diff --git a/documentation/playground/src/molecules/AlertExamples.tsx b/documentation/playground/src/molecules/AlertExamples.tsx
@@ -17,7 +17,6 @@ export function AlertExamples() {
         </div>
         <div className="u-margin-top">
           <Alert
-            title={{ label: 'Modal alert success' }}
             titleId="title2"
             theme="success"
             confirmButton={{

diff --git a/packages/antwerp-ui/react-components/src/lib/molecules/alert/Alert.tsx b/packages/antwerp-ui/react-components/src/lib/molecules/alert/Alert.tsx
@@ -26,9 +26,11 @@ const renderModalAlert = (className: string, props: AlertProps) => {
           <Icon name={THEME_ICON_MAP[theme]} />
         </span>
       )}
-      <HeaderTag id={titleId} className="u-margin-bottom-xs">
-        {title?.label}
-      </HeaderTag>
+      {title?.label && (
+        <HeaderTag id={titleId} className="u-margin-bottom-xs">
+          {title.label}
+        </HeaderTag>
+      )}
       <p className={textClass}>{children}</p>
       <div className="m-alert__actions">
         {confirmButton ? <Button {...confirmButton} /> : null}