Interface WorkbenchPopupCapability

Type Declaration

• [key: string]: unknown

  Arbitrary metadata associated with the capability.

• OptionalcssClass?: string | string[]

  Specifies CSS class(es) to add to the popup, e.g., to locate the popup in tests.

• path: string

  Specifies the path to the microfrontend.

  The path is relative to the base URL given in the application manifest, or to the origin of the manifest file if no base URL is specified.

  Path segments can reference capability parameters using the colon syntax.

  {
    "params": [
      {"name": "id", "required": true}
    ],
    "properties": {
      "path": "products/:id", // `:id` references a capability parameter
    }
  }
  Copy

  Empty Path Required if Host Capability

  Popup capabilities of the host application require an empty path. In the route, use canMatchWorkbenchPopupCapability guard to match the popup capability.

  Example: - Route matching a popup capability with qualifier {popup: 'info'}

  import {Routes} from '@angular/router';
  import {canMatchWorkbenchMessageBoxCapability} from '@scion/workbench';
  
  const routes: Routes = [
    {path: '', canMatch: [canMatchWorkbenchPopupCapability({popup: 'info'})], component: InfoComponent},
  ];
  Copy

• OptionalshowSplash?: boolean

  Instructs the workbench to show a splash, such as a skeleton or loading indicator, until the popup microfrontend signals readiness.

  By default, the workbench shows a loading indicator. A custom splash can be configured in the workbench host application.

  This property is not supported if a host microfrontend.

  See

  WorkbenchPopup.signalReady

• Optionalsize?: WorkbenchPopupSize

  Specifies the size of the popup.

  For the popup to adapt to the size of the microfrontend content, set the size to auto and report the microfrontend's preferred size using PreferredSizeService in the microfrontend.

  Example: - Reporting the preferred size in the microfrontend

  import {Beans} from '@scion/toolkit/bean-manager';
  import {PreferredSizeService} from '@scion/microfrontend-platform';
  
  Beans.get(PreferredSizeService).fromDimension(<Microfrontend HTMLElement>);
  ``
  
  If the content can grow and shrink, e.g., if using expandable panels, position the microfrontend `absolute` to allow infinite
  space for rendering at its preferred size
  Copy