Koobiq

KbqNavbarBrand

Selector: kbq-navbar-brand, [kbq-navbar-brand]

Exported as: kbqNavbarBrand

Properties

Name	Description
@Input() collapsedText: string	text that will be displayed in the tooltip. By default, the text is taken from kbq-navbar-title.
@Input() longTitle: boolean	alternative display of the brand name in two lines
arrow: boolean
availablePositions: { [key: string]: ConnectionPositionPair; }
closingActionsSubscription: Subscription
collapsed: boolean
color: string
container: HTMLElement
content: string \| TemplateRef
context: any
customClass: string
destroyRef: DestroyRef
detach: () => void
direction: Directionality
disabled: boolean
elementRef: ElementRef
enterDelay: number
focusMonitor: FocusMonitor
forDisabledComponent: InputSignal>>	Input for controlling the disabled state of a component. The input expects a component containing `disabledSignal` property, which is a writable signal emitting boolean values.
hideWithTimeout: boolean	Changes hiding behavior. By default, tooltip is hidden on mouseleave from trigger. Setting hideWithTimeout to true will delay tooltip hiding and will not hide when the mouse moves from trigger to tooltip.
hostView: ViewContainerRef
hovered: BehaviorSubject	Stream that emits when the popupTrigger is hovered.
ignoreTooltipPointerEvents: InputSignal	Determines whether pointer events should be ignored on tooltips. When set to `true`, tooltip elements will not receive pointer events, allowing interactions to pass through to underlying elements. Defaults to `true`.
instance: any
isLink: boolean
isOpen: boolean
leaveDelay: number
listeners: Map
modifier: TooltipModifier
mouseEvent: MouseEvent
ngZone: NgZone
offset: number
onPositionChange: ($event: ConnectedOverlayPositionChange) => void
originSelector: string
overlay: Overlay
overlayConfig: OverlayConfig
overlayRef: OverlayRef
parentPopup: KbqParentPopup
placement: "top" \| "topLeft" \| "topRight" \| "right" \| "rightTop" \| "rightBottom" \| "left" \| "leftTop" \| "leftBottom" \| "bottom" \| "bottomLeft" \| "bottomRight"
placementChange: EventEmitter
placementPriority: string \| string[]
portal: ComponentPortal
preventClose: boolean	prevents closure by any event
relativeToPointer: boolean	Positions the tooltip relative to the mouse cursor. Only available for top and bottom kbqPlacement. Does not work with kbqPlacementPriority.
scheduler: AsyncScheduler
scrollDispatcher: ScrollDispatcher
scrollStrategy: () => ScrollStrategy
scrollable: CdkScrollable
stickToWindow: "top" \| "right" \| "left" \| "bottom"
strategy: FlexibleConnectedPositionStrategy
tooltipPlacement: "top" \| "topLeft" \| "topRight" \| "right" \| "rightTop" \| "rightBottom" \| "left" \| "leftTop" \| "leftBottom" \| "bottom" \| "bottomLeft" \| "bottomRight"
tooltipPlacementPriority: string \| string[]
tooltipVisible: boolean
trigger: string
triggerName: string
visible: boolean
visibleChange: EventEmitter

Name

Description

@Input()

collapsedText: string

text that will be displayed in the tooltip. By default, the text is taken from kbq-navbar-title.

@Input()

longTitle: boolean

alternative display of the brand name in two lines

arrow: boolean

availablePositions: { [key: string]: ConnectionPositionPair; }

closingActionsSubscription: Subscription

collapsed: boolean

color: string

container: HTMLElement

content: string | TemplateRef

context: any

customClass: string

destroyRef: DestroyRef

detach: () => void

direction: Directionality

disabled: boolean

elementRef: ElementRef

enterDelay: number

focusMonitor: FocusMonitor

forDisabledComponent: InputSignal>>

Input for controlling the disabled state of a component. The input expects a component containing `disabledSignal` property, which is a writable signal emitting boolean values.

hideWithTimeout: boolean

Changes hiding behavior. By default, tooltip is hidden on mouseleave from trigger. Setting hideWithTimeout to true will delay tooltip hiding and will not hide when the mouse moves from trigger to tooltip.

hostView: ViewContainerRef

hovered: BehaviorSubject

Stream that emits when the popupTrigger is hovered.

ignoreTooltipPointerEvents: InputSignal

Determines whether pointer events should be ignored on tooltips. When set to `true`, tooltip elements will not receive pointer events, allowing interactions to pass through to underlying elements. Defaults to `true`.

instance: any

isLink: boolean

isOpen: boolean

leaveDelay: number

listeners: Map

modifier: TooltipModifier

mouseEvent: MouseEvent

ngZone: NgZone

offset: number

onPositionChange: ($event: ConnectedOverlayPositionChange) => void

originSelector: string

overlay: Overlay

overlayConfig: OverlayConfig

overlayRef: OverlayRef

parentPopup: KbqParentPopup

placementChange: EventEmitter

placementPriority: string | string[]

portal: ComponentPortal

preventClose: boolean

prevents closure by any event

relativeToPointer: boolean

Positions the tooltip relative to the mouse cursor. Only available for top and bottom kbqPlacement. Does not work with kbqPlacementPriority.

scheduler: AsyncScheduler

scrollDispatcher: ScrollDispatcher

scrollStrategy: () => ScrollStrategy

scrollable: CdkScrollable

stickToWindow: "top" | "right" | "left" | "bottom"

strategy: FlexibleConnectedPositionStrategy

tooltipPlacementPriority: string | string[]

tooltipVisible: boolean

trigger: string

triggerName: string

visible: boolean

visibleChange: EventEmitter

Methods

applyRelativeToPointer

clearListeners

closingActions

createOverlay

Create the overlay config and position strategy

focus

getAdjustedPositions

Returns a list of positions that are aligned with the element's dimensions and offsets.

getMouseLeaveListener

getOverlayHandleComponentType

getPrioritizedPositions

getPriorityPlacementStrategy

hide

initListeners

keydownHandler

resetOrigin

show

showForElement

method allows to show the tooltip relative to the element Use this approach when it is not possible to define a trigger in the template. For example: const tooltip = new KbqTooltipTrigger(); tooltip.showForElement(element);

showForMouseEvent

method allows to show the tooltip relative to the given mouse event.

touchendHandler

updateClassMap

updateData

updatePlacement

updatePlacementPriority

updatePosition

Updates the position of the current popover.

updateVisible

KbqNavbarToggle

Selector: kbq-navbar-toggle, [kbq-navbar-toggle]

Methods

toggle

toggles the state of the navbar

KbqFocusableComponent

Properties

Name	Description
focusableItems: QueryList
keyManager: FocusKeyManager
optionBlurChanges: Observable
optionFocusChanges: Observable

Name

Description

focusableItems: QueryList

keyManager: FocusKeyManager

optionBlurChanges: Observable

optionFocusChanges: Observable

Methods

blur

dropSubscriptions

focus

resetOptions

KbqNavbarLogo

Selector: kbq-navbar-logo, [kbq-navbar-logo]

Properties

Name	Description
hovered: Subject

Name

Description

hovered: Subject

KbqVerticalNavbar extends KbqFocusableComponent

Selector: kbq-vertical-navbar

Exported as: KbqVerticalNavbar

Properties

Name	Description
@Input() expanded: boolean
@Input() openOver: boolean
animationDone: Subject
bento: KbqNavbarBento
configuration: any
externalConfiguration: unknown
focusableItems: QueryList
items: QueryList
keyManager: FocusKeyManager
optionBlurChanges: Observable
optionFocusChanges: Observable
rectangleElements: Signal

Name

Description

@Input()

expanded: boolean

@Input()

openOver: boolean

animationDone: Subject

bento: KbqNavbarBento

configuration: any

externalConfiguration: unknown

focusableItems: QueryList

items: QueryList

keyManager: FocusKeyManager

optionBlurChanges: Observable

optionFocusChanges: Observable

rectangleElements: Signal

Methods

blur

dropSubscriptions

focus

onKeyDown

resetOptions

toggle

KbqNavbarBento

Selector: kbq-navbar-item[bento], [kbq-navbar-item][bento]

KbqNavbarTitle

Selector: kbq-navbar-title, [kbq-navbar-title]

Properties

Name	Description
hovered: Subject
isBrowser: boolean
isOverflown: boolean
isTextOverflown: boolean
nativeElement: HTMLElement
outerElementWidth: number
text: string

Name

Description

hovered: Subject

isBrowser: boolean

isOverflown: boolean

isTextOverflown: boolean

nativeElement: HTMLElement

outerElementWidth: number

text: string

Methods

checkTextOverflown

getOuterElementWidth

KbqNavbarDivider

Selector: kbq-navbar-divider

KbqNavbarFocusableItem

Selector: kbq-navbar-item, [kbq-navbar-item], kbq-navbar-brand, [kbq-navbar-brand], kbq-navbar-toggle

Properties

Name	Description
@Input() disabled: boolean	Whether the item is disabled.
button: KbqButton
formField: KbqFormField
hasFocus: boolean
nestedElement: KbqButton \| KbqFormField
onBlur: Subject
onFocus: Subject
title: KbqNavbarTitle
tooltip: KbqTooltipTrigger

Name

Description

@Input()

disabled: boolean

Whether the item is disabled.

button: KbqButton

formField: KbqFormField

hasFocus: boolean

nestedElement: KbqButton | KbqFormField

onBlur: Subject

onFocus: Subject

title: KbqNavbarTitle

tooltip: KbqTooltipTrigger

Methods

blur

focus

getLabel

onFocusHandler

setTooltip

KbqNavbarContainer

Selector: kbq-navbar-container

KbqNavbar extends KbqFocusableComponent

Selector: kbq-navbar

Properties

Name	Description
focusableItems: QueryList
keyManager: FocusKeyManager
navbarItems: QueryList
optionBlurChanges: Observable
optionFocusChanges: Observable
rectangleElements: Signal
resizeStream: Subject
updateExpandedStateForItems: () => void

Name

Description

focusableItems: QueryList

keyManager: FocusKeyManager

navbarItems: QueryList

optionBlurChanges: Observable

optionFocusChanges: Observable

rectangleElements: Signal

resizeStream: Subject

updateExpandedStateForItems: () => void

Methods

blur

dropSubscriptions

focus

onKeyDown

resetOptions

KbqNavbarRectangleElement

Selector: kbq-navbar-item, [kbq-navbar-item], kbq-navbar-divider, kbq-navbar-brand, [kbq-navbar-brand]

Properties

Name	Description
button: KbqButtonCssStyler
collapsed: boolean
horizontal: boolean
isBrowser: boolean
nativeElement: HTMLElement
state: Subject
vertical: boolean

Name

Description

button: KbqButtonCssStyler

collapsed: boolean

horizontal: boolean

isBrowser: boolean

nativeElement: HTMLElement

state: Subject

vertical: boolean

Methods

getOuterElementWidth

KbqNavbarItem

Selector: kbq-navbar-item, [kbq-navbar-item]

Exported as: kbqNavbarItem

Properties

Name	Description
@Input() collapsable: boolean
@Input() collapsedText: string
@Input('kbqTrigger') trigger: string
arrow: boolean
availablePositions: { [key: string]: ConnectionPositionPair; }
closingActionsSubscription: Subscription
collapsed: boolean
color: string
container: HTMLElement
content: string \| TemplateRef
context: any
croppedText: string
customClass: string
destroyRef: DestroyRef
detach: () => void
direction: Directionality
disabled: boolean
elementRef: ElementRef
enterDelay: number
focusMonitor: FocusMonitor
forDisabledComponent: InputSignal>>	Input for controlling the disabled state of a component. The input expects a component containing `disabledSignal` property, which is a writable signal emitting boolean values.
hasCroppedText: boolean
hasDropDownTrigger: boolean
hideWithTimeout: boolean	Changes hiding behavior. By default, tooltip is hidden on mouseleave from trigger. Setting hideWithTimeout to true will delay tooltip hiding and will not hide when the mouse moves from trigger to tooltip.
hostView: ViewContainerRef
hovered: BehaviorSubject	Stream that emits when the popupTrigger is hovered.
icon: KbqIcon
ignoreTooltipPointerEvents: InputSignal	Determines whether pointer events should be ignored on tooltips. When set to `true`, tooltip elements will not receive pointer events, allowing interactions to pass through to underlying elements. Defaults to `true`.
instance: any
isCollapsed: boolean
isOpen: boolean
leaveDelay: number
listeners: Map
modifier: TooltipModifier
mouseEvent: MouseEvent
navbarFocusableItem: KbqNavbarFocusableItem
ngZone: NgZone
offset: number
onPositionChange: ($event: ConnectedOverlayPositionChange) => void
originSelector: string
overlay: Overlay
overlayConfig: OverlayConfig
overlayRef: OverlayRef
parentPopup: KbqParentPopup
placement: "top" \| "topLeft" \| "topRight" \| "right" \| "rightTop" \| "rightBottom" \| "left" \| "leftTop" \| "leftBottom" \| "bottom" \| "bottomLeft" \| "bottomRight"
placementChange: EventEmitter
placementPriority: string \| string[]
portal: ComponentPortal
preventClose: boolean	prevents closure by any event
rectangleElement: KbqNavbarRectangleElement
relativeToPointer: boolean	Positions the tooltip relative to the mouse cursor. Only available for top and bottom kbqPlacement. Does not work with kbqPlacementPriority.
scheduler: AsyncScheduler
scrollDispatcher: ScrollDispatcher
scrollStrategy: () => ScrollStrategy
scrollable: CdkScrollable
showHorizontalDropDownAngle: boolean
showVerticalDropDownAngle: boolean
stickToWindow: "top" \| "right" \| "left" \| "bottom"
strategy: FlexibleConnectedPositionStrategy
title: KbqNavbarTitle
titleText: string
tooltipPlacement: "top" \| "topLeft" \| "topRight" \| "right" \| "rightTop" \| "rightBottom" \| "left" \| "leftTop" \| "leftBottom" \| "bottom" \| "bottomLeft" \| "bottomRight"
tooltipPlacementPriority: string \| string[]
tooltipVisible: boolean
triggerName: string
visible: boolean
visibleChange: EventEmitter

Name

Description

@Input()

collapsable: boolean

@Input()

collapsedText: string

@Input('kbqTrigger')

trigger: string

arrow: boolean

availablePositions: { [key: string]: ConnectionPositionPair; }

closingActionsSubscription: Subscription

collapsed: boolean

color: string

container: HTMLElement

content: string | TemplateRef

context: any

croppedText: string

customClass: string

destroyRef: DestroyRef

detach: () => void

direction: Directionality

disabled: boolean

elementRef: ElementRef

enterDelay: number

focusMonitor: FocusMonitor

forDisabledComponent: InputSignal>>

Input for controlling the disabled state of a component. The input expects a component containing `disabledSignal` property, which is a writable signal emitting boolean values.

hasCroppedText: boolean

hasDropDownTrigger: boolean

hideWithTimeout: boolean

Changes hiding behavior. By default, tooltip is hidden on mouseleave from trigger. Setting hideWithTimeout to true will delay tooltip hiding and will not hide when the mouse moves from trigger to tooltip.

hostView: ViewContainerRef

hovered: BehaviorSubject

Stream that emits when the popupTrigger is hovered.

icon: KbqIcon

ignoreTooltipPointerEvents: InputSignal

Determines whether pointer events should be ignored on tooltips. When set to `true`, tooltip elements will not receive pointer events, allowing interactions to pass through to underlying elements. Defaults to `true`.

instance: any

isCollapsed: boolean

isOpen: boolean

leaveDelay: number

listeners: Map

modifier: TooltipModifier

mouseEvent: MouseEvent

navbarFocusableItem: KbqNavbarFocusableItem

ngZone: NgZone

offset: number

onPositionChange: ($event: ConnectedOverlayPositionChange) => void

originSelector: string

overlay: Overlay

overlayConfig: OverlayConfig

overlayRef: OverlayRef

parentPopup: KbqParentPopup

placementChange: EventEmitter

placementPriority: string | string[]

portal: ComponentPortal

preventClose: boolean

prevents closure by any event

rectangleElement: KbqNavbarRectangleElement

relativeToPointer: boolean

Positions the tooltip relative to the mouse cursor. Only available for top and bottom kbqPlacement. Does not work with kbqPlacementPriority.

scheduler: AsyncScheduler

scrollDispatcher: ScrollDispatcher

scrollStrategy: () => ScrollStrategy

scrollable: CdkScrollable

showHorizontalDropDownAngle: boolean

showVerticalDropDownAngle: boolean

stickToWindow: "top" | "right" | "left" | "bottom"

strategy: FlexibleConnectedPositionStrategy

title: KbqNavbarTitle

titleText: string

tooltipPlacementPriority: string | string[]

tooltipVisible: boolean

triggerName: string

visible: boolean

visibleChange: EventEmitter

Methods

applyRelativeToPointer

clearListeners

closingActions

createOverlay

Create the overlay config and position strategy

focus

getAdjustedPositions

Returns a list of positions that are aligned with the element's dimensions and offsets.

getMouseLeaveListener

getOverlayHandleComponentType

getPrioritizedPositions

getPriorityPlacementStrategy

getTitleWidth

hide

initListeners

keydownHandler

onKeyDown

resetOrigin

show

showForElement

method allows to show the tooltip relative to the element Use this approach when it is not possible to define a trigger in the template. For example: const tooltip = new KbqTooltipTrigger(); tooltip.showForElement(element);

showForMouseEvent

method allows to show the tooltip relative to the given mouse event.

touchendHandler

updateClassMap

updateData

updatePlacement

updatePlacementPriority

updatePosition

Updates the position of the current popover.

updateTooltip

updateVisible

KbqNavbarContainerPositionType

type KbqNavbarContainerPositionType = 'left' | 'right';