Skip to content

SiTabDeselectionEvent Type documentation

Properties
To be called to prevent switching the tab
cancel: () => void
The index of target tab
tabIndex: number
The target tab
target: SiTabComponent

Types Documentation

(string & Translatable)
Represents a translatable string. This can either be a translation key, e.g. ACTIONS.EDIT that will be automatically translated when displayed on the UI or a pre-translated string, e.g. Edit . Equivalent to a normal string in usage and functionality.
Translatable
import
implements OnChanges
Constructor
() => {}
Properties
active: WritableSignal<boolean> = ...
Background color of the badge. If no color is provided a red dot badge will be rendered.
badgeColor?: string
Additional badge content. A value of - true will render a red dot - any string without a badgeColor will render a red dot with text - any string with a badgeColor will render a normal badge
badgeContent?: (boolean | TranslatableString)
Close the current tab.
closable?: boolean = false
Event emitter to notify when a tab is closed.
closeTriggered: EventEmitter<SiTabComponent> = ...
Disables the tab.
disabled: boolean = false
Title of the tab item.
heading?: TranslatableString
Icon of the tab item.
icon?: string
Alternative name or translation key for icon. Used for A11y.
iconAltText?: TranslatableString
id: string = ...
parent?: SiTabsetComponent
tabId: string = ...
idCounter: number = 0
Accessors
get isHidden: (null | boolean)
Methods
A callback method that is invoked immediately after the default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.
ngOnChanges: () => void from OnChanges.ngOnChanges
(parent: SiTabsetComponent) => void
Parameters
parent: SiTabsetComponent
implements AfterViewInit, OnDestroy
Constructor
() => {}
Properties
changeDetectorRef: ChangeDetectorRef = ...
Event emitter to notify when a tab became inactive.
deselect: EventEmitter<SiTabDeselectionEvent> = ...
endArrowDisabled: boolean = false
focusedTabIndex?: number
icons: Record<("elementCancel" | "elementLeft3" | "elementRight3"), string> = ...
initialized: boolean = false
initTabIndex: number = 0
innerTabContainer: Signal<ElementRef<HTMLDivElement>> = ...
Component variable to indicate if scrolling is necessary or the container is big enough to display all tabs.
scrollable: boolean = false
If selectDefaultTab is passed as 'false', this implies no default tab selection i.e. on initial load of tabset component no tab gets selected.
selectDefaultTab: boolean = true
Event emitter to notify about selected tab index changes. You can either use bi-directional binding with [(selectedTabIndex)] or separate both with [selectedTabIndex]=... and (selectedTabIndexChange)=...
selectedTabIndexChange: EventEmitter<number> = ...
subscription?: Subscription
Define an optional max-width in px for the tab buttons. The minimum value is 100 .
tabButtonMaxWidth?: number
tabContainer: Signal<ElementRef<any>> = ...
Contains the current tab components.
tabPanels: QueryList<SiTabComponent>
tabs: Signal<readonly ElementRef<HTMLButtonElement>[]> = ...
xPos: number = 0
Accessors
Returns the currently selected tab index.
get selectedTabIndex: number
Sets a selected tab index. This will activate the tab of the provided index, activates the tab and fires a notification about the change. If index is passed as -1 i.e. selectedTabIndex = -1 , this implies to clear all tab selection.
set selectedTabIndex: (tabIndex: number)
Methods
blur: () => void
(event: MouseEvent, tab: SiTabComponent) => void
Parameters
event: MouseEvent
tab: SiTabComponent
(index: number) => void
Parameters
index: number
focusNext: () => void
focusPrevious: () => void
(index: number) => boolean
Parameters
index: number
(event: WheelEvent) => void
Parameters
event: WheelEvent
A callback method that is invoked immediately after Angular has completed initialization of a component's view. It is invoked only once when the view is instantiated.
ngAfterViewInit: () => void from AfterViewInit.ngAfterViewInit
A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.
ngOnDestroy: () => void from OnDestroy.ngOnDestroy
notifyChildrenChanged: () => void
resize: () => void
(inc: number) => void
Parameters
inc: number
Scrolls the tab headers to the end (right in LTR).
scrollEnd: () => void
Scrolls the tab headers to the start (left in LTR).
scrollStart: () => void
(selectedTab: SiTabComponent) => void
Finds the index of the provided tab and sets the index as new selected tab index
Parameters
The tab to be selected. This must already be part of the container.
selectedTab: SiTabComponent

Except where otherwise noted, content on this site is licensed under MIT License.