@aures5g/vue-component-library 0.1.2 → 0.2.0

package/dist/components/button/UIButton.vue.d.ts

@@ -31,7 +31,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * Severity type of the badge.
      */
-    badgeSeverity?: HintedString<"success" | "secondary" | "info" | "warning" | "danger" | "contrast">;
+    badgeSeverity?: HintedString<"success" | "info" | "warning" | "secondary" | "danger" | "contrast">;
     /**
      * Whether the button is in loading state.
      * @defaultValue false
@@ -49,7 +49,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * Defines the style of the button.
      */
-    severity?: HintedString<"success" | "help" | "secondary" | "info" | "warning" | "danger" | "contrast">;
+    severity?: HintedString<"success" | "info" | "warning" | "help" | "secondary" | "danger" | "contrast">;
     /**
      * Add a shadow to indicate elevation.
      * @defaultValue false
@@ -123,7 +123,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * Severity type of the badge.
      */
-    badgeSeverity?: HintedString<"success" | "secondary" | "info" | "warning" | "danger" | "contrast">;
+    badgeSeverity?: HintedString<"success" | "info" | "warning" | "secondary" | "danger" | "contrast">;
     /**
      * Whether the button is in loading state.
      * @defaultValue false
@@ -141,7 +141,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * Defines the style of the button.
      */
-    severity?: HintedString<"success" | "help" | "secondary" | "info" | "warning" | "danger" | "contrast">;
+    severity?: HintedString<"success" | "info" | "warning" | "help" | "secondary" | "danger" | "contrast">;
     /**
      * Add a shadow to indicate elevation.
      * @defaultValue false

package/dist/components/menu/UIMenu.vue.d.ts

@@ -0,0 +1,45 @@
+import { type RouteRecordName } from 'vue-router';
+import type { Icon, MenuItems } from './menu.types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    mainMenuItems: MenuItems;
+    branding: [string, string];
+    brandLogo?: Icon;
+    landingRoute?: RouteRecordName;
+    expandedRoutes?: RouteRecordName[];
+}>, {
+    brandLogo: () => import("@fortawesome/fontawesome-common-types").IconDefinition;
+    landingRoute: any;
+    expandedRoutes: () => any[];
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    mainMenuItems: MenuItems;
+    branding: [string, string];
+    brandLogo?: Icon;
+    landingRoute?: RouteRecordName;
+    expandedRoutes?: RouteRecordName[];
+}>, {
+    brandLogo: () => import("@fortawesome/fontawesome-common-types").IconDefinition;
+    landingRoute: any;
+    expandedRoutes: () => any[];
+}>>>, {
+    brandLogo: Icon;
+    landingRoute: RouteRecordName;
+    expandedRoutes: RouteRecordName[];
+}, {}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/components/menu/menu.types.d.ts

@@ -0,0 +1,13 @@
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types';
+export type Icon = object | string[] | string | IconDefinition;
+export type MenuItem = {
+    name: string;
+    title: string;
+    faIcon: Icon;
+    navbarBadge?: string;
+    href?: string;
+};
+export type MenuItemWithSubmenu = MenuItem & {
+    subMenuItems?: MenuItem[];
+};
+export type MenuItems = MenuItemWithSubmenu[];

package/dist/components/menu/useMenu.composables.d.ts

@@ -0,0 +1,52 @@
+import { type Ref } from 'vue';
+import type { MenuItemWithSubmenu, MenuItems } from './menu.types';
+import { type RouteRecordName } from 'vue-router';
+/**
+ * Keep track of navbar expanded state, append corresponding classes.
+ * Expand navbar by default for provided routes.
+ */
+export declare function useExpandableMenu(expandedRoutes?: RouteRecordName[]): {
+    isNavbarExpandedByDefault: import("vue").ComputedRef<boolean>;
+    isMenuOpen: import("vue").ComputedRef<boolean>;
+    onToggle: () => void;
+    navbarClasses: import("vue").ComputedRef<string>;
+};
+/**
+ * Keep track of menu categories and submenu visibility state, append corresponding classes.
+ * Watch route and automatically open/close active category.
+ */
+export declare function useMenuCategories(mainMenuItems: MenuItems, landingRoute?: RouteRecordName | null): {
+    menuCategories: Ref<Record<string, boolean>>;
+    openMenuCategory: (category: string) => void;
+    onCategoryClick: (menu: MenuItemWithSubmenu) => void;
+    menuCategoryClasses: import("vue").ComputedRef<Record<string, {
+        'submenu--visible': boolean;
+    }>>;
+};
+/**
+ * Handle everything around floating menu
+ */
+export declare function useFloatingMenu(mainMenuItems: MenuItems, menuCategories: Ref<Record<string, boolean>>): {
+    activeFloatingMenuIndex: Ref<number>;
+    menuItemRefs: Ref<HTMLLIElement[]>;
+    navbarRef: Ref<HTMLDivElement>;
+    enterFloatingTrigger: (index: number, category: string) => void;
+    leaveFloatingTrigger: (index: number) => Promise<void>;
+    activeFloatingMenu: import("vue").ComputedRef<MenuItemWithSubmenu>;
+    floatingMenuWrapperRef: Ref<HTMLDivElement>;
+    resetFloatingMenu: () => Promise<void>;
+    focusFloatingMenu: () => Promise<void>;
+    blurFloatingMenu: () => Promise<void>;
+};
+/**
+ * Create routing elements for navbar. If route is external "a" tag otherwise "router-link" tag is used.
+ */
+export declare function useCategoryLink(): {
+    getCategoryLinkComponent: (menu: MenuItemWithSubmenu) => "a" | "router-link";
+    getCategoryLinkProps: (menu: MenuItemWithSubmenu) => {
+        readonly [x: string]: string | {
+            name: string;
+        };
+        readonly target: "_blank";
+    };
+};

package/dist/index.d.ts

@@ -2,4 +2,5 @@ import './assets/primevue/themes/acbs/theme.scss';
 import HelloWorld from './components/HelloWorld/HelloWorld.vue';
 import PrimeVue from './config/primevue';
 import UIButton from './components/button/UIButton.vue';
-export { HelloWorld, PrimeVue, UIButton };
+import UIMenu from './components/menu/UIMenu.vue';
+export { HelloWorld, PrimeVue, UIButton, UIMenu };