@axinom/mosaic-portal 0.14.0 → 0.14.1

package/app/index.d.ts

@@ -1,1458 +1,1212 @@
 import * as React from 'react';
 import * as ReactRouter from 'react-router';
-import * as LibreAtom from '@libre/atom';
-
-declare module "@axinom/mosaic-portal" {
-  /**
-   * Defines the API accessible from pilets.
-   */
-  export interface PiletApi extends EventEmitter, PiletCustomApi, PiletCoreApi {
-    /**
-     * Gets the metadata of the current pilet.
-     */
-    meta: PiletMetadata;
-  }
-
-  /**
-   * The emitter for Piral app shell events.
-   */
-  export interface EventEmitter {
-    /**
-     * Attaches a new event listener.
-     * @param type The type of the event to listen for.
-     * @param callback The callback to trigger.
-     */
-    on<K extends keyof PiralEventMap>(type: K, callback: Listener<PiralEventMap[K]>): EventEmitter;
-    /**
-     * Detaches an existing event listener.
-     * @param type The type of the event to listen for.
-     * @param callback The callback to trigger.
-     */
-    off<K extends keyof PiralEventMap>(type: K, callback: Listener<PiralEventMap[K]>): EventEmitter;
-    /**
-     * Emits a new event with the given type.
-     * @param type The type of the event to emit.
-     * @param arg The payload of the event.
-     */
-    emit<K extends keyof PiralEventMap>(type: K, arg: PiralEventMap[K]): EventEmitter;
-  }
-
-  /**
-   * Custom Pilet API parts defined outside of piral-core.
-   */
-  export interface PiletCustomApi extends AuthApi, EnvironmentApi, HomeApi, RegistrationInfoApi, NavigationApi, NotificationApi, ProviderApi, NavigationResolverApi {}
-
-  /**
-   * Defines the Pilet API from piral-core.
-   * This interface will be consumed by pilet developers so that their pilet can interact with the piral instance.
-   */
-  export interface PiletCoreApi {
-    /**
-     * Gets a shared data value.
-     * @param name The name of the data to retrieve.
-     */
-    getData<TKey extends string>(name: TKey): SharedData[TKey];
-    /**
-     * Sets the data using a given name. The name needs to be used exclusively by the current pilet.
-     * Using the name occupied by another pilet will result in no change.
-     * @param name The name of the data to store.
-     * @param value The value of the data to store.
-     * @param options The optional configuration for storing this piece of data.
-     * @returns True if the data could be set, otherwise false.
-     */
-    setData<TKey extends string>(name: TKey, value: SharedData[TKey], options?: DataStoreOptions): boolean;
-    /**
-     * Registers a route for predefined page component.
-     * The route needs to be unique and can contain params.
-     * Params are following the path-to-regexp notation, e.g., :id for an id parameter.
-     * @param route The route to register.
-     * @param Component The component to render the page.
-     * @param meta The optional metadata to use.
-     */
-    registerPage(route: string, Component: AnyComponent<PageComponentProps>, meta?: PiralPageMeta): RegistrationDisposer;
-    /**
-     * Unregisters the page identified by the given route.
-     * @param route The route that was previously registered.
-     */
-    unregisterPage(route: string): void;
-    /**
-     * Registers an extension component with a predefined extension component.
-     * The name must refer to the extension slot.
-     * @param name The global name of the extension slot.
-     * @param Component The component to be rendered.
-     * @param defaults Optionally, sets the default values for the expected data.
-     */
-    registerExtension<TName>(name: TName extends string ? TName : string, Component: AnyComponent<ExtensionComponentProps<TName>>, defaults?: TName): RegistrationDisposer;
-    /**
-     * Unregisters a global extension component.
-     * Only previously registered extension components can be unregistered.
-     * @param name The name of the extension slot to unregister from.
-     * @param Component The registered extension component to unregister.
-     */
-    unregisterExtension<TName>(name: TName extends string ? TName : string, Component: AnyComponent<ExtensionComponentProps<TName>>): void;
-    /**
-     * React component for displaying extensions for a given name.
-     * @param props The extension's rendering props.
-     * @return The created React element.
-     */
-    Extension<TName>(props: ExtensionSlotProps<TName>): React.ReactElement | null;
-    /**
-     * Renders an extension in a plain DOM component.
-     * @param element The DOM element or shadow root as a container for rendering the extension.
-     * @param props The extension's rendering props.
-     * @return The disposer to clear the extension.
-     */
-    renderHtmlExtension<TName>(element: HTMLElement | ShadowRoot, props: ExtensionSlotProps<TName>): Disposable;
-  }
-
-  /**
-   * Describes the metadata transported by a pilet.
-   */
-  export type PiletMetadata = SinglePiletMetadata | MultiPiletMetadata;
-
-  /**
-   * Listener for Piral app shell events.
-   */
-  export interface Listener<T> {
-    (arg: T): void;
-  }
-
-  /**
-   * The map of known Piral app shell events.
-   */
-  export interface PiralEventMap extends PiralCustomEventMap {
-    "unload-pilet": PiralUnloadPiletEvent;
-    [custom: string]: any;
-    "store-data": PiralStoreDataEvent;
-  }
-
-  export interface AuthApi {
-    /**
-     * Gets the currently authenticated user, if any.
-     */
-    getToken(): Promise<User | undefined>;
-    /**
-     * Checks if the user has one of the `requiredPermissions`.
-     */
-    checkPermission(requiredPermissions: UserPermissions): Promise<boolean>;
-  }
-
-  export interface EnvironmentApi {
-    /**
-     * Returns current portal environment
-     */
-    getEnvironment(): PortalConfiguration;
-  }
-
-  export interface HomeApi {
-    /**
-     * Registers a tile with preferences.
-     * The name has to be unique within the Current pilet.
-     * @param data HomeTileData or AdminTileData object with the details of the tile.
-     * @param registerNavItem if item needs to be added to navigation registry, defaults to true
-     * @example
-     * app.registerTile({
-     *  kind: 'home',
-     *  name: 'service',
-     *  path: '/service-packages',
-     *  label: 'Service Packages',
-     *  icon: require('./images/service-packages.svg'),
-     *  type: 'large',
-     * });
-     * @example
-     * app.registerTile({
-     *  kind: 'settings',
-     *  name: 'service',  
-     *  groupName: 'Users',
-     *  path: '/users/roles',
-     *  label: 'Roles',
-     *  icon: require('./images/roles.svg'),
-     * })
-     */
-    registerTile(data: AnyTile, registerNavItem?: boolean): RegistrationDisposer;
-    /**
-     * Unregisters a tile known by the given name.
-     * Only previously registered tiles can be unregistered.
-     * @param name The name of the tile to unregister.
-     */
-    unregisterTile(name: string): void;
-    /**
-     * Use this to set a function that will be called to determine the order of the tiles on the home station.
-     * @param sorter Sorter function.
-     */
-    setHomeTileSorter(sorter: TileSorter<HomeTileData>): void;
-    /**
-     * Creates a connector for wrapping home with data relations.
-     */
-    createHomeConnector(): HomeStateContainer;
-  }
-
-  export interface RegistrationInfoApi {
-    /**
-     * Registered page components for the router
-     * @return Key value pair with registered route as key and it's page component as value
-     */
-    getRegisteredPages: GetRegisteredPages;
-    /**
-     * Registered extension components for extension slots
-     * @return Key value pair with extension slot name as key and array of it's components as a value
-     */
-    getRegisteredExtensions: GetRegisteredExtensions;
-    /**
-     * @return metadata for currently loaded pilets
-     */
-    getRegisteredPilets: GetRegisteredPilets;
-  }
-
-  export interface NavigationApi {
-    /**
-     * Registers navigation panel item
-     * @param item Contains all details for createing navigation item
-     * @example
-     * app.registerNavigationItem({
-     *    name: 'service-management',
-     *    categoryName: 'Settings',
-     *    path: '/settings/service-management',
-     *    label: 'Service Management',
-     *  });
-     *  app.registerNavigationItem({
-     *    name: 'service-management-feature',
-     *    parentName: 'service-management',
-     *    categoryName: 'Settings',
-     *    path: '/settings/service-management/service-feature',
-     *    label: 'Service Management',
-     *  });
-     */
-    registerNavigationItem(item: RegisterNavigationItem): () => void;
-    /**
-     * Removes registered navigation item
-     * @param name Unique name of the navigation item, that was provided on route registration
-     */
-    unregisterNavigationItem(name: string): void;
-    /**
-     * Creates connector for wrapping component with navigation state data relations
-     */
-    createNavigationConnector(): NavigationConnector;
-    /**
-     * Registers provided navigation item transformation function 
-     * `transformer` function receives flat array of registered navigation items
-     * Use this to alter or re-order registered navigation items
-     * @param transformer function that alters navigation registry items
-     * @example
-     * app.setNavigationItemsTransformer(
-     *  (navItems: NavigationItem[]): NavigationItem[] => {
-     *    return navItems.map((item) => {
-     *      if (item.name.includes('playground')) {
-     *        item.categoryName = 'Playground';
-     *        item.label = item.name.replace(/playground|-/g, ' ');
-     *        item.parentName = undefined;
-     *      }
-     *      return item;
-     *    });
-     *  },
-     * );
-     */
-    setNavigationItemsTransformer(transformer: NavigationTransformer<NavigationItem>): void;
-    /**
-     * Registers provided navigation tree transformation function 
-     * `transformer` function receives navigation item tree created from registered navigation items
-     * Use this to alter or re-order navigation panel categories or their items
-     * @param transformer Function that alters navigation panel item order
-     * @example
-     * app.setNavigationTreeTransformer(
-     *  (navTree: NavigationPanelCategory[]): NavigationPanelCategory[] => {
-     *    return navTree.sort((a, b) =>
-     *      a.categoryName.localeCompare(b.categoryName),
-     *    );
-     *  },
-     * );
-     */
-    setNavigationTreeTransformer(transformer: NavigationTransformer<NavigationPanelCategory>): void;
-  }
-
-  export interface NotificationApi {
-    /**
-     * Displays a toast notification
-     * @param notification Notification to be shown
-     * @returns Id of the toast, used for updating or dismissing the notification
-     * @example
-     * const toastId = app.notifications.show({ title: 'Notification shown', body: 'Hello world', options: { type: 'error', autoClose: false } });
-     */
-    showNotification: ShowNotification;
-    /**
-     * Updates a toast notification
-     * @param id toastId to be updated (returned from 'show' method call)
-     * @param notification Updated notification
-     * @example
-     * app.notifications.update(toastId, { title: 'Notification updated', body: 'Hello world' });
-     */
-    updateNotification: UpdateNotification;
-    /**
-     * Dismisses a toast notification
-     * @param id toastId to be dismissed (returned from 'show' method call)
-     * @example
-     * app.notifications.dismiss(toastId);
-     */
-    dismissNotification: DismissNotification;
-  }
-
-  export interface ProviderApi {
-    /**
-     * Creates a provider object using the 'type' property. Assigns data and converter args to an array of objects as its value. If the 'type' already exists, the data will be appended to the array.
-     * @param type provider name
-     * @param data provider data
-     * @param converter function used to transformation
-     * @example
-     * // new provider
-     * app.addProvider<Example>(
-     *  'fast-provider',
-     *  data: { type: 'movie' });
-     * // appends object to 'fast-provider'array
-     * app.addProvider(
-     *  'fast-provider',,
-     *  data: { type: 'episode' });
-     */
-    addProvider: ProviderRegistration;
-    /**
-     * Returns an array of data associated with a specific provider
-     * @param type Unique value of the provider 'type'
-     * @example
-     * app.getProviders('fast-provider');
-     */
-    getProviders: GetProviders;
-  }
-
-  export interface NavigationResolverApi {
-    /**
-     * Register a resolver function for a station
-     * @param data
-     * @example
-     * ```ts
-     * app.registerRouteResolver({
-     *  station: 'movie-details',
-     *  resolver: (dynamicRouteSegments?: string[]) => {
-     *     return dynamicRouteSegments?.length
-     *      ? `/movies/${dynamicRouteSegments[0]}`
-     *       : undefined;
-     *   },
-     * });
-     * ```
-     */
-    registerRouteResolver(data: ResolverData): void;
-    /**
-     * Resolves a route for a given station
-     * @param station Name of the station
-     * @param dynamicRouteSegments Dynamic route segments
-     * @returns Resolved route
-     * @example
-     * ```ts
-     *  const entityId = '123'
-     *  const route = await app.resolveRoute('movie-details', [entityId]);
-     * ```
-     */
-    resolveRoute: ResolverFunction;
-    /**
-     * Returns resolvers from navigation registry
-     * @returns All registered route resolvers
-     */
-    getAllRouteResolvers(): NavigationResolverRegistryState["navigationResolvers"];
-  }
-
-  /**
-   * Defines the shape of the data store for storing shared data.
-   */
-  export interface SharedData<TValue = any> {
-    [key: string]: TValue;
-  }
-
-  /**
-   * Defines the options to be used for storing data.
-   */
-  export type DataStoreOptions = DataStoreTarget | CustomDataStoreOptions;
-
-  /**
-   * Possible shapes for a component.
-   */
-  export type AnyComponent<T> = React.ComponentType<T> | FirstParametersOf<ComponentConverters<T>>;
-
-  /**
-   * The props used by a page component.
-   */
-  export interface PageComponentProps<T = any, S = any> extends RouteBaseProps<T, S> {}
-
-  /**
-   * The meta data registered for a page.
-   */
-  export interface PiralPageMeta extends PiralCustomPageMeta {}
-
-  /**
-   * The shape of an implicit unregister function.
+
+/**
+ * Defines the API accessible from pilets.
+ */
+export interface PiletApi extends EventEmitter, PiletCustomApi, PiletCoreApi {
+  /**
+   * Gets the metadata of the current pilet.
    */
-  export interface RegistrationDisposer {
-    (): void;
-  }
+  meta: PiletMetadata;
+}
 
+/**
+ * The emitter for Piral app shell events.
+ */
+export interface EventEmitter {
+  /**
+   * Attaches a new event listener.
+   * @param type The type of the event to listen for.
+   * @param callback The callback to trigger.
+   */
+  on<K extends keyof PiralEventMap>(type: K, callback: Listener<PiralEventMap[K]>): EventEmitter;
   /**
-   * The props of an extension component.
+   * Detaches an existing event listener.
+   * @param type The type of the event to listen for.
+   * @param callback The callback to trigger.
    */
-  export interface ExtensionComponentProps<T> extends BaseComponentProps {
-    /**
-     * The provided parameters for showing the extension.
-     */
-    params: T extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[T] : T extends string ? any : T;
-  }
+  off<K extends keyof PiralEventMap>(type: K, callback: Listener<PiralEventMap[K]>): EventEmitter;
+  /**
+   * Emits a new event with the given type.
+   * @param type The type of the event to emit.
+   * @param arg The payload of the event.
+   */
+  emit<K extends keyof PiralEventMap>(type: K, arg: PiralEventMap[K]): EventEmitter;
+}
 
+/**
+ * Custom Pilet API parts defined outside of piral-core.
+ */
+export interface PiletCustomApi extends AuthApi, EnvironmentApi, HomeApi, RegistrationInfoApi, NavigationApi, NotificationApi, ProviderApi, NavigationResolverApi {}
+
+/**
+ * Defines the Pilet API from piral-core.
+ * This interface will be consumed by pilet developers so that their pilet can interact with the piral instance.
+ */
+export interface PiletCoreApi {
+  /**
+   * Gets a shared data value.
+   * @param name The name of the data to retrieve.
+   */
+  getData<TKey extends string>(name: TKey): SharedData[TKey];
+  /**
+   * Sets the data using a given name. The name needs to be used exclusively by the current pilet.
+   * Using the name occupied by another pilet will result in no change.
+   * @param name The name of the data to store.
+   * @param value The value of the data to store.
+   * @param options The optional configuration for storing this piece of data.
+   * @returns True if the data could be set, otherwise false.
+   */
+  setData<TKey extends string>(name: TKey, value: SharedData[TKey], options?: DataStoreOptions): boolean;
+  /**
+   * Registers a route for predefined page component.
+   * The route needs to be unique and can contain params.
+   * Params are following the path-to-regexp notation, e.g., :id for an id parameter.
+   * @param route The route to register.
+   * @param Component The component to render the page.
+   * @param meta The optional metadata to use.
+   */
+  registerPage(route: string, Component: AnyComponent<PageComponentProps>, meta?: PiralPageMeta): RegistrationDisposer;
+  /**
+   * Unregisters the page identified by the given route.
+   * @param route The route that was previously registered.
+   */
+  unregisterPage(route: string): void;
   /**
-   * The props for defining an extension slot.
+   * Registers an extension component with a predefined extension component.
+   * The name must refer to the extension slot.
+   * @param name The global name of the extension slot.
+   * @param Component The component to be rendered.
+   * @param defaults Optionally, sets the default values for the expected data.
    */
-  export type ExtensionSlotProps<K = string> = BaseExtensionSlotProps<K extends string ? K : string, K extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[K] : K extends string ? any : K>;
+  registerExtension<TName>(name: TName extends string ? TName : string, Component: AnyExtensionComponent<TName>, defaults?: Partial<ExtensionParams<TName>>): RegistrationDisposer;
+  /**
+   * Unregisters a global extension component.
+   * Only previously registered extension components can be unregistered.
+   * @param name The name of the extension slot to unregister from.
+   * @param Component The registered extension component to unregister.
+   */
+  unregisterExtension<TName>(name: TName extends string ? TName : string, Component: AnyExtensionComponent<TName>): void;
+  /**
+   * React component for displaying extensions for a given name.
+   * @param props The extension's rendering props.
+   * @return The created React element.
+   */
+  Extension<TName>(props: ExtensionSlotProps<TName>): React.ReactElement | null;
+  /**
+   * Renders an extension in a plain DOM component.
+   * @param element The DOM element or shadow root as a container for rendering the extension.
+   * @param props The extension's rendering props.
+   * @return The disposer to clear the extension.
+   */
+  renderHtmlExtension<TName>(element: HTMLElement | ShadowRoot, props: ExtensionSlotProps<TName>): Disposable;
+}
 
+/**
+ * Describes the metadata of a pilet available in its API.
+ */
+export interface PiletMetadata {
+  /**
+   * The name of the pilet, i.e., the package id.
+   */
+  name: string;
+  /**
+   * The version of the pilet. Should be semantically versioned.
+   */
+  version: string;
+  /**
+   * Provides the version of the specification for this pilet.
+   */
+  spec: string;
+  /**
+   * Provides some custom metadata for the pilet.
+   */
+  custom?: any;
+  /**
+   * Optionally indicates the global require reference, if any.
+   */
+  requireRef?: string;
   /**
-   * Can be implemented by functions to be used for disposal purposes.
+   * Additional shared dependencies from the pilet.
    */
-  export interface Disposable {
-    (): void;
-  }
+  dependencies: Record<string, string>;
+  /**
+   * Provides some configuration to be used in the pilet.
+   */
+  config: Record<string, any>;
+  /**
+   * The URL of the main script of the pilet.
+   */
+  link: string;
+  /**
+   * The base path to the pilet. Can be used to make resource requests
+   * and override the public path.
+   */
+  basePath: string;
+}
+
+/**
+ * Listener for Piral app shell events.
+ */
+export interface Listener<T> {
+  /**
+   * Receives an event of type T.
+   */
+  (arg: T): void;
+}
+
+/**
+ * The map of known Piral app shell events.
+ */
+export interface PiralEventMap extends PiralCustomEventMap {
+  "unload-pilet": PiralUnloadPiletEvent;
+  [custom: string]: any;
+  "store-data": PiralStoreDataEvent;
+}
+
+export interface AuthApi {
+  /**
+   * Gets the currently authenticated user, if any.
+   */
+  getToken(): Promise<User | undefined>;
+  /**
+   * Checks if the user has one of the `requiredPermissions`.
+   */
+  checkPermission(requiredPermissions: UserPermissions): Promise<boolean>;
+}
 
+export interface EnvironmentApi {
   /**
-   * The metadata response for a single pilet.
+   * Returns current portal environment
    */
-  export type SinglePiletMetadata = PiletMetadataV0 | PiletMetadataV1 | PiletMetadataVx;
+  getEnvironment(): PortalConfiguration;
+}
 
+export interface HomeApi {
   /**
-   * The metadata response for a multi pilet.
+   * Registers a tile with preferences.
+   * The name has to be unique within the Current pilet.
+   * @param data HomeTileData or AdminTileData object with the details of the tile.
+   * @param registerNavItem if item needs to be added to navigation registry, defaults to true
+   * @example
+   * app.registerTile({
+   *  kind: 'home',
+   *  name: 'service',
+   *  path: '/service-packages',
+   *  label: 'Service Packages',
+   *  icon: require('./images/service-packages.svg'),
+   *  type: 'large',
+   * });
+   * @example
+   * app.registerTile({
+   *  kind: 'settings',
+   *  name: 'service',  
+   *  groupName: 'Users',
+   *  path: '/users/roles',
+   *  label: 'Roles',
+   *  icon: require('./images/roles.svg'),
+   * })
    */
-  export type MultiPiletMetadata = PiletMetadataBundle;
+  registerTile(data: AnyTile, registerNavItem?: boolean): RegistrationDisposer;
+  /**
+   * Unregisters a tile known by the given name.
+   * Only previously registered tiles can be unregistered.
+   * @param name The name of the tile to unregister.
+   */
+  unregisterTile(name: string): void;
+  /**
+   * Use this to set a function that will be called to determine the order of the tiles on the home station.
+   * @param sorter Sorter function.
+   */
+  setHomeTileSorter(sorter: TileSorter<HomeTileData>): void;
+  /**
+   * Creates a connector for wrapping home with data relations.
+   */
+  createHomeConnector(): HomeStateContainer;
+}
 
+export interface RegistrationInfoApi {
+  /**
+   * Registered page components for the router
+   * @return Key value pair with registered route as key and it's page component as value
+   */
+  getRegisteredPages: GetRegisteredPages;
   /**
-   * Custom events defined outside of piral-core.
+   * Registered extension components for extension slots
+   * @return Key value pair with extension slot name as key and array of it's components as a value
    */
-  export interface PiralCustomEventMap {}
+  getRegisteredExtensions: GetRegisteredExtensions;
+  /**
+   * @return metadata for currently loaded pilets
+   */
+  getRegisteredPilets: GetRegisteredPilets;
+}
+
+export interface NavigationApi {
+  /**
+   * Registers navigation panel item
+   * @param item Contains all details for createing navigation item
+   * @example
+   * app.registerNavigationItem({
+   *    name: 'service-management',
+   *    categoryName: 'Settings',
+   *    path: '/settings/service-management',
+   *    label: 'Service Management',
+   *  });
+   *  app.registerNavigationItem({
+   *    name: 'service-management-feature',
+   *    parentName: 'service-management',
+   *    categoryName: 'Settings',
+   *    path: '/settings/service-management/service-feature',
+   *    label: 'Service Management',
+   *  });
+   */
+  registerNavigationItem(item: RegisterNavigationItem): () => void;
+  /**
+   * Removes registered navigation item
+   * @param name Unique name of the navigation item, that was provided on route registration
+   */
+  unregisterNavigationItem(name: string): void;
+  /**
+   * Creates connector for wrapping component with navigation state data relations
+   */
+  createNavigationConnector(): NavigationConnector;
+  /**
+   * Registers provided navigation item transformation function 
+   * `transformer` function receives flat array of registered navigation items
+   * Use this to alter or re-order registered navigation items
+   * @param transformer function that alters navigation registry items
+   * @example
+   * app.setNavigationItemsTransformer(
+   *  (navItems: NavigationItem[]): NavigationItem[] => {
+   *    return navItems.map((item) => {
+   *      if (item.name.includes('playground')) {
+   *        item.categoryName = 'Playground';
+   *        item.label = item.name.replace(/playground|-/g, ' ');
+   *        item.parentName = undefined;
+   *      }
+   *      return item;
+   *    });
+   *  },
+   * );
+   */
+  setNavigationItemsTransformer(transformer: NavigationTransformer<NavigationItem>): void;
+  /**
+   * Registers provided navigation tree transformation function 
+   * `transformer` function receives navigation item tree created from registered navigation items
+   * Use this to alter or re-order navigation panel categories or their items
+   * @param transformer Function that alters navigation panel item order
+   * @example
+   * app.setNavigationTreeTransformer(
+   *  (navTree: NavigationPanelCategory[]): NavigationPanelCategory[] => {
+   *    return navTree.sort((a, b) =>
+   *      a.categoryName.localeCompare(b.categoryName),
+   *    );
+   *  },
+   * );
+   */
+  setNavigationTreeTransformer(transformer: NavigationTransformer<NavigationPanelCategory>): void;
+}
+
+export interface NotificationApi {
+  /**
+   * Displays a toast notification
+   * @param notification Notification to be shown
+   * @returns Id of the toast, used for updating or dismissing the notification
+   * @example
+   * const toastId = app.notifications.show({ title: 'Notification shown', body: 'Hello world', options: { type: 'error', autoClose: false } });
+   */
+  showNotification: ShowNotification;
+  /**
+   * Updates a toast notification
+   * @param id toastId to be updated (returned from 'show' method call)
+   * @param notification Updated notification
+   * @example
+   * app.notifications.update(toastId, { title: 'Notification updated', body: 'Hello world' });
+   */
+  updateNotification: UpdateNotification;
+  /**
+   * Dismisses a toast notification
+   * @param id toastId to be dismissed (returned from 'show' method call)
+   * @example
+   * app.notifications.dismiss(toastId);
+   */
+  dismissNotification: DismissNotification;
+}
+
+export interface ProviderApi {
+  /**
+   * Creates a provider object using the 'type' property. Assigns data and converter args to an array of objects as its value. If the 'type' already exists, the data will be appended to the array.
+   * @param type provider name
+   * @param data provider data
+   * @param converter function used to transformation
+   * @example
+   * // new provider
+   * app.addProvider<Example>(
+   *  'fast-provider',
+   *  data: { type: 'movie' });
+   * // appends object to 'fast-provider'array
+   * app.addProvider(
+   *  'fast-provider',,
+   *  data: { type: 'episode' });
+   */
+  addProvider: ProviderRegistration;
+  /**
+   * Returns an array of data associated with a specific provider
+   * @param type Unique value of the provider 'type'
+   * @example
+   * app.getProviders('fast-provider');
+   */
+  getProviders: GetProviders;
+}
+
+export interface NavigationResolverApi {
+  /**
+   * Register a resolver function for a station
+   * @param data
+   * @example
+   * ```ts
+   * app.registerRouteResolver({
+   *  station: 'movie-details',
+   *  resolver: (dynamicRouteSegments?: string[]) => {
+   *     return dynamicRouteSegments?.length
+   *      ? `/movies/${dynamicRouteSegments[0]}`
+   *       : undefined;
+   *   },
+   * });
+   * ```
+   */
+  registerRouteResolver(data: ResolverData): void;
+  /**
+   * Resolves a route for a given station
+   * @param station Name of the station
+   * @param dynamicRouteSegments Dynamic route segments
+   * @returns Resolved route
+   * @example
+   * ```ts
+   *  const entityId = '123'
+   *  const route = app.resolveRoute('movie-details', [entityId]);
+   * ```
+   */
+  resolveRoute: ResolverFunction;
+  /**
+   * Returns resolvers from navigation registry
+   * @returns All registered route resolvers
+   */
+  getAllRouteResolvers(): NavigationResolverRegistryState["navigationResolvers"];
+}
+
+/**
+ * Defines the shape of the data store for storing shared data.
+ */
+export interface SharedData<TValue = any> {
+  [key: string]: TValue;
+}
+
+/**
+ * Defines the options to be used for storing data.
+ */
+export type DataStoreOptions = DataStoreTarget | CustomDataStoreOptions;
+
+/**
+ * Possible shapes for a component.
+ */
+export type AnyComponent<T> = React.ComponentType<T> | FirstParametersOf<ComponentConverters<T>>;
 
+/**
+ * The props used by a page component.
+ */
+export interface PageComponentProps<T extends {
+  [K in keyof T]?: string;
+} = {}, S = any> extends RouteBaseProps<T, S> {
   /**
-   * Gets fired when a pilet gets unloaded.
+   * The meta data registered with the page.
    */
-  export interface PiralUnloadPiletEvent {
-    /**
-     * The name of the pilet to be unloaded.
-     */
-    name: string;
-  }
+  meta: PiralPageMeta;
+  /**
+   * The children of the page.
+   */
+  children: React.ReactNode;
+}
+
+/**
+ * The meta data registered for a page.
+ */
+export interface PiralPageMeta extends PiralCustomPageMeta, PiralCustomPageMeta {}
 
+/**
+ * The shape of an implicit unregister function.
+ */
+export interface RegistrationDisposer {
   /**
-   * Gets fired when a data item gets stored in piral.
+   * Cleans up the previous registration.
    */
-  export interface PiralStoreDataEvent<TValue = any> {
-    /**
-     * The name of the item that was stored.
-     */
-    name: string;
-    /**
-     * The storage target of the item.
-     */
-    target: string;
-    /**
-     * The value that was stored.
-     */
-    value: TValue;
-    /**
-     * The owner of the item.
-     */
-    owner: string;
-    /**
-     * The expiration of the item.
-     */
-    expires: number;
-  }
+  (): void;
+}
 
-  export interface User {
-    id: string;
-    name: string;
-    email: string;
-    profilePictureUrl: string;
-    token: UserToken;
-  }
+/**
+ * Shorthand for the definition of an extension component.
+ */
+export type AnyExtensionComponent<TName> = TName extends keyof PiralExtensionSlotMap ? AnyComponent<ExtensionComponentProps<TName>> : TName extends string ? AnyComponent<ExtensionComponentProps<any>> : AnyComponent<ExtensionComponentProps<TName>>;
 
-  export type UserPermissions = UserToken["permissions"];
+/**
+ * Gives the extension params shape for the given extension slot name.
+ */
+export type ExtensionParams<TName> = TName extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[TName] : TName extends string ? any : TName;
 
-  export interface PortalConfiguration {
-    tenantId: string;
-    environmentId: string;
-    microFrontendServiceEndpoint: string;
-    idServiceAuthEndpoint: string;
-  }
+/**
+ * The props for defining an extension slot.
+ */
+export type ExtensionSlotProps<TName = string> = BaseExtensionSlotProps<TName extends string ? TName : string, ExtensionParams<TName>>;
 
-  export type AnyTile = HomeTileData | SettingsTileData;
+/**
+ * Can be implemented by functions to be used for disposal purposes.
+ */
+export interface Disposable {
+  /**
+   * Disposes the created resource.
+   */
+  (): void;
+}
 
-  export interface TileSorter<T extends AnyTile> {
-    (tiles: Array<T>): Array<T>;
-  }
+/**
+ * Custom events defined outside of piral-core.
+ */
+export interface PiralCustomEventMap {}
 
+/**
+ * Gets fired when a pilet gets unloaded.
+ */
+export interface PiralUnloadPiletEvent {
   /**
-   * Data item for Dashboard Tile
+   * The name of the pilet to be unloaded.
    */
-  export interface HomeTileData extends LandingPageItem {
-    /**
-     * Type Tag
-     */
-    kind: "home";
-    /**
-     * Unique name of the Home Tile. This value needs to be unique for the Pilet.
-     */
-    name?: string;
-  }
+  name: string;
+}
 
-  export interface HomeStateContainer {
-    <TProps>(component: React.ComponentType<TProps & HomeStateConnectorProps>): React.FC<TProps>;
-  }
-
-  export type GetRegisteredPages = () => Dict<PageRegistration>;
-
-  export type GetRegisteredExtensions = () => Dict<Array<ExtensionRegistration>>;
-
-  export type GetRegisteredPilets = () => Array<PiletMetadata>;
-
-  export interface RegisterNavigationItem extends Omit<NavigationPanelItem, "items" | "name"> {
-    /**
-     * Title of category under which navigation item will be displayed
-     */
-    categoryName: string;
-    /**
-     * Unique name of the navigation item.
-     */
-    name?: string;
-    /**
-     * Name of parent navigation item for adding navigation item as nested child menu item (2nd navigation level)
-     */
-    parentName?: string;
-  }
-
-  export interface NavigationConnector {
-    <TProps>(component: React.ComponentType<TProps & NavigationConnectorProps>): React.FC<TProps>;
-  }
-
-  export interface NavigationTransformer<T> {
-    (items: Array<T>): Array<T>;
-  }
-
-  export interface NavigationItem extends RegisterNavigationItem {
-    /**
-     * Unique name of the navigation item provided on registration (auto generated in case not provided)
-     */
-    readonly name: string;
-    /**
-     * Name of the pilet registering navigation item
-     */
-    pilet: string;
-  }
-
-  export interface NavigationPanelCategory {
-    /**
-     * Name of the category under which navigation items will be listed
-     */
-    categoryName: string;
-    /**
-     * Navigation items
-     */
-    items: Array<NavigationPanelItem>;
-  }
+/**
+ * Gets fired when a data item gets stored in piral.
+ */
+export interface PiralStoreDataEvent<TValue = any> {
+  /**
+   * The name of the item that was stored.
+   */
+  name: string;
+  /**
+   * The storage target of the item.
+   */
+  target: string;
+  /**
+   * The value that was stored.
+   */
+  value: TValue;
+  /**
+   * The owner of the item.
+   */
+  owner: string;
+  /**
+   * The expiration of the item.
+   */
+  expires: number;
+}
 
-  export type ShowNotification = (notification: Notification) => NotificationId;
+export interface User {
+  id: string;
+  name: string;
+  email: string;
+  profilePictureUrl: string;
+  token: UserToken;
+}
 
-  export type UpdateNotification = (id: NotificationId, notification: Notification) => void;
+export type UserPermissions = UserToken["permissions"];
 
-  export type DismissNotification = (id: NotificationId) => void;
+export interface PortalConfiguration {
+  tenantId: string;
+  environmentId: string;
+  microFrontendServiceEndpoint: string;
+  idServiceAuthEndpoint: string;
+}
 
-  export interface ProviderRegistration {
-    (type: never, data: object): void;
-  }
+export type AnyTile = HomeTileData | SettingsTileData;
 
-  export interface GetProviders<T = object> {
-    (type: string): Array<T>;
-  }
+export interface TileSorter<T extends AnyTile> {
+  (tiles: Array<T>): Array<T>;
+}
 
+/**
+ * Data item for Dashboard Tile
+ */
+export interface HomeTileData extends LandingPageItem {
   /**
-   * Data item for registering a resolver
+   * Type Tag
    */
-  export interface ResolverData {
-    /**
-     * Name of the station, has to be unique among the workflows
-     */
-    station: string;
-    /**
-     * Route resolver function
-     */
-    resolver: NavigationResolver;
-  }
+  kind: "home";
+  /**
+   * Unique name of the Home Tile. This value needs to be unique for the Pilet.
+   */
+  name?: string;
+}
 
+export interface HomeStateContainer {
   /**
-   * Resolver function for resolving a route
+   * State container connector function for wrapping a component. TProps generic can be used to define custom props for the component.
+   * @param component The component to connect by providing a state.
    */
-  export type ResolverFunction = (station: string, dynamicRouteSegments?: Array<string>) => string | undefined;
-
-  /**
-   * Represents the state of the navigation resolver registry
-   */
-  export interface NavigationResolverRegistryState {
-    /**
-     * The registered navigation resolvers
-     * @example
-     * ```ts
-     * {
-     *   'movie-details': (dynamicRouteSegments?: string[]) => dynamicRouteSegments?.length
-     *     ? `/movies/${dynamicRouteSegments[0]}`
-     *     : undefined
-     * },
-     * ```
-     */
-    navigationResolvers: {
-      [key: string]: NavigationResolver;
-    };
-  }
+  <TProps>(component: React.ComponentType<TProps & HomeStateConnectorProps>): React.FC<TProps>;
+}
+
+export type GetRegisteredPages = () => Dict<PageRegistration>;
+
+export type GetRegisteredExtensions = () => Dict<Array<ExtensionRegistration>>;
 
+export type GetRegisteredPilets = () => Array<PiletMetadata>;
+
+export interface RegisterNavigationItem extends Omit<NavigationPanelItem, "items" | "name"> {
+  /**
+   * Title of category under which navigation item will be displayed
+   */
+  categoryName: string;
+  /**
+   * Unique name of the navigation item.
+   */
+  name?: string;
   /**
-   * Defines the potential targets when storing data.
-   */
-  export type DataStoreTarget = "memory" | "local" | "remote";
-
-  /**
-   * Defines the custom options for storing data.
-   */
-  export interface CustomDataStoreOptions {
-    /**
-     * The target data store. By default the data is only stored in memory.
-     */
-    target?: DataStoreTarget;
-    /**
-     * Optionally determines when the data expires.
-     */
-    expires?: "never" | Date | number;
-  }
-
-  export type FirstParametersOf<T> = {
-    [K in keyof T]: T[K] extends (arg: any) => any ? FirstParameter<T[K]> : never;
-  }[keyof T];
-
-  /**
-   * Mapping of available component converters.
-   */
-  export interface ComponentConverters<TProps> extends PiralCustomComponentConverters<TProps> {
-    /**
-     * Converts the HTML component to a framework-independent component.
-     * @param component The vanilla JavaScript component to be converted.
-     */
-    html(component: HtmlComponent<TProps>): ForeignComponent<TProps>;
-  }
-
-  /**
-   * The props that every registered page component obtains.
-   */
-  export interface RouteBaseProps<UrlParams = any, UrlState = any> extends ReactRouter.RouteComponentProps<UrlParams, {}, UrlState>, BaseComponentProps {}
-
-  /**
-   * Custom meta data to include for pages.
-   */
-  export interface PiralCustomPageMeta extends BreadCrumbMeta, PermissionMeta {}
-
-  /**
-   * The props that every registered component obtains.
-   */
-  export interface BaseComponentProps {
-    /**
-     * The currently used pilet API.
-     */
-    piral: PiletApi;
-  }
-
-  /**
-   * The mapping of the existing (known) extension slots.
-   */
-  export interface PiralExtensionSlotMap extends PiralCustomExtensionSlotMap {}
-
-  /**
-   * The basic props for defining an extension slot.
-   */
-  export interface BaseExtensionSlotProps<TName, TParams> {
-    /**
-     * Defines what should be rendered when no components are available
-     * for the specified extension.
-     */
-    empty?(): React.ReactNode;
-    /**
-     * Defines how the provided nodes should be rendered.
-     * @param nodes The rendered extension nodes.
-     */
-    render?(nodes: Array<React.ReactNode>): React.ReactElement<any, any> | null;
-    /**
-     * The custom parameters for the given extension.
-     */
-    params?: TParams;
-    /**
-     * The name of the extension to render.
-     */
-    name: TName;
-  }
-
-  /**
-   * Metadata for pilets using the v0 schema.
-   */
-  export type PiletMetadataV0 = PiletMetadataV0Content | PiletMetadataV0Link;
-
-  /**
-   * Metadata for pilets using the v1 schema.
-   */
-  export interface PiletMetadataV1 {
-    /**
-     * The name of the pilet, i.e., the package id.
-     */
-    name: string;
-    /**
-     * The version of the pilet. Should be semantically versioned.
-     */
-    version: string;
-    /**
-     * Optionally provides the version of the specification for this pilet.
-     */
-    spec?: "v1";
-    /**
-     * The link for retrieving the content of the pilet.
-     */
-    link: string;
-    /**
-     * The reference name for the global require.
-     */
-    requireRef: string;
-    /**
-     * The computed integrity of the pilet. Will be used to set the
-     * integrity value of the script.
-     */
-    integrity?: string;
-    /**
-     * Optionally provides some custom metadata for the pilet.
-     */
-    custom?: any;
-    /**
-     * Optionally provides some configuration to be used in the pilet.
-     */
-    config?: Record<string, any>;
-    /**
-     * Additional shared dependency script files.
-     */
-    dependencies?: Record<string, string>;
-  }
-
-  export interface PiletMetadataVx {
-    /**
-     * The name of the pilet, i.e., the package id.
-     */
-    name: string;
-    /**
-     * The version of the pilet. Should be semantically versioned.
-     */
-    version: string;
-    /**
-     * Provides an identifier for the custom specification.
-     */
-    spec: string;
-    /**
-     * Optionally provides some custom metadata for the pilet.
-     */
-    custom?: any;
-    /**
-     * Optionally provides some configuration to be used in the pilet.
-     */
-    config?: Record<string, any>;
-    /**
-     * Additional shared dependency script files.
-     */
-    dependencies?: Record<string, string>;
-  }
-
-  /**
-   * Metadata for pilets using the bundle schema.
-   */
-  export interface PiletMetadataBundle {
-    /**
-     * The name of the bundle pilet, i.e., the package id.
-     */
-    name?: string;
-    /**
-     * Optionally provides the version of the specification for this pilet.
-     */
-    spec?: "v1";
-    /**
-     * The link for retrieving the bundle content of the pilet.
-     */
-    link: string;
-    /**
-     * The reference name for the global bundle-shared require.
-     */
-    bundle: string;
-    /**
-     * The computed integrity of the pilet. Will be used to set the
-     * integrity value of the script.
-     */
-    integrity?: string;
-    /**
-     * Optionally provides some custom metadata for the pilet.
-     */
-    custom?: any;
-    /**
-     * Additional shared dependency script files.
-     */
-    dependencies?: Record<string, string>;
-  }
-
-  export interface UserToken {
-    accessToken: string;
-    expiresInSeconds: number;
-    permissions: {
-      [serviceId: string]: Array<string>;
-    };
-    tags: Array<string>;
-  }
-
-  /**
-   * Data item for Settings page
-   */
-  export interface SettingsTileData extends HubItem {
-    /**
-     * Type Tag
-     */
-    kind: "settings";
-    /**
-     * Unique name of the Home Tile. This value needs to be unique for the Pilet.
-     */
-    name?: string;
-  }
-
-  export interface LandingPageItem {
-    /**
-     * url path
-     */
-    path: string;
-    /**
-     * Tile label
-     */
-    label: string;
-    /**
-     * Icon location or an react element of svg icon.
-     * if an react element of svg is passed, the correct style for two types ("small" and "large") will be applied accordingly
-     * The styles which don't want to be affected based on the tile type can be passed as inline styles.
-     */
-    icon: string | React.ReactNode;
-    /**
-     * Tile type
-     */
-    type: "small" | "large";
-    /**
-     * Tile is disabled or enabled, default is false
-     */
-    disabled?: boolean;
-    /**
-     * Subtitle resolver
-     */
-    subtitle?: ValueOrOnDemand;
-  }
-
-  export interface HomeStateConnectorProps {
-    /**
-     * Home Tile data currently available in the state.
-     */
-    homeTileData: Array<HomeTileData>;
-    /**
-     * Settings Tile data currently available in the state.
-     */
-    settingsTileData: Array<SettingsTileData>;
-    tileSorter?: TileSorter<HomeTileData>;
-  }
-
-  export type Dict<T> = Record<string, T>;
-
-  /**
-   * The interface modeling the registration of a pilet page component.
-   */
-  export interface PageRegistration extends BaseRegistration {
-    component: WrappedComponent<PageComponentProps>;
-    meta: PiralPageMeta;
-  }
-
-  /**
-   * The interface modeling the registration of a pilet extension component.
-   */
-  export interface ExtensionRegistration extends BaseRegistration {
-    component: WrappedComponent<ExtensionComponentProps<string>>;
-    reference: any;
-    defaults: any;
-  }
-
-  export interface NavigationPanelItem {
-    /**
-     * Unique name of the navigation item provided on registration (auto generated in case not provided)
-     */
-    readonly name: string;
-    /**
-     * Menu item label text
-     */
-    label: string;
-    /**
-     * Icon displayed with label
-     */
-    icon?: string | React.ReactNode;
-    /**
-     * URL path
-     */
-    path?: string;
-    /**
-     * Child navigation items, nested beneath drop down
-     */
-    items?: Array<NavigationPanelItem>;
-  }
-
-  export interface NavigationConnectorProps {
-    /**
-     * Registered navigation items
-     */
-    items: Array<NavigationItem>;
-    /**
-     * registered navigation registry item transformer
-     */
-    itemsTransformer?: NavigationTransformer<NavigationItem>;
-    /**
-     * Registered navigation tree transformer
-     */
-    treeTransformer?: NavigationTransformer<NavigationPanelCategory>;
-  }
-
-  export interface Notification {
-    /**
-     * Title shown in toast messages header
-     */
-    title: string;
-    /**
-     * Optional body of the notification
-     */
-    body?: NotificationBody;
-    /**
-     * Additional options for the notification
-     */
-    options?: NotificationOptions;
-  }
-
-  export type NotificationId = string | number;
-
-  /**
-   * Navigation resolver function for resolver registration
-   */
-  export type NavigationResolver = (dynamicRouteSegments?: Array<string>) => string | undefined;
-
-  export type FirstParameter<T extends (arg: any) => any> = T extends (arg: infer P) => any ? P : never;
-
-  /**
-   * Custom component converters defined outside of piral-core.
-   */
-  export interface PiralCustomComponentConverters<TProps> {}
-
-  /**
-   * Definition of a vanilla JavaScript component.
-   */
-  export interface HtmlComponent<TProps> {
-    /**
-     * Renders a component into the provided element using the given props and context.
-     */
-    component: ForeignComponent<TProps>;
-    /**
-     * The type of the HTML component.
-     */
-    type: "html";
-  }
-
-  /**
-   * Generic definition of a framework-independent component.
-   */
-  export interface ForeignComponent<TProps> {
-    /**
-     * Called when the component is mounted.
-     * @param element The container hosting the element.
-     * @param props The props to transport.
-     * @param ctx The associated context.
-     */
-    mount(element: HTMLElement, props: TProps, ctx: ComponentContext): void;
-    /**
-     * Called when the component should be updated.
-     * @param element The container hosting the element.
-     * @param props The props to transport.
-     * @param ctx The associated context.
-     */
-    update?(element: HTMLElement, props: TProps, ctx: ComponentContext): void;
-    /**
-     * Called when a component is unmounted.
-     * @param element The container that was hosting the element.
-     */
-    unmount?(element: HTMLElement): void;
-  }
-
-  export interface BreadCrumbMeta {
-    /**
-     * A function that provides the value that should be used in the breadcrumb.
-     */
-    breadcrumb?: BreadcrumbResolver;
-  }
-
-  export interface PermissionMeta {
-    permissions?: {
-      [key: string]: Array<string>;
-    };
-  }
-
-  /**
-   * Custom extension slots outside of piral-core.
-   */
-  export interface PiralCustomExtensionSlotMap {}
-
-  /**
-   * Metadata for pilets using the v0 schema with a content.
-   */
-  export interface PiletMetadataV0Content extends PiletMetadataV0Base {
-    /**
-     * The content of the pilet. If the content is not available
-     * the link will be used (unless caching has been activated).
-     */
-    content: string;
-    /**
-     * If available indicates that the pilet should not be cached.
-     * In case of a string this is interpreted as the expiration time
-     * of the cache. In case of an accurate hash this should not be
-     * required or set.
-     */
-    noCache?: boolean | string;
-  }
+   * Name of parent navigation item for adding navigation item as nested child menu item (2nd navigation level)
+   */
+  parentName?: string;
+}
 
+export interface NavigationConnector {
   /**
-   * Metadata for pilets using the v0 schema with a link.
+   * Connector function for wraping a component
+   * @param component The component to connet by providing navigation state properties
    */
-  export interface PiletMetadataV0Link extends PiletMetadataV0Base {
-    /**
-     * The link for retrieving the content of the pilet.
-     */
-    link: string;
-  }
+  <TProps>(component: React.ComponentType<TProps & NavigationConnectorProps>): React.FC<TProps>;
+}
 
-  export interface HubItem extends TileProps {
-    /**
-     * Group name of the item
-     */
-    groupName: string;
-  }
+export interface NavigationTransformer<T> {
+  (items: Array<T>): Array<T>;
+}
 
-  export type ValueOrOnDemand = string | number | (() => Promise<string | number>);
+export interface NavigationItem extends RegisterNavigationItem {
+  /**
+   * Unique name of the navigation item provided on registration (auto generated in case not provided)
+   */
+  readonly name: string;
+  /**
+   * Name of the pilet registering navigation item
+   */
+  pilet: string;
+}
 
+export interface NavigationPanelCategory {
+  /**
+   * Name of the category under which navigation items will be listed
+   */
+  categoryName: string;
   /**
-   * The base type for pilet component registration in the global state context.
+   * Navigation items
    */
-  export interface BaseRegistration {
-    pilet: string;
-  }
+  items: Array<NavigationPanelItem>;
+}
+
+export type ShowNotification = (notification: Notification) => NotificationId;
+
+export type UpdateNotification = (id: NotificationId, notification: Notification) => void;
+
+export type DismissNotification = (id: NotificationId) => void;
 
-  export type WrappedComponent<TProps> = React.ComponentType<Without<TProps, keyof BaseComponentProps>>;
-
-  export type NotificationBody = string | React.ReactNode | React.Component;
-
-  export interface NotificationOptions {
-    type?: NotificationType;
-    autoClose?: number | false;
-  }
+export interface ProviderRegistration {
+  (type: never, data: object): void;
+}
 
+export interface GetProviders<T = object> {
+  (type: string): Array<T>;
+}
+
+/**
+ * Data item for registering a resolver
+ */
+export interface ResolverData {
+  /**
+   * Name of the station, has to be unique among the workflows
+   */
+  station: string;
   /**
-   * The context to be transported into the generic components.
+   * Route resolver function
    */
-  export interface ComponentContext {
-    router: ReactRouter.RouteComponentProps;
-    state: LibreAtom.Atom<GlobalState>;
-  }
+  resolver: NavigationResolver;
+}
+
+/**
+ * Resolver function for resolving a route
+ */
+export type ResolverFunction = (station: string, dynamicRouteSegments?: Array<string>) => string | undefined;
 
+/**
+ * Represents the state of the navigation resolver registry
+ */
+export interface NavigationResolverRegistryState {
   /**
-   * A function that provides the value that should be used in the breadcrumb.
+   * The registered navigation resolvers
+   * @example
+   * ```ts
+   * {
+   *   'movie-details': (dynamicRouteSegments?: string[]) => dynamicRouteSegments?.length
+   *     ? `/movies/${dynamicRouteSegments[0]}`
+   *     : undefined
+   * },
+   * ```
    */
-  export type BreadcrumbResolver = (routeParams: {
-    [key: string]: string;
-  }) => Breadcrumb["label"];
-
-  /**
-   * Basic metadata for pilets using the v0 schema.
-   */
-  export interface PiletMetadataV0Base {
-    /**
-     * The name of the pilet, i.e., the package id.
-     */
-    name: string;
-    /**
-     * The version of the pilet. Should be semantically versioned.
-     */
-    version: string;
-    /**
-     * Optionally provides the version of the specification for this pilet.
-     */
-    spec?: "v0";
-    /**
-     * The computed hash value of the pilet's content. Should be
-     * accurate to allow caching.
-     */
-    hash: string;
-    /**
-     * Optionally provides some custom metadata for the pilet.
-     */
-    custom?: any;
-    /**
-     * Optionally provides some configuration to be used in the pilet.
-     */
-    config?: Record<string, any>;
-    /**
-     * Additional shared dependency script files.
-     */
-    dependencies?: Record<string, string>;
-  }
-
-  export interface TileProps {
-    /**
-     * url path
-     */
-    path: string;
-    /**
-     * Tile label
-     */
-    label: string;
-    /**
-     * Icon location or an react element of svg icon.
-     * if an react element of svg is passed, the correct style for two types ("small" and "large") will be applied accordingly
-     * The styles which don't want to be affected based on the tile type can be passed as inline styles.
-     */
-    icon: string | React.ReactNode;
-    /**
-     * Tile is disabled or enabled, default is false
-     */
-    disabled?: boolean;
-  }
-
-  export type Without<T, K> = Pick<T, Exclude<keyof T, K>>;
-
-  export type NotificationType = "success" | "error" | "info" | "warning";
-
-  /**
-   * The Piral global app state container.
-   */
-  export interface GlobalState extends PiralCustomState {
-    /**
-     * The relevant state for the app itself.
-     */
-    app: AppState;
-    /**
-     * The relevant state for rendering errors of the app.
-     */
-    errorComponents: ErrorComponentsState;
-    /**
-     * The relevant state for rendering parts of the app.
-     */
-    components: ComponentsState;
-    /**
-     * The relevant state for the registered components.
-     */
-    registry: RegistryState;
-    /**
-     * Gets the loaded modules.
-     */
-    modules: Array<PiletMetadata>;
-    /**
-     * The foreign component portals to render.
-     */
-    portals: Record<string, Array<React.ReactPortal>>;
-    /**
-     * The application's shared data.
-     */
-    data: Dict<SharedDataItem>;
-    /**
-     * The used (exact) application routes.
-     */
-    routes: Dict<React.ComponentType<ReactRouter.RouteComponentProps<any>>>;
-    /**
-     * The current provider.
-     */
-    provider?: React.ComponentType;
-  }
-
-  /**
-   * Breadcrumb
-   */
-  export interface Breadcrumb {
-    /**
-     * Text to be displayed in breadcrumb
-     */
-    label: ValueOrOnDemand;
-    /**
-     * The link it leads to, must be absolute path
-     */
-    url: string;
-    /**
-     * Collection of route parameters
-     */
-    params: [];
-  }
-
-  /**
-   * Custom state extensions defined outside of piral-core.
-   */
-  export interface PiralCustomState {}
-
-  /**
-   * The Piral global app sub-state container for app information.
-   */
-  export interface AppState {
-    /**
-     * Information for the layout computation.
-     */
-    layout: LayoutType;
-    /**
-     * Gets if the application is currently performing a background loading
-     * activity, e.g., for loading modules asynchronously or fetching
-     * translations.
-     */
-    loading: boolean;
-    /**
-     * Gets an unrecoverable application error, if any.
-     */
-    error: Error | undefined;
-  }
-
-  export type ErrorComponentsState = {
-    [P in keyof Errors]?: React.ComponentType<Errors[P]>;
+  navigationResolvers: {
+    [key: string]: NavigationResolver;
   };
+}
+
+/**
+ * Defines the potential targets when storing data.
+ */
+export type DataStoreTarget = "memory" | "local" | "remote";
 
+/**
+ * Defines the custom options for storing data.
+ */
+export interface CustomDataStoreOptions {
+  /**
+   * The target data store. By default the data is only stored in memory.
+   */
+  target?: DataStoreTarget;
   /**
-   * The Piral global app sub-state container for shared components.
-   */
-  export interface ComponentsState extends PiralCustomComponentsState {
-    /**
-     * The loading indicator renderer.
-     */
-    LoadingIndicator: React.ComponentType<LoadingIndicatorProps>;
-    /**
-     * The error renderer.
-     */
-    ErrorInfo: React.ComponentType<ErrorInfoProps>;
-    /**
-     * The router context.
-     */
-    Router: React.ComponentType<RouterProps>;
-    /**
-     * The layout used for pages.
-     */
-    Layout: React.ComponentType<LayoutProps>;
-    /**
-     * A component that can be used for debugging purposes.
-     */
-    Debug?: React.ComponentType;
-  }
-
-  /**
-   * The Piral global app sub-state container for component registrations.
+   * Optionally determines when the data expires.
    */
-  export interface RegistryState extends PiralCustomRegistryState {
-    /**
-     * The registered page components for the router.
-     */
-    pages: Dict<PageRegistration>;
-    /**
-     * The registered extension components for extension slots.
-     */
-    extensions: Dict<Array<ExtensionRegistration>>;
-    /**
-     * The registered wrappers for any component.
-     */
-    wrappers: Dict<React.ComponentType<any>>;
-  }
+  expires?: "never" | Date | number;
+}
 
+export type FirstParametersOf<T> = {
+  [K in keyof T]: T[K] extends (arg: any) => any ? FirstParameter<T[K]> : never;
+}[keyof T];
+
+/**
+ * Mapping of available component converters.
+ */
+export interface ComponentConverters<TProps> extends PiralCustomComponentConverters<TProps> {
   /**
-   * Defines the shape of a shared data item.
+   * Converts the HTML component to a framework-independent component.
+   * @param component The vanilla JavaScript component to be converted.
    */
-  export interface SharedDataItem<TValue = any> {
-    /**
-     * Gets the associated value.
-     */
-    value: TValue;
-    /**
-     * Gets the owner of the item.
-     */
-    owner: string;
-    /**
-     * Gets the storage location.
-     */
-    target: DataStoreTarget;
-    /**
-     * Gets the expiration of the item.
-     */
-    expires: number;
-  }
+  html(component: HtmlComponent<TProps>): ForeignComponent<TProps>;
+}
+
+/**
+ * The props that every registered page component obtains.
+ */
+export interface RouteBaseProps<UrlParams extends {
+  [K in keyof UrlParams]?: string;
+} = {}, UrlState = any> extends ReactRouter.RouteComponentProps<UrlParams, {}, UrlState>, BaseComponentProps {}
 
+/**
+ * Custom meta data to include for pages.
+ */
+export interface PiralCustomPageMeta extends BreadCrumbMeta, PermissionMeta {}
+
+/**
+ * The props of an extension component.
+ */
+export interface ExtensionComponentProps<T> extends BaseComponentProps {
   /**
-   * The different known layout types.
+   * The provided parameters for showing the extension.
    */
-  export type LayoutType = "mobile" | "tablet" | "desktop";
+  params: T extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[T] : T extends string ? any : T;
+  /**
+   * The optional children to receive, if any.
+   */
+  children?: React.ReactNode;
+}
+
+/**
+ * The mapping of the existing (known) extension slots.
+ */
+export interface PiralExtensionSlotMap extends PiralCustomExtensionSlotMap {}
 
+/**
+ * The basic props for defining an extension slot.
+ */
+export interface BaseExtensionSlotProps<TName, TParams> {
+  /**
+   * The children to transport, if any.
+   */
+  children?: React.ReactNode;
+  /**
+   * Defines what should be rendered when no components are available
+   * for the specified extension.
+   */
+  empty?(): React.ReactNode;
+  /**
+   * Determines if the `render` function should be called in case no
+   * components are available for the specified extension.
+   * 
+   * If true, `empty` will be called and returned from the slot.
+   * If false, `render` will be called with the result of calling `empty`.
+   * The result of calling `render` will then be returned from the slot.
+   */
+  emptySkipsRender?: boolean;
+  /**
+   * Defines the order of the components to render.
+   * May be more convient than using `render` w.r.t. ordering extensions
+   * by their supplied metadata.
+   * @param extensions The registered extensions.
+   * @returns The ordered extensions.
+   */
+  order?(extensions: Array<ExtensionRegistration>): Array<ExtensionRegistration>;
   /**
-   * Map of all error types to their respective props.
+   * Defines how the provided nodes should be rendered.
+   * @param nodes The rendered extension nodes.
+   * @returns The rendered nodes, i.e., an ReactElement.
    */
-  export interface Errors extends PiralCustomErrors {
-    /**
-     * The props type for an extension error.
-     */
-    extension: ExtensionErrorInfoProps;
-    /**
-     * The props type for a loading error.
-     */
-    loading: LoadingErrorInfoProps;
-    /**
-     * The props type for a page error.
-     */
-    page: PageErrorInfoProps;
-    /**
-     * The props type for a not found error.
-     */
-    not_found: NotFoundErrorInfoProps;
-    /**
-     * The props type for an unknown error.
-     */
-    unknown: UnknownErrorInfoProps;
-  }
+  render?(nodes: Array<React.ReactNode>): React.ReactElement<any, any> | null;
+  /**
+   * The custom parameters for the given extension.
+   */
+  params?: TParams;
+  /**
+   * The name of the extension to render.
+   */
+  name: TName;
+}
 
+export interface UserToken {
+  accessToken: string;
+  expiresInSeconds: number;
+  permissions: {
+    [serviceId: string]: Array<string>;
+  };
+  tags: Array<string>;
+}
+
+/**
+ * Data item for Settings page
+ */
+export interface SettingsTileData extends HubItem {
   /**
-   * Custom parts of the global custom component state defined outside of piral-core.
+   * Type Tag
    */
-  export interface PiralCustomComponentsState {}
-
+  kind: "settings";
   /**
-   * The props of a Loading indicator component.
-   */
-  export interface LoadingIndicatorProps {}
+   * Unique name of the Home Tile. This value needs to be unique for the Pilet.
+   */
+  name?: string;
+}
 
+export interface LandingPageItem {
   /**
-   * The props for the ErrorInfo component.
+   * url path
    */
-  export type ErrorInfoProps = UnionOf<Errors>;
+  path: string;
+  /**
+   * Tile label
+   */
+  label: string;
+  /**
+   * Icon location or an react element of svg icon.
+   * if an react element of svg is passed, the correct style for two types ("small" and "large") will be applied accordingly
+   * The styles which don't want to be affected based on the tile type can be passed as inline styles.
+   */
+  icon: string | React.ReactNode;
+  /**
+   * Tile type
+   */
+  type: "small" | "large";
+  /**
+   * Tile is disabled or enabled, default is false
+   */
+  disabled?: boolean;
+  /**
+   * Subtitle resolver
+   */
+  subtitle?: ValueOrOnDemand;
+}
 
+export interface HomeStateConnectorProps {
+  /**
+   * Home Tile data currently available in the state.
+   */
+  homeTileData: Array<HomeTileData>;
   /**
-   * The props of a Router component.
+   * Settings Tile data currently available in the state.
    */
-  export interface RouterProps {}
+  settingsTileData: Array<SettingsTileData>;
+  tileSorter?: TileSorter<HomeTileData>;
+}
+
+export type Dict<T> = Record<string, T>;
 
+/**
+ * The interface modeling the registration of a pilet page component.
+ */
+export interface PageRegistration extends BaseRegistration {
   /**
-   * The props of a Layout component.
+   * The registered page component.
    */
-  export interface LayoutProps {
-    /**
-     * The currently selected layout type.
-     */
-    currentLayout: LayoutType;
-  }
+  component: WrappedComponent<PageComponentProps>;
+  /**
+   * The page's associated metadata.
+   */
+  meta: PiralPageMeta;
+}
 
+/**
+ * The interface modeling the registration of a pilet extension component.
+ */
+export interface ExtensionRegistration extends BaseRegistration {
+  /**
+   * The wrapped registered extension component.
+   */
+  component: WrappedComponent<ExtensionComponentProps<string>>;
   /**
-   * Custom parts of the global registry state defined outside of piral-core.
+   * The original extension component that has been registered.
    */
-  export interface PiralCustomRegistryState extends HomeRegistryState, NavigationRegistryState, ProviderRegistryState, NavigationResolverRegistryState {}
+  reference: any;
+  /**
+   * The default params (i.e., meta) of the extension.
+   */
+  defaults: any;
+}
 
+export interface NavigationPanelItem {
+  /**
+   * Unique name of the navigation item provided on registration (auto generated in case not provided)
+   */
+  readonly name: string;
+  /**
+   * Menu item label text
+   */
+  label: string;
+  /**
+   * Icon displayed with label
+   */
+  icon?: string | React.ReactNode;
   /**
-   * Custom errors defined outside of piral-core.
+   * URL path
    */
-  export interface PiralCustomErrors {}
+  path?: string;
+  /**
+   * Child navigation items, nested beneath drop down
+   */
+  items?: Array<NavigationPanelItem>;
+}
 
+export interface NavigationConnectorProps {
+  /**
+   * Registered navigation items
+   */
+  items: Array<NavigationItem>;
   /**
-   * The error used when a registered extension component crashed.
+   * registered navigation registry item transformer
    */
-  export interface ExtensionErrorInfoProps {
-    /**
-     * The type of the error.
-     */
-    type: "extension";
-    /**
-     * The provided error details.
-     */
-    error: any;
-  }
+  itemsTransformer?: NavigationTransformer<NavigationItem>;
+  /**
+   * Registered navigation tree transformer
+   */
+  treeTransformer?: NavigationTransformer<NavigationPanelCategory>;
+}
 
+export interface Notification {
   /**
-   * The error used when the app could not be loaded.
+   * Title shown in toast messages header
    */
-  export interface LoadingErrorInfoProps {
-    /**
-     * The type of the error.
-     */
-    type: "loading";
-    /**
-     * The provided error details.
-     */
-    error: any;
-  }
+  title: string;
+  /**
+   * Optional body of the notification
+   */
+  body?: NotificationBody;
+  /**
+   * Additional options for the notification
+   */
+  options?: NotificationOptions;
+}
+
+export type NotificationId = string | number;
+
+/**
+ * Navigation resolver function for resolver registration
+ */
+export type NavigationResolver = (dynamicRouteSegments?: Array<string>) => string | undefined;
+
+export type FirstParameter<T extends (arg: any) => any> = T extends (arg: infer P) => any ? P : never;
+
+/**
+ * Custom component converters defined outside of piral-core.
+ */
+export interface PiralCustomComponentConverters<TProps> {}
+
+/**
+ * Definition of a vanilla JavaScript component.
+ */
+export interface HtmlComponent<TProps> {
+  /**
+   * Renders a component into the provided element using the given props and context.
+   */
+  component: ForeignComponent<TProps>;
+  /**
+   * The type of the HTML component.
+   */
+  type: "html";
+}
+
+/**
+ * Generic definition of a framework-independent component.
+ */
+export interface ForeignComponent<TProps> {
+  /**
+   * Called when the component is mounted.
+   * @param element The container hosting the element.
+   * @param props The props to transport.
+   * @param ctx The associated context.
+   * @param locals The local state of this component instance.
+   */
+  mount(element: HTMLElement, props: TProps, ctx: ComponentContext, locals: Record<string, any>): void;
+  /**
+   * Called when the component should be updated.
+   * @param element The container hosting the element.
+   * @param props The props to transport.
+   * @param ctx The associated context.
+   * @param locals The local state of this component instance.
+   */
+  update?(element: HTMLElement, props: TProps, ctx: ComponentContext, locals: Record<string, any>): void;
+  /**
+   * Called when a component is unmounted.
+   * @param element The container that was hosting the element.
+   * @param locals The local state of this component instance.
+   */
+  unmount?(element: HTMLElement, locals: Record<string, any>): void;
+}
 
+/**
+ * The props that every registered component obtains.
+ */
+export interface BaseComponentProps {
   /**
-   * The error used when a registered page component crashes.
+   * The currently used pilet API.
    */
-  export interface PageErrorInfoProps extends ReactRouter.RouteComponentProps {
-    /**
-     * The type of the error.
-     */
-    type: "page";
-    /**
-     * The provided error details.
-     */
-    error: any;
-  }
+  piral: PiletApi;
+}
 
+export interface BreadCrumbMeta {
   /**
-   * The error used when a route cannot be resolved.
+   * A function that provides the value that should be used in the breadcrumb.
    */
-  export interface NotFoundErrorInfoProps extends ReactRouter.RouteComponentProps {
-    /**
-     * The type of the error.
-     */
-    type: "not_found";
-  }
+  breadcrumb?: BreadcrumbResolver;
+}
+
+export interface PermissionMeta {
+  permissions?: {
+    [key: string]: Array<string>;
+  };
+}
+
+/**
+ * Custom extension slots outside of piral-core.
+ */
+export interface PiralCustomExtensionSlotMap {}
 
+export interface HubItem extends TileProps {
   /**
-   * The error used when the exact type is unknown.
+   * Group name of the item
    */
-  export interface UnknownErrorInfoProps {
-    /**
-     * The type of the error.
-     */
-    type: "unknown";
-    /**
-     * The provided error details.
-     */
-    error: any;
-  }
+  groupName: string;
+}
 
-  export type UnionOf<T> = {
-    [K in keyof T]: T[K];
-  }[keyof T];
+export type ValueOrOnDemand = string | number | (() => Promise<string | number>);
 
-  export interface HomeRegistryState {
-    home: {
-      /**
-       * The registered tile components for the home.
-       */
-      tiles: Dict<HomeTileData | SettingsTileData>;
-      sorter?: TileSorter<HomeTileData>;
-    };
-  }
+/**
+ * The base type for pilet component registration in the global state context.
+ */
+export interface BaseRegistration {
+  /**
+   * The pilet registering the component.
+   */
+  pilet: string;
+}
+
+export type WrappedComponent<TProps> = React.ComponentType<React.PropsWithChildren<Without<TProps, keyof BaseComponentProps>>>;
+
+export type NotificationBody = string | React.ReactNode | React.Component;
 
-  export interface NavigationRegistryState {
-    navigation: {
-      items: Array<NavigationItem>;
-      itemsTransformer?: NavigationTransformer<NavigationItem>;
-      treeTransformer?: NavigationTransformer<NavigationPanelCategory>;
-    };
-  }
-
-  export interface ProviderRegistryState {
-    providers: Record<string, Array<object>>;
-  }
+export interface NotificationOptions {
+  type?: NotificationType;
+  autoClose?: number | false;
+}
+
+/**
+ * The context to be transported into the generic components.
+ */
+export interface ComponentContext {
+  /**
+   * The router-independent navigation API.
+   */
+  navigation: NavigationApi___1;
+  /**
+   * The internal router object.
+   * @deprecated Exposes internals that can change at any time.
+   */
+  router: any;
+  /**
+   * The public path of the application.
+   */
+  publicPath: string;
+}
+
+/**
+ * A function that provides the value that should be used in the breadcrumb.
+ */
+export type BreadcrumbResolver = (routeParams: {
+  [key: string]: string;
+}) => Breadcrumb["label"];
+
+export interface TileProps {
+  /**
+   * url path
+   */
+  path: string;
+  /**
+   * Tile label
+   */
+  label: string;
+  /**
+   * Tile sub label
+   */
+  subLabel?: string;
+  /**
+   * Icon location or an react element of svg icon.
+   * if an react element of svg is passed, the correct style for two types ("small" and "large") will be applied accordingly
+   * The styles which don't want to be affected based on the tile type can be passed as inline styles.
+   */
+  icon: string | React.ReactNode;
+  /**
+   * Tile is disabled or enabled, default is false
+   */
+  disabled?: boolean;
+}
+
+export type Without<T, K> = Pick<T, Exclude<keyof T, K>>;
+
+export type NotificationType = "success" | "error" | "info" | "warning";
+
+export interface NavigationApi___1 {
+  /**
+   * Pushes a new location onto the history stack.
+   */
+  push(target: string, state?: any): void;
+  /**
+   * Replaces the current location with another.
+   */
+  replace(target: string, state?: any): void;
+  /**
+   * Changes the current index in the history stack by a given delta.
+   */
+  go(n: number): void;
+  /**
+   * Prevents changes to the history stack from happening.
+   * This is useful when you want to prevent the user navigating
+   * away from the current page, for example when they have some
+   * unsaved data on the current page.
+   * @param blocker The function being called with a transition request.
+   * @returns The disposable for stopping the block.
+   */
+  block(blocker: NavigationBlocker): Disposable;
+  /**
+   * Starts listening for location changes and calls the given
+   * callback with an Update when it does.
+   * @param listener The function being called when the route changes.
+   * @returns The disposable for stopping the block.
+   */
+  listen(listener: NavigationListener): Disposable;
+  /**
+   * Gets the current navigation / application path.
+   */
+  path: string;
+  /**
+   * Gets the current navigation path incl. search and hash parts.
+   */
+  url: string;
+  /**
+   * The original router behind the navigation. Don't depend on this
+   * as the implementation is router specific and may change over time.
+   */
+  router: any;
+}
+
+/**
+ * Breadcrumb
+ */
+export interface Breadcrumb {
+  /**
+   * Text to be displayed in breadcrumb
+   */
+  label: ValueOrOnDemand;
+  /**
+   * The link it leads to, must be absolute path
+   */
+  url: string;
+  /**
+   * Collection of route parameters
+   */
+  params: [];
+}
+
+export interface NavigationBlocker {
+  (tx: NavigationTransition): void;
+}
+
+export interface NavigationListener {
+  (update: NavigationUpdate): void;
+}
+
+export interface NavigationTransition extends NavigationUpdate {
+  retry?(): void;
+}
+
+export interface NavigationUpdate {
+  action: NavigationAction;
+  location: NavigationLocation;
+}
+
+export type NavigationAction = "POP" | "PUSH" | "REPLACE";
+
+export interface NavigationLocation {
+  /**
+   * The fully qualified URL incl. the origin and base path.
+   */
+  href: string;
+  /**
+   * The location.pathname property is a string that contains an initial "/"
+   * followed by the remainder of the URL up to the ?.
+   */
+  pathname: string;
+  /**
+   * The location.search property is a string that contains an initial "?"
+   * followed by the key=value pairs in the query string. If there are no
+   * parameters, this value may be the empty string (i.e. '').
+   */
+  search: string;
+  /**
+   * The location.hash property is a string that contains an initial "#"
+   * followed by fragment identifier of the URL. If there is no fragment
+   * identifier, this value may be the empty string (i.e. '').
+   */
+  hash: string;
+  /**
+   * The location.state property is a user-supplied State object that is
+   * associated with this location. This can be a useful place to store
+   * any information you do not want to put in the URL, e.g. session-specific
+   * data.
+   */
+  state: unknown;
+  /**
+   * The location.key property is a unique string associated with this location.
+   * On the initial location, this will be the string default. On all subsequent
+   * locations, this string will be a unique identifier.
+   */
+  key?: string;
 }