Web SDK documentation
  1. Components
  2. GlobalContextWidgetWrapperComponent

File

global-context/integration/widget-wrapper/global-context-widget-wrapper.component.ts

Implements

OnInit

Metadata

changeDetection ChangeDetectionStrategy.OnPush
host {
}
selector c8y-global-context-widget-wrapper
standalone true
imports GlobalContextInlineComponent GlobalContextWidgetConfigComponent NgTemplateOutlet ReactiveFormsModule PopoverModule PreviewControlsComponent
template 
@if (widgetControls()) {
  @let GLOBAL_CONTEXT_CONFIG = internalConfig();
  @let INLINE = WIDGET_DISPLAY_MODE.INLINE;
  @let CONFIG = WIDGET_DISPLAY_MODE.CONFIG;
  @let PREVIEW = WIDGET_DISPLAY_MODE.PREVIEW;
  @let DISPLAY_MODE = GLOBAL_CONTEXT_CONFIG?.displayMode;
  @let DASHBOARD = GLOBAL_CONTEXT_DISPLAY_MODE.DASHBOARD;

  @switch (displayMode()) {
    @case (INLINE) {
      <c8y-global-context-inline
        #globalContextInlineRef="globalContextInline"
        [config]="GLOBAL_CONTEXT_CONFIG"
        [widgetControls]="widgetControls()"
        [isLoading]="isLoading()"
        [dashboardChildForLegacy]="dashboardChildForLegacy()"
        (refresh)="onRefresh()"
        (globalContextChange)="onGlobalContextChange($event)"
      >
        <ng-content></ng-content>
        <ng-container
          id="header"
          [ngTemplateOutlet]="widgetHeaderRef"
          [ngTemplateOutletInjector]="globalContextInlineRef.injector"
        ></ng-container>
        <ng-container
          id="body"
          [ngTemplateOutlet]="widgetBodyRef"
          [ngTemplateOutletInjector]="globalContextInlineRef.injector"
        ></ng-container>
      </c8y-global-context-inline>
    }
    @case (CONFIG) {
      <c8y-global-context-widget-config
        [config]="GLOBAL_CONTEXT_CONFIG"
        [widgetControls]="widgetControls()"
        [isLoading]="isLoading()"
        (refresh)="onRefresh()"
        (globalContextChange)="onGlobalContextChange($event)"
      ></c8y-global-context-widget-config>
    }
    @case (PREVIEW) {
      <c8y-preview-controls
        [config]="GLOBAL_CONTEXT_CONFIG"
        [widgetControls]="widgetControls()"
      ></c8y-preview-controls>
    }
  }
}

Index

Properties
Methods
Inputs
Outputs

Constructor

constructor()

Inputs

config
Type : GlobalContextState
Default value : {}
controlLinks
Type : LinkStatesMap
Default value : {}
dashboardChildForLegacy
Type : DashboardChildComponent
displayMode
Type : WidgetDisplayMode
Default value : WIDGET_DISPLAY_MODE.INLINE
isLoading
Default value : false
widgetControlsConfig
Type : WidgetControls | WidgetControlsPresetConfig
Required :  true
Default value : { alias: 'widgetControls' }

Outputs

globalContextChange
Type : EventEmitter

Methods

ngOnInit
ngOnInit()
Returns : void
onGlobalContextChange
onGlobalContextChange(context: GlobalContextState)
Parameters :
Name Type Optional
context GlobalContextState No
Returns : void
onRefresh
onRefresh()
Returns : void
pauseAutoRefresh
pauseAutoRefresh()

Pause auto-refresh and unlink all controls from global context. Useful when user is interacting with the widget (e.g., scrolling through a list) and you want to prevent automatic updates.

This does two things:

  1. Sets isAutoRefreshEnabled to false (stops the auto-refresh timer)
  2. Unlinks all controls (dateTimeContext, aggregation, isAutoRefreshEnabled) from global context as they work as a unified group
Returns : void
resumeAutoRefresh
resumeAutoRefresh()

Resume auto-refresh and re-link all controls to global context. Useful when user has finished interacting with the widget (e.g., scrolled back to top) and you want to re-enable automatic updates.

This does two things:

  1. Sets isAutoRefreshEnabled to true (starts the auto-refresh timer)
  2. Links all controls (dateTimeContext, aggregation, isAutoRefreshEnabled) to global context as they work as a unified group
Returns : void
toggleAllLinks
toggleAllLinks(isLinked: boolean, suppressRefresh?: boolean, suppressEmit?: boolean)

Directly toggle all link controls to linked or unlinked state. All controls are always toggled together as a unified group.

Parameters :
Name Type Optional Description
isLinked boolean No
  • True to link all controls, false to unlink all controls
suppressRefresh boolean Yes
  • True to prevent refresh emission (data already loaded)
suppressEmit boolean Yes
  • True to prevent configuration change emission
Returns : void
updateDateTimeContext
updateDateTimeContext(dateTimeContext: any)

Update dateTimeContext for internal widget interactions (e.g., slider drag). This bypasses the config propagation logic and directly updates the inline component state.

Parameters :
Name Type Optional
dateTimeContext any No
Returns : void

Properties

Readonly GLOBAL_CONTEXT_DISPLAY_MODE
Type : unknown
Default value : GLOBAL_CONTEXT_DISPLAY_MODE
globalContextInlineComponent
Type : GlobalContextInlineComponent
Decorators :
@ViewChild(GlobalContextInlineComponent)
internalConfig
Type : WritableSignal<GlobalContextState>
Default value : signal({})
Readonly WIDGET_DISPLAY_MODE
Type : unknown
Default value : WIDGET_DISPLAY_MODE
widgetBodyRef
Type : TemplateRef<unknown>
Decorators :
@ContentChild('widgetBody')
widgetControls
Type : unknown
Default value : computed(() => resolveWidgetControlsInput(this.widgetControlsConfig()))
widgetHeaderRef
Type : TemplateRef<unknown>
Decorators :
@ContentChild('widgetHeader')

results matching ""

    No results matching ""