Main
 Installation Versioning Theming Typography Design tokens Schematics Migration guides
Components
 Accordion Actions panel AG grid Alert App Switcher Autocomplete Badge Breadcrumbs Button Button Group Button toggle Checkbox Clamped list Clamped text Code block Content panel Core Datepicker Description list Divider Dropdown Dynamic translation Empty state File upload Filter Bar Flag New Form field Highlight Icon Icon Button Icon Item Inline edit Input Layout flex Link List Markdown Modal Navbar Notification Center Overflow items Overlay Popover Progress bar Progress spinner Radio Resizer Scrollbar Search expandable Select Sidebar Sidepanel Skeleton Split button Splitter Table Tabs Tag Tag autocomplete Tag input Tag list Textarea Time range Timepicker Timezone Title Toast Toggle Tooltip Topbar Tree Tree select Username
Other
 Date formatter Filesize formatter Forms Number formatter Validation Smart search New
Icons
Interface and examples language
English
Version
20.3.1
Toast
Source code
import { KbqToastModule } from '@koobiq/components/toast';
Services
KbqToastService

Generic `T` is a type hint only; the runtime component comes from `KBQ_TOAST_FACTORY`.

Properties
Name Description
animation: BehaviorSubject
focused: BehaviorSubject
hovered: BehaviorSubject
read: BehaviorSubject
templates: EmbeddedViewRef[]
timer: Observable
toasts: ComponentRef[]
Methods
hide
hideTemplate
show
showTemplate
Directives
KbqToastContainerComponent

Selector: kbq-toast-container

Properties
Name Description
dir: Directionality
elementRef: ElementRef
ngZone: NgZone
scrollDispatcher: ScrollDispatcher
service: KbqToastService
viewContainer: Signal
Deprecated
dispatchScrollEvent: () => void 		Fakes a scroll on the container so that overlays anchored inside a toast are repositioned by their `RepositionScrollStrategy` when the stack shifts.
Methods
createTemplate
createToast
elementScrolled
`ScrollDispatcher` subscribes to this method when the container registers itself, so merging the reflow signal in re-broadcasts it to every overlay that repositions on scroll — which is what `kbq-select` and the dropdown trigger do by default.
getElementRef
Gets the ElementRef for the viewport.
getInjector
measureScrollOffset
Measures the scroll offset relative to the specified edge of the viewport. This method can be used instead of directly checking scrollLeft or scrollTop, since browsers are not consistent about what scrollLeft means in RTL. The values returned by this method are normalized such that left and right always refer to the left and right side of the scrolling container irrespective of the layout direction. start and end refer to left and right in an LTR context and vice-versa in an RTL context.
remove
scrollTo
Scrolls to the specified offsets. This is a normalized version of the browser's native scrollTo method, since browsers are not consistent about what scrollLeft means in RTL. For this method left and right always refer to the left and right side of the scrolling container irrespective of the layout direction. start and end refer to left and right in an LTR context and vice-versa in an RTL context.
KbqToastCloseButton

Selector: [kbq-toast-close-button]

KbqToastComponent

Selector: kbq-toast

Properties
Name Description
$implicit: any
animationState: string
data: KbqToastData
delay: any
elementRef: ElementRef
focused: BehaviorSubject
hovered: BehaviorSubject
id: number
isFocusedOrHovered: boolean
readStateDirective: KbqReadStateDirective
service: KbqToastService
themePalette: typeof ThemePalette
toastStyle: { [x: string]: boolean; }
ttl: any
Methods
close
isTemplateRef
onAnimation
Classes
KbqToastData
Properties
Name Description
actions: TemplateRef
caption: string | TemplateRef
closeButton: boolean | TemplateRef
content: string | TemplateRef
icon: boolean | TemplateRef
iconClass: string
id: string
style: string
title: string | TemplateRef
Interfaces
KbqToastConfig
Properties
Name Description
delay: number
duration: number
indent: { vertical: number; horizontal: number; } Custom indentation for positioning the toast stack overlay when using `GlobalPositionStrategy`
onTop: boolean
position: KbqToastPosition
Constants
KBQ_TOAST_FACTORY 
const KBQ_TOAST_FACTORY: InjectionToken<typeof KbqToastComponent>;
defaultToastConfig 
const defaultToastConfig: KbqToastConfig;
KBQ_TOAST_CONFIG 
const KBQ_TOAST_CONFIG: InjectionToken<KbqToastConfig>;
kbqToastConfigurationProvider

Utility provider for `KBQ_TOAST_CONFIG`.

const kbqToastConfigurationProvider: (configuration: Partial<KbqToastConfig>) => Provider;
Suggestions for improvement
If you found a mistake or want to improve the article, create an issue on GitHub.