From 671d8f9e5aa72098cec199f43588d37354006e0a Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 Apr 2024 11:34:05 +0100
Subject: [PATCH 1/4] set default for _imageAlignment for popup images

---
 templates/hotgraphicPopup.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/hotgraphicPopup.jsx b/templates/hotgraphicPopup.jsx
index 66bbd92..ad8d203 100644
--- a/templates/hotgraphicPopup.jsx
+++ b/templates/hotgraphicPopup.jsx
@@ -37,7 +37,7 @@ export default function HotgraphicPopup(props) {
         aria-hidden={!_isActive ? true : null}
         >
 
-          {(_imageAlignment === 'left' || _imageAlignment === 'top') &&
+          {(_imageAlignment !== 'right' && _imageAlignment !== 'bottom') &&
           <templates.image {..._graphic}
             classNamePrefixSeparator='__item-'
             classNamePrefixes={['component-item', 'hotgraphic-popup']}

From ef6dd46b7fe81872a498439220a1bcfbb076e5cf Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 Apr 2024 12:20:03 +0100
Subject: [PATCH 2/4] align _imageAlignment for popup images with schema
 defaults

schema defaults to 'right'
---
 templates/hotgraphicPopup.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/templates/hotgraphicPopup.jsx b/templates/hotgraphicPopup.jsx
index ad8d203..6ee45b7 100644
--- a/templates/hotgraphicPopup.jsx
+++ b/templates/hotgraphicPopup.jsx
@@ -30,14 +30,14 @@ export default function HotgraphicPopup(props) {
           _isRound && 'is-round',
           _isVisited && 'is-visited',
           _isActive && 'is-active',
-          _imageAlignment && `align-image-${_imageAlignment}`
+          _imageAlignment ? `align-image-${_imageAlignment}` : 'align-image-right'
         ])}
         key={index}
         data-index={index}
         aria-hidden={!_isActive ? true : null}
         >
 
-          {(_imageAlignment !== 'right' && _imageAlignment !== 'bottom') &&
+          {(_imageAlignment === 'left' || _imageAlignment === 'top') &&
           <templates.image {..._graphic}
             classNamePrefixSeparator='__item-'
             classNamePrefixes={['component-item', 'hotgraphic-popup']}
@@ -76,7 +76,7 @@ export default function HotgraphicPopup(props) {
             </div>
           </div>
 
-          {(_imageAlignment === 'right' || _imageAlignment === 'bottom') &&
+          {(_imageAlignment !== 'left' && _imageAlignment !== 'top') &&
           <templates.image {..._graphic}
             classNamePrefixSeparator='__item-'
             classNamePrefixes={['component-item', 'hotgraphic-popup']}

From 2138907b960d4c156ceb0747c63a4dbd718d1f37 Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 Apr 2024 14:27:00 +0100
Subject: [PATCH 3/4] refine _imageAlignment condition

Co-authored-by: Oliver Foster <oliver.foster@kineo.com>
---
 templates/hotgraphicPopup.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/hotgraphicPopup.jsx b/templates/hotgraphicPopup.jsx
index 6ee45b7..aa18067 100644
--- a/templates/hotgraphicPopup.jsx
+++ b/templates/hotgraphicPopup.jsx
@@ -30,7 +30,7 @@ export default function HotgraphicPopup(props) {
           _isRound && 'is-round',
           _isVisited && 'is-visited',
           _isActive && 'is-active',
-          _imageAlignment ? `align-image-${_imageAlignment}` : 'align-image-right'
+          `align-image-${_imageAlignment || 'right'}` 
         ])}
         key={index}
         data-index={index}

From 6f3bb92089f7bb812f21c0d6a72d24a00ece5d0e Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 Apr 2024 14:41:49 +0100
Subject: [PATCH 4/4] only apply _imageAlignment class if item has image

---
 templates/hotgraphicPopup.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/hotgraphicPopup.jsx b/templates/hotgraphicPopup.jsx
index aa18067..d021a72 100644
--- a/templates/hotgraphicPopup.jsx
+++ b/templates/hotgraphicPopup.jsx
@@ -30,7 +30,7 @@ export default function HotgraphicPopup(props) {
           _isRound && 'is-round',
           _isVisited && 'is-visited',
           _isActive && 'is-active',
-          `align-image-${_imageAlignment || 'right'}` 
+          _graphic?.src && `align-image-${_imageAlignment || 'right'}`
         ])}
         key={index}
         data-index={index}