- prettier formatting

- npm updates
- new SearchMap.vue component

resources/js/Components/NavBarItem.vue

@@ -1,90 +1,90 @@
 <script setup>
-import { StyleService } from '@/Stores/style'
+import { StyleService } from '@/Stores/style';
 // import { Link } from '@inertiajs/vue3'
-import { Link } from '@inertiajs/vue3'
-import { computed } from 'vue'
+import { Link } from '@inertiajs/vue3';
+import { computed } from 'vue';
 import { stardust } from '@eidellev/adonis-stardust/client';
 
 const props = defineProps({
-  href: {
-    type: String,
-    default: null
-  },
-  routeName: {
-    type: String,
-    default: null
-  },
-  param:{
-    type:Number
-  },
-  type: {
-    type: String,
-    default: 'flex'
-  },
-  activeColor: {
-    type: String,
-    default: null
-  },
-  isDesktopIconOnly: Boolean,
-  dropdown: Boolean,
-  active: Boolean
-})
+    href: {
+        type: String,
+        default: null,
+    },
+    routeName: {
+        type: String,
+        default: null,
+    },
+    param: {
+        type: Number,
+    },
+    type: {
+        type: String,
+        default: 'flex',
+    },
+    activeColor: {
+        type: String,
+        default: null,
+    },
+    isDesktopIconOnly: Boolean,
+    dropdown: Boolean,
+    active: Boolean,
+});
 
 const is = computed(() => {
-  if (props.href) {
-    return 'a'
-  }
+    if (props.href) {
+        return 'a';
+    }
 
-  if (props.routeName) {
-    return Link
-  }
+    if (props.routeName) {
+        return Link;
+    }
 
-  return 'div'
-})
+    return 'div';
+});
 
-const styleStore = StyleService()
+const styleStore = StyleService();
 
-const activeColor = props.activeColor ?? `${styleStore.navBarItemLabelActiveColorStyle} dark:text-slate-400`
+const activeColor = props.activeColor ?? `${styleStore.navBarItemLabelActiveColorStyle} dark:text-slate-400`;
 
 const activeClass = computed(
-//  () => props.routeName && route().current(props.routeName) == true ? props.activeColor : null
-() => props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null
-)
+    //  () => props.routeName && route().current(props.routeName) == true ? props.activeColor : null
+    () => (props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null),
+);
 // const itemRoute = computed(() => (props.routeName ? stardust.route(props.routeName): ''));
 
 const componentClass = computed(() => {
-  const base = [
-    props.type,
-    props.active
-      ? activeColor
-      : `${styleStore.navBarItemLabelStyle} dark:text-white dark:hover:text-slate-400 ${styleStore.navBarItemLabelHoverStyle}`
-  ]
+    const base = [
+        props.type,
+        props.active
+            ? activeColor
+            : `${styleStore.navBarItemLabelStyle} dark:text-white dark:hover:text-slate-400 ${styleStore.navBarItemLabelHoverStyle}`,
+    ];
 
-  if (props.type === 'block') {
-    base.push('lg:flex')
-  }
+    if (props.type === 'block') {
+        base.push('lg:flex');
+    }
 
-  if (!props.dropdown) {
-    base.push('py-2', 'px-3')
-  } else {
-    base.push('p-0', 'lg:py-2', 'lg:px-3')
-  }
+    if (!props.dropdown) {
+        base.push('py-2', 'px-3');
+    } else {
+        base.push('p-0', 'lg:py-2', 'lg:px-3');
+    }
 
-  if (props.isDesktopIconOnly) {
-    base.push('lg:w-16', 'lg:justify-center')
-  }
+    if (props.isDesktopIconOnly) {
+        base.push('lg:w-16', 'lg:justify-center');
+    }
 
-  return base
-})
+    return base;
+});
 </script>
 
 <template>
-  <component
-    :is="is"
-    class="items-center grow-0 shrink-0 relative cursor-pointer"
-    :class="[componentClass, activeClass]"
-    :href="routeName ? stardust.route(props.routeName, [props.param]) : href"
-  > 
-    <slot />
-  </component>
+    <component
+        :is="is"
+        class="items-center grow-0 shrink-0 relative cursor-pointer"
+        :class="[componentClass, activeClass]"
+        :href="routeName ? stardust.route(props.routeName, [props.param]) : href"
+    >
+        <slot />
+    </component>
 </template>