@apptegy/nuxt-navigation 0.1.26 → 0.1.28

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@apptegy/nuxt-navigation",
   "configKey": "@apptegy/nuxt-navigation",
-  "version": "0.1.26",
+  "version": "0.1.28",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "unknown"

package/dist/runtime/components/Nav/Sidebar.vue

@@ -20,7 +20,8 @@
           <NuxtLink v-if="expanded" class="no-link-style" :to="homepageUrl">
             <slot name="logo">
                 <div class="navbar--logo">
-                  <img :src="brandLogo">
+                  <img v-if="brandLogo" :src="brandLogo">
+                  <ThrillshareLogo v-else />
                   <div v-if="!brand?.hide_school_name">
                     <div class="school-name"> {{ brand?.school_name }} </div>
                     <div v-if="brand?.school_tag_line" class="school-tag">{{ brand.school_tag_line }}</div>
@@ -70,9 +71,9 @@
 </template>
 
 <script setup lang="ts">
-import { useSidebar, useBranding, ref } from '#imports';
+import { useSidebar, useBranding, ref, watch } from '#imports';
 import type { IApplication, IUser } from "../../types";
-import tsBrandLogo from '../../assets/thrillshare-logo-white.svg';
+import ThrillshareLogo from './Icons/ThrillshareLogo.vue';
 
 interface ILogo {
   alt: string;
@@ -114,11 +115,20 @@ const props = withDefaults(defineProps<ISidebarProps>(), {
   clientId: undefined,
 });
 
+const emit = defineEmits<{
+  (e: 'toggle-expand', width: number): void
+}>();
+
 const { state: expanded } = useSidebar();
 const { brand, getBrandingStyles } = await useBranding(props.clientId);
 
-const brandLogo = ref(brand.value?.logo_light || tsBrandLogo);
+const brandLogo = ref(brand.value?.logo_light);
 
+// Emit event when expanded changes with the
+// width of the component.
+watch(expanded, (value) => {
+  emit('toggle-expand', value ? 264 : 64);
+})
 
 // Debounced Expand on Hover
 let expandedTimer = null;

package/dist/runtime/components/Nav/SidebarSection.vue

@@ -14,7 +14,7 @@
 <script setup lang="ts">
 import { useSidebar } from "#imports";
 import type { IApplication } from "../../types";
-import icons from "./Icons/iconPaths.json";
+import icons from "../../assets/iconPaths.json";
 
 const props = defineProps<{
   application: IApplication;

package/dist/runtime/composables/useBranding.d.ts

@@ -1,22 +1,4 @@
 export declare function useBranding(clientId?: number): Promise<{
-    brand: import("vue").Ref<null>;
-    getBrandingStyles: import("vue").ComputedRef<{
-        '--brand-color'?: undefined;
-        '--nav-background-color'?: undefined;
-        '--nav-text-color'?: undefined;
-        '--nav-border-colors'?: undefined;
-        '--nav-icon-background'?: undefined;
-        '--nav-icon-color'?: undefined;
-        '--nav-active-icon-background'?: undefined;
-        '--nav-active-icon-color'?: undefined;
-    } | {
-        '--brand-color': any;
-        '--nav-background-color': string;
-        '--nav-text-color': string;
-        '--nav-border-colors': string;
-        '--nav-icon-background': string;
-        '--nav-icon-color': string;
-        '--nav-active-icon-background': string;
-        '--nav-active-icon-color': string;
-    }>;
+    brand: any;
+    getBrandingStyles: any;
 }>;

package/dist/runtime/composables/useBranding.js

@@ -1,5 +1,5 @@
 import { computed, ref, useRuntimeConfig } from "#imports";
-let brand = ref(null);
+const brand = ref(null);
 export async function useBranding(clientId) {
   if (clientId !== void 0) {
     const config = useRuntimeConfig();
@@ -13,7 +13,7 @@ export async function useBranding(clientId) {
   }
   const brandPrimaryColor = computed(() => brand.value?.colors?.primary_color.hex || "#000000");
   const getBrandingStyles = computed(() => {
-    if (!brand.value.logo_dark && !brand.value.logo_light || !brand.value) {
+    if (!brand.value?.logo_dark && !brand.value?.logo_light || !brand.value) {
       brand.value = null;
       return {};
     }

package/dist/runtime/composables/useDropdown.d.ts

@@ -3,8 +3,8 @@ export declare function useDropdown(options: Array<unknown>, dropdownOptionsRef:
     searchable: boolean;
     trackBy?: string;
 }): {
-    active: Ref<boolean>;
-    searchQuery: Ref<string>;
+    active: any;
+    searchQuery: any;
     toggleDropdown: ($event: KeyboardEvent | MouseEvent) => Promise<void>;
     openDropdown: () => void;
     closeDropdown: () => void;
@@ -12,5 +12,5 @@ export declare function useDropdown(options: Array<unknown>, dropdownOptionsRef:
     keydownActionsOnTrigger: (event: KeyboardEvent) => void;
     handleKeydown: (event: KeyboardEvent, index: number) => number | undefined;
     handleDropdownSearch: (inputValue: KeyboardEvent & InputEvent) => void;
-    debouncedFocus: import("lodash").DebouncedFunc<(idx: number) => void>;
+    debouncedFocus: any;
 };

package/dist/runtime/composables/useDropdown.js

@@ -18,17 +18,20 @@ export function useDropdown(options, dropdownOptionsRef, dropdownTriggerRef, con
     active.value = false;
   }
   function onClickOutsideHandler() {
-    if (!active.value) return;
+    if (!active.value)
+      return;
     closeDropdown();
   }
   function keydownActionsOnTrigger(event) {
-    if (event.ctrlKey || event.metaKey || event.shiftKey) return;
+    if (event.ctrlKey || event.metaKey || event.shiftKey)
+      return;
     if (event.key !== "Tab") {
       event.preventDefault();
     }
     switch (event.key) {
       case "Tab":
-        if (!active.value) return;
+        if (!active.value)
+          return;
         closeDropdown();
         break;
       case "ArrowDown":
@@ -93,7 +96,8 @@ export function useDropdown(options, dropdownOptionsRef, dropdownTriggerRef, con
     }
   }
   function handleKeydown(event, index) {
-    if (event.ctrlKey || event.metaKey || event.shiftKey) return;
+    if (event.ctrlKey || event.metaKey || event.shiftKey)
+      return;
     if (event.altKey && event.key === "ArrowUp") {
       closeDropdown();
       dropdownTriggerRef.value.focus();
@@ -127,13 +131,15 @@ export function useDropdown(options, dropdownOptionsRef, dropdownTriggerRef, con
         });
         break;
       case "ArrowDown":
-        if (index === options.length - 1) break;
+        if (index === options.length - 1)
+          break;
         nextTick(() => {
           dropdownOptionsRef.value[index + 1].focus();
         });
         return index;
       case "ArrowUp":
-        if (index === 0) break;
+        if (index === 0)
+          break;
         nextTick(() => {
           dropdownOptionsRef.value[index - 1].focus();
         });
@@ -170,7 +176,8 @@ export function useDropdown(options, dropdownOptionsRef, dropdownTriggerRef, con
     dropdownOptionsRef.value[idx].focus();
   }, 500);
   function handleDropdownSearch(inputValue) {
-    if (!config.searchable) return;
+    if (!config.searchable)
+      return;
     if (inputValue.key == "Backspace") {
       searchQuery.value = searchQuery.value.slice(0, -1);
       return;

package/dist/runtime/composables/useSidebar.d.ts

@@ -1,5 +1,5 @@
 export declare function useSidebar(): {
-    state: import("vue").Ref<boolean>;
+    state: any;
     toggleSidebar: () => void;
-    sidebarWidth: import("vue").ComputedRef<"264px" | "0px">;
+    sidebarWidth: any;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apptegy/nuxt-navigation",
-  "version": "0.1.26",
+  "version": "0.1.28",
   "type": "module",
   "exports": {
     ".": {
@@ -26,25 +26,26 @@
     "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.15.2",
-    "@vueuse/components": "11.3.0",
+    "@apptegy/nuxt-intl": "2.1.2",
+    "@nuxt/kit": "^3.15.4",
+    "@vueuse/components": "12.5.0",
     "lodash": "^4.17.21"
   },
   "devDependencies": {
-    "@nuxt/devtools": "^1.7.0",
-    "@nuxt/eslint-config": "^0.7.2",
+    "@nuxt/devtools": "^2.0.0",
+    "@nuxt/eslint-config": "^1.0.1",
     "@nuxt/module-builder": "^0.8.4",
-    "@nuxt/schema": "^3.14.1592",
-    "@nuxt/test-utils": "^3.14.4",
-    "@types/node": "^20.17.9",
+    "@nuxt/schema": "^3.15.4",
+    "@nuxt/test-utils": "^3.15.4",
+    "@types/node": "^20.17.17",
     "changelogen": "^0.5.7",
-    "eslint": "^9.15.0",
-    "nuxt": "^3.15.2",
-    "sass": "^1.81.0",
-    "typescript": "^5.7.2",
-    "vitest": "^2.1.6",
+    "eslint": "^9.20.0",
+    "nuxt": "^3.15.4",
+    "sass": "^1.84.0",
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.9",
     "vue": "^3.5.13",
-    "vue-tsc": "^2.1.10"
+    "vue-tsc": "^2.2.0"
   },
-  "gitHead": "38d12a2193d87b19281075e010698ed2f0beb009"
+  "gitHead": "5b4a6d2e7c7db960b48e86b8056967f70547c784"
 }