@softwareone/spi-sv5-library 1.16.0 → 1.16.1

package/dist/components/controls/select/Select.svelte

@@ -362,7 +362,7 @@
 {#snippet removeButton(event: VoidFunction)}
 	<button
 		type="button"
-		class="clear-button"
+		class="clear-button spi-text-regular-2"
 		onclick={(e) => {
 			e.stopPropagation();
 			event();

package/dist/components/header/Header.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { AnnouncementItem, MenuItem } from '../../index.js';
+	import type { AnnouncementItem, MainMenu, MenuItem } from '../../index.js';
 	import Announcement from '../announcement/Announcement.svelte';
 	import Menu from '../menu/Menu.svelte';
 	import Waffle from '../waffle/Waffle.svelte';
@@ -17,7 +17,7 @@
 		userName?: string;
 		hideLoader?: boolean;
 		hideAnnouncement?: boolean;
-		menuItems?: MenuItem[];
+		menuItems?: MainMenu[];
 		waffleItems?: WaffleItem[];
 		profileMenuItems?: MenuItem[];
 		announcementItems?: AnnouncementItem[];

package/dist/components/header/Header.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { AnnouncementItem, MenuItem } from '../../index.js';
+import type { AnnouncementItem, MainMenu, MenuItem } from '../../index.js';
 import type { WaffleItem } from '../waffle/types.js';
 interface Props {
     title?: string;
@@ -9,7 +9,7 @@ interface Props {
     userName?: string;
     hideLoader?: boolean;
     hideAnnouncement?: boolean;
-    menuItems?: MenuItem[];
+    menuItems?: MainMenu[];
     waffleItems?: WaffleItem[];
     profileMenuItems?: MenuItem[];
     announcementItems?: AnnouncementItem[];

package/dist/components/menu/Menu.svelte

@@ -1,12 +1,14 @@
 <script lang="ts">
+	import { page } from '$app/state';
 	import { fade } from 'svelte/transition';
 
-	import { existRoute, getFirstPathSegment, getNormalizedPathname } from '../../utils/index.js';
+	import { existRoute, getSectionPrefix } from '../../utils/index.js';
 	import MainMenuItem from './MenuItem.svelte';
-	import type { MenuItem } from './types.js';
+	import type { MainMenu } from './types.js';
+	import { hasMenuItems } from './utils.js';
 
 	interface Props {
-		menuItems: MenuItem[];
+		menuItems: MainMenu[];
 		showMenu: boolean;
 	}
 
@@ -15,14 +17,13 @@
 	let activeItem = $state('');
 
 	const setActiveMenuItem = () => {
-		activeItem =
-			menuItems.find((menuItem: MenuItem) => isActiveMenuItem(menuItem.url))?.text || '';
+		activeItem = menuItems.find((menu) => isActiveMenuItem(menu))?.text || '';
 	};
 
-	const isActiveMenuItem = (url: string) => {
-		const pathname = getNormalizedPathname();
-		const firstPathSegment = getFirstPathSegment(pathname);
-		return existRoute(firstPathSegment, url);
+	const isActiveMenuItem = (menu: MainMenu): boolean => {
+		const pathname = page.url.pathname;
+		const routeToMatch = hasMenuItems(menu.children) ? getSectionPrefix(menu.url) : menu.url;
+		return existRoute(routeToMatch, pathname);
 	};
 
 	const onHandleMenu = () => {

package/dist/components/menu/Menu.svelte.d.ts

@@ -1,6 +1,6 @@
-import type { MenuItem } from './types.js';
+import type { MainMenu } from './types.js';
 interface Props {
-    menuItems: MenuItem[];
+    menuItems: MainMenu[];
     showMenu: boolean;
 }
 declare const Menu: import("svelte").Component<Props, {}, "showMenu">;

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

@@ -1,2 +1,3 @@
 import type { MainMenu, SubMenuItem } from './types.js';
+export declare const hasMenuItems: (children?: SubMenuItem[]) => boolean;
 export declare const getSubMenuItemsFromMenu: (items: MainMenu[], excludedRoutes?: string[]) => SubMenuItem[];

package/dist/components/menu/utils.js

@@ -1,11 +1,16 @@
-import { existRoute, getFirstPathSegment, getNormalizedPathname } from '../../utils/index.js';
+import { page } from '$app/state';
+import { existRoute, getSectionPrefix } from '../../utils/index.js';
+export const hasMenuItems = (children) => {
+    return Boolean(children?.some((child) => child.menuItems.length));
+};
 export const getSubMenuItemsFromMenu = (items, excludedRoutes) => {
-    const pathname = getNormalizedPathname();
+    const pathname = page.url.pathname;
     if (excludedRoutes?.includes(pathname))
         return [];
-    const firstPathSegment = getFirstPathSegment(pathname);
     const matchedMenu = items.find((menu) => {
-        return existRoute(firstPathSegment, menu.url);
+        if (!hasMenuItems(menu.children))
+            return false;
+        return existRoute(getSectionPrefix(menu.url), pathname);
     });
     return matchedMenu?.children ?? [];
 };

package/dist/utils/url.d.ts

@@ -1,3 +1,2 @@
-export declare const getNormalizedPathname: () => string;
-export declare const getFirstPathSegment: (pathname: string) => string;
+export declare const getSectionPrefix: (url: string) => string;
 export declare const existRoute: (url: string, pathname: string) => boolean;

package/dist/utils/url.js

@@ -1,17 +1,9 @@
-import { base } from '$app/paths';
-import { page } from '$app/state';
-const normalizePathname = (path) => path.replace(/^\/v\d+\//, '/');
-export const getNormalizedPathname = () => {
-    const pathname = page.url.pathname;
-    const withoutBase = base && pathname.startsWith(base) ? pathname.slice(base.length) : pathname;
-    return normalizePathname(withoutBase);
-};
-export const getFirstPathSegment = (pathname) => {
-    const matchedPath = /^\/[^/]+/.exec(pathname);
-    return matchedPath?.[0] ?? '/';
+export const getSectionPrefix = (url) => {
+    const segments = url.split('/');
+    segments.pop();
+    return segments.join('/') || '/';
 };
 export const existRoute = (url, pathname) => {
-    const normalizedPathname = normalizePathname(pathname);
-    const regex = new RegExp(`^${url}(?![\\w-])`);
-    return regex.test(normalizedPathname);
+    const regex = new RegExp(String.raw `^${url}(?![\w-])`);
+    return regex.test(pathname);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@softwareone/spi-sv5-library",
-	"version": "1.16.0",
+	"version": "1.16.1",
 	"description": "Svelte components",
 	"keywords": [
 		"svelte",