From acebd434c1304023aa83d16538af679100b29b65 Mon Sep 17 00:00:00 2001
From: Ava Wroten <jo@wroten.me>
Date: Wed, 4 Mar 2020 09:05:09 -0600
Subject: [PATCH] Maintain focus for inner-elements in a11y component

---
 ember-ui/app/components/sortable-group-accessible.js | 4 +++-
 ember-ui/app/components/sortable-item-accessible.hbs | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/ember-ui/app/components/sortable-group-accessible.js b/ember-ui/app/components/sortable-group-accessible.js
index 506a84b..60435f0 100644
--- a/ember-ui/app/components/sortable-group-accessible.js
+++ b/ember-ui/app/components/sortable-group-accessible.js
@@ -10,7 +10,9 @@ export default class SortableGroupAccessibleComponent extends Component {
   handleFocus() { this.groupHasFocus = true; }
 
   @action
-  handleBlur() { this.groupHasFocus = false; }
+  handleBlur({ target, relatedTarget }) {
+    if (!target.contains(relatedTarget)) this.groupHasFocus = false;
+  }
 
   @action
   handleArrowUp() {
diff --git a/ember-ui/app/components/sortable-item-accessible.hbs b/ember-ui/app/components/sortable-item-accessible.hbs
index a83aacf..ff85b6c 100644
--- a/ember-ui/app/components/sortable-item-accessible.hbs
+++ b/ember-ui/app/components/sortable-item-accessible.hbs
@@ -1,6 +1,6 @@
 <div
   class='relative border border-gray-400
-    {{if (and @groupHasFocus (eq @currentIndex @selectedIndex)) 'border-orange-400'}}'>
+  {{if (and @groupHasFocus (eq @currentIndex @selectedIndex)) 'border-orange-400'}}'>
   {{#if (and @groupHasFocus (eq @currentIndex @selectedIndex))}}
     <button
       role="button"