@explorer-1/vue 0.2.61 → 0.2.62

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@explorer-1/vue",
-  "version": "0.2.61",
+  "version": "0.2.62",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -30,7 +30,7 @@
     "vue-bind-once": "^0.2.1",
     "vue3-compare-image": "^1.2.5",
     "vue3-observe-visibility": "^1.0.1",
-    "@explorer-1/common": "1.1.15"
+    "@explorer-1/common": "1.1.16"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",

package/src/components/BaseAccordionItem/BaseAccordionItem.vue

@@ -3,6 +3,7 @@ import { computed, reactive, ref } from 'vue'
 import type { AccordionItemObject } from './../../interfaces.ts'
 import { uniqueId } from 'lodash'
 import IconPlus from './../Icons/IconPlus.vue'
+import IconMinus from './../Icons/IconMinus.vue'
 
 export interface BaseAccordionItemProps {
   headingLevel?: string
@@ -76,9 +77,9 @@ const emit = defineEmits(['accordionItemOpened', 'accordionItemClosed'])
               </slot>
               <span
                 class="BaseAccordion-icon pointer-events-none text-xs text-action flex-shrink-0 transform transition-transform"
-                :class="{ 'rotate-45': !isHidden }"
               >
-                <IconPlus />
+                <IconPlus v-if="isHidden" />
+                <IconMinus v-else />
               </span>
             </button>
           </component>

package/src/components/SearchFilterGroup/SearchFilterGroup.vue

@@ -81,7 +81,8 @@
           <!-- correct for zero based index -->
           <div
             v-if="!truncateFilters || index <= checkbox.checkboxLimit - 1"
-            class="flex my-2"
+            class="flex"
+            :class="{ 'pt-2 mt-2 mb-3': styleAsAccordion, 'my-2': !styleAsAccordion }"
           >
             <input
               :id="
@@ -102,9 +103,10 @@
                   : generateId(bucket.key, groupKey)
               "
               class="form-check-label pl-2 tracking-normal align-middle"
+              :class="{ 'font-extrabold': styleAsAccordion }"
             >
               {{ prettyFilterNames(bucket.key_as_string ? bucket.key_as_string : bucket.key) }}
-              <span class="text-gray-mid-dark text-sm">
+              <span class="text-gray-mid-dark text-sm font-normal">
                 ({{ bucket.doc_count.toLocaleString() }})
               </span>
             </label>
@@ -180,6 +182,12 @@ export default {
     subFilterAggKey: {
       type: String,
       default: undefined
+    },
+    // force accordion styles and spacing even if there are no subfilters
+    // useful when mixing filters with and without subfilters together
+    styleAsAccordion: {
+      type: Boolean,
+      default: false
     }
   },
   emits: ['update:filterBy'],

package/src/components/SearchFilterGroupAccordionItem/SearchFilterGroupAccordionItem.vue

@@ -2,6 +2,7 @@
 import { computed, reactive, ref } from 'vue'
 import { uniqueId } from 'lodash'
 import IconPlus from './../Icons/IconPlus.vue'
+import IconMinus from './../Icons/IconMinus.vue'
 
 export interface SearchFilterGroupAccordionItemProps {
   initOpen?: boolean
@@ -57,10 +58,10 @@ const emit = defineEmits(['filterGroupAccordionItemOpened', 'filterGroupAccordio
           @click="handleClick()"
         >
           <span
-            class="SearchFilterGroupAccordionItem-icon inline-block text-xs text-action flex-shrink-0 transform transition-transform"
-            :class="{ '!rotate-45': !isHidden }"
+            class="SearchFilterGroupAccordionItem-icon inline-block text-xs text-action flex-shrink-0"
           >
-            <IconPlus />
+            <IconPlus v-if="isHidden" />
+            <IconMinus v-else />
           </span>
         </button>
       </template>

package/src/components/SearchResultsList/SearchResultsList.vue

@@ -193,9 +193,11 @@ export default defineComponent({
               page.id = page._id
               page.score = page._score
               // ensure router links
+              // TODO: issues with router links so disabling for now
+              // page.url = page._source.url
+              //   ? page._source.url.replace(/^[^:]+:\/\/[^/?#]+/, '')
+              //   : undefined
               page.url = page._source.url
-                ? page._source.url.replace(/^[^:]+:\/\/[^/?#]+/, '')
-                : undefined
               page.title = page._source.title
               page.type = pageType
               page.topic = topic

package/src/templates/edu/PageEduStudentProject/PageEduStudentProject.vue

@@ -452,7 +452,8 @@ const computedClass = computed((): string => {
     ul {
       li {
         &::before {
-          @apply bg-secondary;
+          // intentionally using a specific red
+          @apply bg-jpl-red;
         }
       }
     }