@luigi-project/core-modular 0.0.4 → 0.0.5

package/modules/ui-module.d.ts

@@ -1,15 +1,18 @@
 import { Luigi } from '../core-api/luigi';
 import { NavigationService } from '../services/navigation.service';
 import { RoutingService } from '../services/routing.service';
-import { ModalSettings } from '../types/navigation';
+import { ModalSettings, Node } from '../types/navigation';
+import { LuigiParams } from '../types/routing';
 export declare const UIModule: {
     navService: NavigationService;
     routingService: RoutingService;
     luigi: Luigi;
+    modalContainer: any;
+    drawerContainer: any;
     init: (luigi: Luigi) => void;
     update: (scopes?: string[]) => Promise<void>;
-    updateMainContent: (currentNode: any, luigi: Luigi, withoutSync?: boolean, preventContextUpdate?: boolean) => Promise<void>;
-    openModal: (luigi: Luigi, node: any, modalSettings: ModalSettings, onCloseCallback?: () => void) => Promise<void>;
+    updateMainContent: (currentNode: Node, luigi: Luigi, luigiParams?: LuigiParams, withoutSync?: boolean, preventContextUpdate?: boolean) => Promise<void>;
+    openModal: (luigi: Luigi, node: Node, modalSettings: ModalSettings, onCloseCallback?: () => void) => Promise<void>;
     updateModalSettings: (modalSettings: ModalSettings, addHistoryEntry: boolean, luigi: Luigi) => void;
-    openDrawer: (luigi: Luigi, node: any, modalSettings: ModalSettings, onCloseCallback?: () => void) => Promise<void>;
+    openDrawer: (luigi: Luigi, node: Node, drawerSettings: ModalSettings, onCloseCallback?: () => void) => Promise<void>;
 };

package/modules/ux-module.d.ts

@@ -1,11 +1,12 @@
 import { LuigiCompoundContainer, LuigiContainer } from '@luigi-project/container';
 import { Luigi } from '../core-api/luigi';
 export interface AlertSettings {
-    text?: string;
-    type?: string;
-    links?: Record<string, Link>;
     closeAfter?: number;
     id?: string;
+    links?: Record<string, Link>;
+    text?: string;
+    ttl?: number;
+    type?: string;
 }
 export interface AlertHandler {
     openFromClient: boolean;

package/package.json

@@ -18,5 +18,5 @@
     "micro-frontends",
     "microfrontends"
   ],
-  "version": "0.0.4"
+  "version": "0.0.5"
 }

package/services/navigation.service.d.ts

@@ -12,8 +12,7 @@ export declare class NavigationService {
     getPathData(path: string): Promise<PathData>;
     findMatchingNode(urlPathElement: string, nodes: Node[]): Node | undefined;
     buildNavItems(nodes: Node[], selectedNode: Node | undefined, pathData: PathData): NavItem[];
-    shouldRedirect(path: string, pData?: PathData): Promise<string | undefined>;
-    getCurrentNode(path: string): Promise<any>;
+    getCurrentNode(path: string): Promise<Node | undefined>;
     getPathParams(path: string): Promise<Record<string, any>>;
     /**
      * getTruncatedChildren
@@ -23,7 +22,7 @@ export declare class NavigationService {
      * @param array children
      * @returns array children
      */
-    getTruncatedChildren(children: any): any[];
+    getTruncatedChildren(children: Node[]): Node[];
     applyNavGroups(items: NavItem[]): NavItem[];
     getLeftNavData(path: string, pData?: PathData): Promise<LeftNavData>;
     navItemClick(node: Node, pathData?: PathData): void;
@@ -103,7 +102,7 @@ export declare class NavigationService {
      * Builds a path string by concatenating path segments from the virtual tree root or the incoming path.
      *
      * @param incomingPath - The incoming path segment to be appended.
-     * @param fromVirtualTreeRoot - A boolean indicating whether to build the path from the virtual tree root.
+     * @param options - The set of params related to navigation.
      * @returns The constructed path string.
      */
     buildPath(incomingPath: string, options: NavigationOptions): Promise<string>;

package/services/routing.service.d.ts

@@ -1,12 +1,7 @@
 import { Luigi } from '../core-api/luigi';
+import { Route } from '../types/routing';
 import { ModalSettings, Node, PathData } from '../types/navigation';
 import { NavigationService } from './navigation.service';
-export interface Route {
-    raw: string;
-    node?: Node;
-    path: string;
-    nodeParams?: Record<string, string>;
-}
 export declare class RoutingService {
     private luigi;
     navigationService?: NavigationService;
@@ -110,4 +105,22 @@ export declare class RoutingService {
      */
     updateModalDataInUrl(modalPath: string, modalParams: ModalSettings, addHistoryEntry: boolean): void;
     checkInvalidateCache(previousPathData: PathData | undefined, newPath: string): void;
+    /**
+     * Deal with page not found scenario.
+     * @param {Object} nodeObject - the data of node
+     * @param {string} viewUrl - the url of the current mf view
+     * @param {Object} pathData - the information of current path
+     * @param {string} path - the path of the view to open
+     * @param {string} pathUrlRaw - path url without hash
+     * @returns {Promise<boolean>} A promise that resolves when page not found handling is complete.
+     */
+    handlePageNotFound(nodeObject: any, viewUrl: string, pathData: PathData, path: string, pathUrlRaw: string): Promise<boolean>;
+    /**
+     * Handle error for page not found scenario.
+     * @param {string} pathToRedirect - fallback path for redirection
+     * @param {string} notFoundPath - the path which cannot be found
+     * @param {boolean} isAnyPathMatched - is any path matched or not
+     * @returns {Promise<void>} A promise that resolves when error handling is complete.
+     */
+    showPageNotFoundError(pathToRedirect: string, notFoundPath: string, isAnyPathMatched?: boolean): Promise<void>;
 }

package/types/connector.d.ts

@@ -22,5 +22,11 @@ export interface LuigiConnector {
     getCurrentLocale(): string;
     updateModalSettings(modalSettings: ModalSettings): void;
     showFatalError(error: string): void;
+    getCoreAPISupportedElements(): {
+        getShellbarElement(): HTMLElement | null;
+        getShellbarActions(): HTMLElement | null;
+        getLuigiContainer(): HTMLElement | null;
+        getNavFooterContainer(): HTMLElement | null;
+    };
 }
 export type { Node };

package/types/navigation.d.ts

@@ -59,18 +59,20 @@ export interface UserInfo {
     description?: string;
 }
 export interface LeftNavData {
-    selectedNode: any;
+    selectedNode: Node;
     items: NavItem[];
     basePath: string;
     sideNavFooterText?: string;
     navClick?: (item: NavItem) => void;
 }
 export interface PathData {
+    context?: Record<string, any>;
     selectedNode?: Node;
     selectedNodeChildren?: Node[];
     nodesInPath?: Node[];
     rootNodes: Node[];
     pathParams: Record<string, any>;
+    matchedPath: string;
 }
 export interface RootNode {
     node: Node;
@@ -88,8 +90,10 @@ export interface Node {
         changeCurrentLocale?: boolean;
         urlParameters?: Record<string, any>;
     };
+    compound?: CompoundConfig;
     context?: Record<string, any>;
     drawer?: ModalSettings;
+    decodeViewUrl?: boolean;
     externalLink?: ExternalLink;
     hideFromNav?: boolean;
     hideSideNav?: boolean;
@@ -97,6 +101,9 @@ export interface Node {
     isRootNode?: boolean;
     keepSelectedForChildren?: boolean;
     label?: string;
+    loadingIndicator?: {
+        enabled: boolean;
+    };
     navigationContext?: string;
     onNodeActivation?: (node: Node) => boolean | void;
     openNodeInModal?: boolean;
@@ -106,9 +113,16 @@ export interface Node {
     runTimeErrorHandler?: RunTimeErrorHandler;
     tabNav?: boolean;
     tooltipText?: string;
+    userSettingsGroup?: string;
     viewUrl?: string;
     visibleForFeatureToggles?: string[];
     virtualTree?: boolean;
+    viewGroup?: string;
+    webcomponent?: boolean | {
+        type?: string;
+        selfRegistered?: boolean;
+        tagName?: string;
+    };
     _virtualTree?: Node;
     _virtualPathIndex?: number;
     _virtualViewUrl?: string;
@@ -182,6 +196,8 @@ export interface NavigationOptions {
     fromClosestContext?: boolean;
     fromVirtualTreeRoot?: boolean;
     fromParent?: boolean;
+    relative?: any;
+    nodeParams?: Record<string, any>;
 }
 export interface NavigationRequestBase {
     preventContextUpdate?: boolean;
@@ -190,6 +206,7 @@ export interface NavigationRequestBase {
     options?: NavigationOptions;
 }
 export interface NavigationRequestParams extends NavigationRequestBase {
+    drawerSettings?: any;
     modalSettings?: any;
     newTab?: boolean;
     path: string;
@@ -198,4 +215,208 @@ export interface NavigationRequestParams extends NavigationRequestBase {
 export interface NavigationRequestEvent {
     detail: NavigationRequestBase;
 }
+/**
+ * Configuration for compound web components in Luigi.
+ * Compound allows you to layout multiple web components in one micro frontend.
+ */
+export interface CompoundConfig {
+    /**
+     * Renderer configuration for the compound layout
+     */
+    renderer?: {
+        /**
+         * The renderer to use - can be 'grid', a custom renderer object, or undefined for default
+         */
+        use?: 'grid' | string | {
+            /**
+             * Base renderer to extend (e.g., 'grid')
+             */
+            extends?: string;
+            /**
+             * Custom function to create the compound container
+             * @param config - The renderer configuration
+             * @param renderer - The parent/super renderer (if extending)
+             */
+            createCompoundContainer?: (config: RendererConfig, renderer?: any) => HTMLDivElement;
+            /**
+             * Custom function to create individual compound item containers
+             * @param layoutConfig - Layout configuration for the item
+             * @param config - The overall renderer configuration
+             * @param renderer - The parent/super renderer (if extending)
+             */
+            createCompoundItemContainer?: (layoutConfig?: LayoutConfig, config?: RendererConfig, renderer?: any) => HTMLDivElement;
+            /**
+             * Custom function to attach an item to the compound container
+             * @param compoundCnt - The compound container element
+             * @param compoundItemCnt - The item container to attach
+             * @param renderer - The parent/super renderer (if extending)
+             */
+            attachCompoundItem?: (compoundCnt: HTMLElement, compoundItemCnt: HTMLElement, renderer?: any) => void;
+        };
+        /**
+         * Configuration for the grid layout
+         */
+        config?: {
+            /**
+             * CSS grid-template-columns value (e.g., '1fr 2fr')
+             */
+            columns?: string;
+            /**
+             * CSS grid-template-rows value (e.g., '150px 150px')
+             */
+            rows?: string;
+            /**
+             * CSS grid-gap value (e.g., 'auto', '10px')
+             */
+            gap?: string;
+            /**
+             * Minimum height for the grid container
+             */
+            minHeight?: string;
+            /**
+             * Responsive layout configurations for different viewport sizes
+             */
+            layouts?: Array<{
+                /**
+                 * CSS grid-template-columns for this breakpoint
+                 */
+                columns?: string | number;
+                /**
+                 * CSS grid-template-rows for this breakpoint
+                 */
+                rows?: string | number;
+                /**
+                 * CSS grid-gap for this breakpoint
+                 */
+                gap?: string | number;
+                /**
+                 * Minimum viewport width for this layout (in pixels)
+                 */
+                minWidth?: number;
+                /**
+                 * Maximum viewport width for this layout (in pixels)
+                 */
+                maxWidth?: number;
+            }>;
+        };
+    };
+    /**
+     * Lazy loading configuration for compound children
+     */
+    lazyLoadingOptions?: {
+        /**
+         * Enable lazy loading using IntersectionObserver
+         * @default false
+         */
+        enabled?: boolean;
+        /**
+         * IntersectionObserver rootMargin option
+         * Controls when children are loaded relative to viewport visibility
+         * @default "0px"
+         */
+        intersectionRootMargin?: string;
+        /**
+         * Default temporary height for child containers before they load
+         * @default "500px"
+         */
+        temporaryContainerHeight?: string;
+        /**
+         * Disable automatic temporary container heights
+         * Useful for custom renderers that manage heights themselves
+         * @default false
+         */
+        noTemporaryContainerHeight?: boolean;
+    };
+    /**
+     * Array of child web component configurations
+     */
+    children?: Array<{
+        /**
+         * Unique identifier for this child web component
+         */
+        id: string;
+        /**
+         * URL pointing to the web component JavaScript file
+         * Supports {i18n.currentLocale} placeholder for localization
+         */
+        viewUrl: string;
+        /**
+         * Context object passed to the web component
+         */
+        context?: Record<string, any>;
+        /**
+         * Layout configuration for positioning this child
+         */
+        layoutConfig?: {
+            /**
+             * CSS grid-row value (e.g., '1 / 3', 'auto')
+             * @default "auto"
+             */
+            row?: string;
+            /**
+             * CSS grid-column value (e.g., '1 / -1', 'auto')
+             * @default "auto"
+             */
+            column?: string;
+            /**
+             * Slot name for nested web components
+             * Use this instead of row/column to plug into a parent's slot
+             */
+            slot?: string;
+            /**
+             * Override the default temporary container height for this specific child
+             * Only used when lazy loading is enabled
+             * * @default undefined
+             */
+            temporaryContainerHeight?: string;
+        };
+        /**
+         * Event listeners for cross-component communication via event bus
+         */
+        eventListeners?: Array<{
+            /**
+             * ID of the source web component (use '*' for any source)
+             */
+            source: string;
+            /**
+             * Name of the event to listen for
+             */
+            name: string;
+            /**
+             * Type of action to perform (e.g., 'update')
+             */
+            action: string;
+            /**
+             * Optional function to convert event data before passing to listener
+             * @param data - The event data
+             */
+            dataConverter?: (data: any) => any;
+        }>;
+    }>;
+}
+/**
+ * Supporting type for layout configuration
+ */
+export interface LayoutConfig {
+    column?: string;
+    row?: string;
+    slot?: string;
+    temporaryContainerHeight?: string;
+}
+/**
+ * Supporting type for renderer configuration
+ */
+export interface RendererConfig {
+    columns?: string;
+    rows?: string;
+    gap?: string;
+    minHeight?: string;
+    layouts?: Array<{
+        columns?: string;
+        rows?: string;
+        gap?: string | number;
+        minWidth?: number;
+        maxWidth?: number;
+    }>;
+}
 export type HistoryMethod = 'pushState' | 'replaceState';

package/types/routing.d.ts

@@ -0,0 +1,12 @@
+import { Node } from './navigation';
+export interface Route {
+    raw: string;
+    node?: Node;
+    path: string;
+    nodeParams?: Record<string, string>;
+}
+export interface LuigiParams {
+    nodeParams: Record<string, any> | {};
+    pathParams: Record<string, any> | {};
+    searchParams: Record<string, any> | {};
+}

package/utilities/helpers/generic-helpers.d.ts

@@ -35,15 +35,39 @@ export declare const GenericHelpers: {
      * @returns {boolean}
      */
     isObject: (objectToCheck: object | any) => boolean;
+    /**
+     * Checks if a given input string begins a hash with slash
+     * @param {string} path
+     * @returns {boolean}
+     */
+    hasHash: (path: string) => boolean;
+    /**
+     * Removes leading hash of a string
+     * @param {string} path
+     * @returns {string}
+     */
+    getPathWithoutHash: (path: string) => string;
+    /**
+     * Removes any trailing slash of a string
+     * @param {string} path
+     * @returns {string}
+     */
+    getTrimmedUrl: (path: string) => string;
+    /**
+     * Adds a leading slash to a string if it has none
+     * @param {string} str string to be checked
+     * @returns {string} string with a leading slash
+     */
+    addLeadingSlash: (str: string) => string;
     /**
      * Removes leading slash of a string
-     * @param {str} string
+     * @param {string} str string to be checked
      * @returns {string} string without leading slash
      */
     trimLeadingSlash: (str: string) => string;
     /**
      * Prepend current url to redirect_uri, if it is a relative path
-     * @param {str} string from which any number of trailing slashes should be removed
+     * @param {string} str string from which any number of trailing slashes should be removed
      * @returns {string} string without any trailing slash
      */
     trimTrailingSlash: (str: string) => string;

package/utilities/helpers/luigi-container-helpers.d.ts

@@ -0,0 +1,18 @@
+import { Luigi } from '../../core-api/luigi';
+export type MicrofrontendEntry = {
+    iframe: HTMLElement;
+    id: string;
+    active: boolean;
+};
+export type MicrofrontendInDom = {
+    container: HTMLElement;
+    active: boolean;
+    type: 'main' | 'modal' | 'drawer';
+    id: string;
+};
+export declare const LuigiContainerHelpers: {
+    getMicrofrontendsInDom(luigi: Luigi): MicrofrontendInDom[];
+    getMainMicrofrontends(luigi: Luigi): MicrofrontendEntry[];
+    getModalMicrofrontends(): MicrofrontendEntry[];
+    getDrawerMicrofrontends(): MicrofrontendEntry;
+};

package/utilities/helpers/navigation-helpers.d.ts

@@ -6,8 +6,9 @@ export declare const NavigationHelpers: {
     segmentMatches: (linkSegment: string, pathSegment: string, pathParams: Record<string, any>) => boolean;
     checkMatch: (route: string, nodesInPath: Array<any>, pathParams?: Record<string, any>) => boolean;
     checkVisibleForFeatureToggles: (nodeToCheckPermission: any, featureToggles: FeatureToggles) => boolean;
-    generateTooltipText: (node: any, translation: string, luigi: Luigi) => string;
+    generateTooltipText: (node: Node, translation: string, luigi: Luigi) => string;
     isNodeAccessPermitted: (nodeToCheckPermissionFor: Node, parentNode: Node | undefined, currentContext: Record<string, any>, luigi: Luigi) => boolean;
+    applyContext: (context: Record<string, any>, addition: Record<string, any>, navigationContext: any) => Record<string, any>;
     updateHeaderTitle: (appSwitcherData: AppSwitcher, pathData: PathData) => string | undefined;
     buildPath(pathToLeftNavParent: Node[], pathData?: PathData): string;
     mergeContext(...objs: Record<string, any>[]): Record<string, any>;
@@ -18,4 +19,12 @@ export declare const NavigationHelpers: {
      * @returns The virtual tree root node if found, otherwise undefined.
      */
     findVirtualTreeRootNode(node: Node): Node | undefined;
+    /**
+     * Validates if a path exists and handles page not found cases.
+     * Returns the redirect path if valid, or undefined if the path should not be followed.
+     * @param path The path to validate
+     * @param luigi The Luigi instance
+     * @returns The redirect path if valid, undefined otherwise
+     */
+    validatePathAndGetRedirect: (path: string, luigi: Luigi) => Promise<string | undefined>;
 };

package/utilities/helpers/routing-helpers.d.ts

@@ -262,6 +262,41 @@ export declare const RoutingHelpers: {
      * @param {*} pathParams
      */
     getDynamicNodeValue(node: Node, pathParams: Record<string, string>): string | undefined;
+    /**
+     * Checks if given path is an existing route or not
+     * @param {string} activePath - path to be checked
+     * @param {PathData} pathData - related path data
+     * @returns {boolean} the result of path checking as boolean value
+     */
+    isExistingRoute(activePath: string, pathData: PathData): boolean;
+    /**
+     * Handles case if path exists or not.
+     * @param {string} path - the path to be checked
+     * @param {Luigi} luigi - the Luigi instance used to access configuration values
+     * @returns {Promise<boolean>} the result of path checking as async boolean value
+     */
+    pathExists(path: string, luigi: Luigi): Promise<boolean>;
+    showRouteNotFoundAlert(path: string, isAnyPathMatched: boolean | undefined, luigi: Luigi): void;
+    /**
+     * Queries the pageNotFoundHandler configuration and returns redirect path if it exists
+     * If the there is no `pageNotFoundHandler` defined we return undefined.
+     * @param {string} notFoundPath - the path to be checked
+     * @param {boolean} isAnyPathMatched - is any path matched or not
+     * @param {Luigi} luigi - the Luigi instance used to access config value
+     * @returns {Object} an object optionally containing the path to redirect, the keepURL option or an empty object if handler is undefined
+     */
+    getPageNotFoundRedirectResult(notFoundPath: string, isAnyPathMatched: boolean | undefined, luigi: Luigi): object;
+    /**
+     * Handles pageNotFound situation depending if path exists or not.
+     * If path exists simply return the given path, else fetch the pageNotFound redirect path and return it.
+     * In case there was no pageNotFound handler defined it shows an alert and returns undefined.
+     * @param {string} path - the path to check for
+     * @param {boolean} pathExists - defines if path exists or not
+     * @param {Luigi} luigi - the Luigi instance used to access configuration values
+     * @returns {} the path to redirect to or undefined if path doesn't exist and no redirect path is defined
+     */
+    handlePageNotFoundAndRetrieveRedirectPath(path: string, pathExists: boolean, luigi: Luigi): Promise<string | undefined>;
+    getDefaultChildNode(pathData: PathData, childrenResolverFn?: (lastElement: object, pathContext: object) => any): Promise<string>;
     /**
      *  Recursively constructs the full path for a given node by concatenating its path segment with those of its ancestors.
      *  If `params` are provided, they are appended as query parameters to the final path.