Creates prop for setting the collapse state of panels

src/components/Collapsable.vue

@@ -1,6 +1,10 @@
 <template>
   <div class="collapsable">
-        <input :id="`collapsible-${uniqueKey}`" class="toggle" type="checkbox" checked>
+        <input
+            :id="`collapsible-${uniqueKey}`"
+            class="toggle"
+            type="checkbox"
+            :checked="!collapsed">
         <label :for="`collapsible-${uniqueKey}`" class="lbl-toggle" tabindex="0">
             <h2>{{ title }}</h2>
         </label>
@@ -18,6 +22,7 @@ export default {
   props: {
     uniqueKey: String,
     title: String,
+    collapsed: Boolean,
   },
 };
 </script>

src/components/FilterTile.vue

@@ -41,9 +41,13 @@ export default {
     window.addEventListener('keyup', (event) => {
       const { key } = event;
       if (/^[a-zA-Z]$/.test(key) && !document.activeElement.id) {
-        this.input += key;
-        this.$refs.filter.focus();
-        this.userIsTypingSomething();
+        try {
+          this.input += key;
+          this.$refs.filter.focus();
+          this.userIsTypingSomething();
+        } catch (e) {
+          // Do nothing
+        }
       }
     });
   },

src/components/ItemGroup.vue

@@ -1,5 +1,5 @@
 <template>
-   <Collapsable :title="title" :uniqueKey="groupId">
+   <Collapsable :title="title" :uniqueKey="groupId" :collapsed="collapsed">
     <div v-if="!items || items.length < 1" class="no-items">
       No Items to Show Yet
     </div>
@@ -25,6 +25,7 @@ export default {
   props: {
     groupId: String,
     title: String,
+    collapsed: Boolean,
     items: Array,
   },
   components: {