@cute-widgets/base 20.0.1

package/core/interfaces/index.d.ts

@@ -0,0 +1,114 @@
+import { RichThemeColor } from '@cute-widgets/base/core/theming';
+
+interface Focusable {
+    focus(): void;
+}
+
+interface MenuAction {
+    type: "RouterLink" | "ExternalURL" | "AppEvent" | "DwScript";
+    text: string;
+    target?: "Main" | "Popup" | "Response";
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/**
+ * A structure that populates the properties for individual items in a TreeView control.
+ */
+interface TreeNode<D = unknown> {
+    /** Unique identifier */
+    id?: string;
+    /** Identifies the string label associated with the item. */
+    label: string;
+    /** Specifies whether the item has children. */
+    hasChildren?: boolean;
+    /** Children items. */
+    children?: TreeNode<D>[];
+    /** Item short description */
+    microHelp?: string;
+    /** Indicates the level of the item in the TreeView control. */
+    level?: number;
+    /** Any user-defined data. */
+    data?: D;
+    /** Router link. */
+    routerLink?: string | string[];
+    /** Identifies the picture displayed to the left of the item label. */
+    icon?: string;
+    /** Icon color. */
+    iconColor?: string;
+    /** Icon CSS class(es). */
+    iconClass?: string | string[] | Record<string, boolean>;
+    /** Identifies the state picture associated with the item. */
+    stateIcon?: string;
+    /** The badge text associated with the item. */
+    badge?: string;
+    /** Badge theme color. */
+    badgeColor?: RichThemeColor;
+    /** Is node enabled? Default is _true_. */
+    enabled?: (() => boolean) | boolean;
+    /** Is node visible? Default is _true_. */
+    visible?: (() => boolean) | boolean;
+    status?: {
+        /** Specifies whether the node is expanded. */
+        expanded?: boolean;
+        /** Specifies whether the node has been populated with children. */
+        populated?: boolean;
+        /** Specifies whether the item has focus. */
+        hasFocus?: boolean;
+        /** Specifies whether the item is selected. */
+        selection?: 'checked' | 'indeterminate' | 'unchecked';
+    };
+}
+
+interface ToolbarItem {
+    /** Icon ligature */
+    icon?: string;
+    /** Icon color */
+    iconColor?: string;
+    /** Specifies the order of the item in the toolbar */
+    order?: number;
+    /** Specifies the amount of empty space before the item in the toolbar */
+    spaces?: number;
+    /** Specifies the text that displays in the toolbar item when the display text option is on for toolbars */
+    text?: string;
+    /** Specifies whether the toolbar item displays. Default is _false_ */
+    visible?: boolean;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/**
+ * Menu Item interface is used for items in a drop-down or cascading menu
+ */
+interface MenuItem<D = unknown> extends TreeNode<D> {
+    /** An array of the submenu items. */
+    children?: MenuItem<D>[];
+    /** Whether an item is the default item. */
+    default?: (() => boolean) | boolean;
+    /** Is item checked? Default is _false_. */
+    checked?: (() => boolean) | boolean;
+    /** Item is clicked (selected or unselected). */
+    clicked?: () => void;
+    /** Toolbar's item definition. */
+    toolBarItem?: ToolbarItem;
+}
+
+interface MenuOwner extends Focusable {
+    menuItemClicked: (mi: MenuItem) => void;
+}
+
+export type { Focusable, MenuAction, MenuItem, MenuOwner, ToolbarItem, TreeNode };

package/core/layout/index.d.ts

@@ -0,0 +1,53 @@
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+/**
+ * Bootstrap media-queries, or `breakpoints`.
+ * PascalCase is being used as Breakpoints is used like an enum.
+ */
+declare const bsBreakpoints: {
+    SmallAndDown: string;
+    MediumAndDown: string;
+    LargeAndDown: string;
+    XLargeAndDown: string;
+    XXLargeAndDown: string;
+    XSmall: string;
+    Small: string;
+    Medium: string;
+    Large: string;
+    XLarge: string;
+    XXLarge: string;
+    readonly grid: {
+        xs: number;
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+        xxl: number;
+    };
+    readonly xs: string;
+    readonly sm: string;
+    readonly md: string;
+    readonly lg: string;
+    readonly xl: string;
+    readonly xxl: string;
+    /**
+     * Gets the object's property name of the media-query by its value
+     * @param query The media-query text
+     * @returns The property name of the media-query or _undefined_ if it was not found
+     */
+    getQueryName(query: string): string | undefined;
+    /**
+     * Gets the breakpoint label by Bootstrap's breakpoint abbreviation
+     * @param code Bootstrap's breakpoint abbreviation
+     * @returns More descriptive text of the abbreviation
+     */
+    getLabel(code: string): string;
+};
+
+export { bsBreakpoints };

package/core/line/index.d.ts

@@ -0,0 +1,37 @@
+import * as i0 from '@angular/core';
+import { QueryList, ElementRef } from '@angular/core';
+import * as i1 from '@angular/common';
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * This code is a modification of the `@angular/material` original
+ * code licensed under MIT-style License (https://angular.dev/license).
+ */
+
+/**
+ * Shared directive to count lines inside a text area, such as a list item.
+ * Line elements can be extracted with a @ContentChildren(CuteLine) query, then
+ * counted by checking the query list's length.
+ */
+declare class CuteLine {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteLine, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteLine, "[cute-line], [cuteLine]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Helper that takes a query list of lines and sets the correct class on the host.
+ */
+declare function setLines(lines: QueryList<unknown>, element: ElementRef<HTMLElement>, prefix?: string): void;
+
+declare class CuteLineModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteLineModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CuteLineModule, never, [typeof i1.CommonModule, typeof CuteLine], [typeof CuteLine]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CuteLineModule>;
+}
+
+export { CuteLine, CuteLineModule, setLines };

package/core/nav/index.d.ts

@@ -0,0 +1,321 @@
+import * as i0 from '@angular/core';
+import { NgZone, ViewContainerRef, InjectionToken, DestroyRef, QueryList, EventEmitter, TemplateRef, OnDestroy } from '@angular/core';
+import { ListKeyManager, FocusOrigin } from '@angular/cdk/a11y';
+import { Directionality } from '@angular/cdk/bidi';
+import { CuteFocusableControl, CuteLayoutControl } from '@cute-widgets/base/abstract';
+import { toThemeColor, RichThemeColor, LayoutOrientation, ContentAlignment } from '@cute-widgets/base/core';
+import * as _cute_widgets_base_core_nav from '@cute-widgets/base/core/nav';
+import { CdkPortal, CdkPortalOutlet } from '@angular/cdk/portal';
+import * as i1 from '@angular/cdk/overlay';
+import * as i1$1 from '@angular/common';
+
+/**
+ * This class can be used to create a navigation menu, where it is applied to `<a>` elements.
+ */
+declare class CuteNavLink extends CuteFocusableControl {
+    protected _document: Document;
+    protected _ngZone: NgZone;
+    protected readonly nav: _cute_widgets_base_core_nav.CuteNav | null;
+    protected toThemeColor: typeof toThemeColor;
+    /** Whether the link is active. */
+    active: boolean;
+    /** Explicit element identifier(s) whose content or presence are controlled by the link */
+    ariaControls: string | undefined;
+    constructor();
+    protected generateId(): string;
+    /** Gets fallback element identifier(s) whose content or presence are controlled by the link. */
+    protected getAriaControls(): string;
+    /**
+     * MouseDown event handler in `capture` state of the event propagation.
+     * @param event MouseEvent
+     * @protected
+     */
+    protected onMouseDown(event: MouseEvent): void;
+    protected onClick(event: MouseEvent): void;
+    protected onTouchStart(event: TouchEvent): void;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavLink, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteNavLink, "a[cute-nav-link], a[cuteNavLink],             button[cute-nav-link], button[cuteNavLink]  ", ["cuteNavLink"], { "active": { "alias": "active"; "required": false; }; "ariaControls": { "alias": "aria-controls"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_active: unknown;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/**
+* Token used to provide a `CuteNavItem` to `CuteNavLink`.
+* Used to avoid circular imports between `CuteNavItem` and `CuteNavLink`.
+*/
+declare const CUTE_NAV_ITEM: InjectionToken<CuteNavItem>;
+/**
+ * The purpose of this class is to ensure that the list items in the navigation have the correct spacing in **Bootstrap** framework.
+ */
+declare class CuteNavItem extends CuteLayoutControl {
+    protected _viewContainerRef: ViewContainerRef;
+    readonly nav: CuteNav;
+    /** Nested `nav-link` element */
+    readonly navLink: CuteNavLink | undefined;
+    /** Nested <ng-template cuteNavContent> projected content */
+    private _navContent;
+    /** Unscoped projected content */
+    private _staticContentTemplate;
+    /**
+     * By default, tabs remove their content from the DOM while it's off-screen. Setting this to _true_ will keep it in
+     * the DOM which will prevent elements like `iframes` and `videos` from reloading next time it comes back into the view.
+     */
+    get preserveTabContent(): boolean;
+    set preserveTabContent(value: boolean | undefined);
+    private _preserveTabContent;
+    /** Portal that will be the hosted content of the nav */
+    get content(): CdkPortal | null;
+    private _contentPortal;
+    /**
+     * Whether the tab/nav is currently active.
+     */
+    get isActive(): boolean;
+    /** Override the `color` setting for Tab control  */
+    get color(): RichThemeColor | undefined;
+    set color(value: RichThemeColor | undefined);
+    constructor();
+    protected generateId(): string;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavItem, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CuteNavItem, "cute-nav-item, [cute-nav-item], [cuteNavItem]", ["cuteNavItem"], { "preserveTabContent": { "alias": "preserveTabContent"; "required": false; }; }, {}, ["navLink", "_navContent"], ["[cute-nav-link], [cuteNavLink]", "[cute-nav-content], [cuteNavContent]", "*"], true, never>;
+    static ngAcceptInputType_preserveTabContent: unknown;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/** Navigation's presentation style */
+type CuteNavStyle = "base" | "tabs" | "pills" | "underline";
+/** Stretching level */
+type CuteNavStretch = "none" | "fill" | "justified";
+/**
+ * Token used to provide a `CuteNav` to `CuteNavItem` or `CuteNavLink`.
+ * Used to avoid circular imports between `CuteNav` and `CuteNavItem`.
+ */
+declare const CUTE_NAV: InjectionToken<CuteNav>;
+/** Event emitted when the `nav-link` selection has changed. */
+declare class CuteNavChangeEvent extends Event {
+    /** Index of the currently-selected link item. */
+    readonly index: number;
+    /** Reference to the currently-selected link item. */
+    readonly link: CuteNavLink;
+    /** Index of the previously-selected link item. */
+    readonly fromIndex: number | null;
+    /** Reference to the currently-selected link item. */
+    readonly fromLink: CuteNavLink | null;
+    /** How the link was focused. */
+    readonly origin: FocusOrigin;
+    constructor(
+    /** Index of the currently-selected link item. */
+    index: number, 
+    /** Reference to the currently-selected link item. */
+    link: CuteNavLink, 
+    /** Index of the previously-selected link item. */
+    fromIndex: number | null, 
+    /** Reference to the currently-selected link item. */
+    fromLink: CuteNavLink | null, 
+    /** How the link was focused. */
+    origin: FocusOrigin);
+}
+/** Cancelable event emitted when the current `nav-link` selection is about to change. */
+declare class CuteNavChangingEvent extends Event {
+    /** Index of the currently-selected link item. */
+    readonly index: number;
+    /** Reference to the currently-selected link item. */
+    readonly link: CuteNavLink;
+    /** Index of the previously-selected link item. */
+    readonly fromIndex: number | null;
+    /** Reference to the currently-selected link item. */
+    readonly fromLink: CuteNavLink | null;
+    /** How the link was focused. */
+    readonly origin: FocusOrigin;
+    constructor(
+    /** Index of the currently-selected link item. */
+    index: number, 
+    /** Reference to the currently-selected link item. */
+    link: CuteNavLink, 
+    /** Index of the previously-selected link item. */
+    fromIndex: number | null, 
+    /** Reference to the currently-selected link item. */
+    fromLink: CuteNavLink | null, 
+    /** How the link was focused. */
+    origin: FocusOrigin);
+}
+/**
+ * The navigation component that is built with `flexbox` and provide a strong foundation for building other types of navigation components.
+ * It includes some style overrides (for working with lists), some _link_ padding for larger hit areas, and basic _disabled_ styling.
+ * @example
+ * ```html
+ * <nav cute-nav alignment="center">
+ *   <a cute-nav-link active href="#">Active</a>
+ *   <a cute-nav-link href="#">Link</a>
+ *   <a cute-nav-link href="#">Link</a>
+ *   <a cute-nav-link disabled>Disabled</a>
+ * </nav>
+ * ```
+ */
+declare class CuteNav extends CuteLayoutControl {
+    protected _destroyRef: DestroyRef;
+    protected _dir: Directionality;
+    protected _keyManager: ListKeyManager<CuteNavLink> | undefined;
+    private _oldFocusLink;
+    /** To synchronize selectedIndex and keyManager.activeIndex */
+    private _selectedIndexToChange;
+    readonly navItems: QueryList<CuteNavItem> | undefined;
+    protected navLinks: QueryList<CuteNavLink> | undefined;
+    /** The type of the navigation component */
+    navStyle: CuteNavStyle;
+    /** Orientation of the navigation items */
+    get orientation(): LayoutOrientation;
+    set orientation(value: LayoutOrientation);
+    private _orientation;
+    /** The alignment of navigation items on the main flexbox' axis */
+    alignment: ContentAlignment;
+    /**
+     * Determines how the `cute-nav`'s content is stretched, such as taking up the entire available width (**none**), proportionally (**fill**) or equally (**justified**).
+     * The width is determined by the longest `cute-nav-link`'s label. By default, stretching of items is not used (**none**).
+     */
+    stretchItems: CuteNavStretch;
+    /**
+     * By default, tabs remove their content from the DOM while it's off-screen. Setting this to _true_ will keep it in
+     * the DOM which will prevent elements like `iframes` and `videos` from reloading next time it comes back into the view.
+     */
+    preserveTabContent: boolean;
+    /** @deprecated */
+    animation: boolean;
+    /** Should the first not disabled link item be automatically selected if none were activated during initialization. */
+    autoSelect: boolean;
+    /** The index of the active link item. */
+    get selectedIndex(): number | null;
+    set selectedIndex(value: number);
+    private _selectedIndex;
+    /** Output to enable support for two-way binding on `[(selectedIndex)]` */
+    selectedIndexChange: EventEmitter<number>;
+    /** Event emitted when the `nav` selection has changed. */
+    selectedLinkChange: EventEmitter<CuteNavChangeEvent>;
+    /** Event emitted when the `nav` selection gets changing. */
+    selectedLinkChanging: EventEmitter<CuteNavChangeEvent>;
+    /** Event emitted when focus has changed within a `nav`-element. */
+    focusChange: EventEmitter<CuteNavChangeEvent>;
+    get classBinding(): string;
+    constructor();
+    protected generateId(): string;
+    /** Whether the navigation component has a `tab` presentation style. */
+    isTab(): boolean;
+    /**
+     * Gets an index of the navigation link in the links array.
+     * @param link Navigation link reference
+     * @returns An index of the navigation link or **-1** if it was not found
+     */
+    getNavLinkIndex(link: CuteNavLink): number;
+    /**
+     * Request to activate cute-nav-link element
+     * @param linkToActivate `cute-nav-link` or its index in the links array to activate. Set _null_ for use the currently selected or first `cute-nav-link` in the list.
+     * @param origin (optional) Tells how the element was focused (via the mouse, keyboard, touch, or programmatically). The latter is the default value.
+     * @returns _true_ when succeeded, otherwise _false_.
+     */
+    activateNavLink(linkToActivate: CuteNavLink | number | null, origin?: FocusOrigin): boolean;
+    /**
+     * Link focus changed handler
+     * @param link Source link
+     * @param origin Focus origin
+     */
+    _focusChanged(link: CuteNavLink | number, origin: FocusOrigin): void;
+    /** Whether the specified link index is a valid nav index. */
+    protected isValidLinkIndex(index: number): boolean;
+    protected onKeydown(event: KeyboardEvent): void;
+    ngOnInit(): void;
+    ngAfterContentInit(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNav, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteNav, "[cute-nav], [cuteNav]", ["cuteNav"], { "navStyle": { "alias": "cuteNav"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "alignment": { "alias": "alignment"; "required": false; }; "stretchItems": { "alias": "stretchItems"; "required": false; }; "preserveTabContent": { "alias": "preserveTabContent"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; "autoSelect": { "alias": "autoSelect"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; }, { "selectedIndexChange": "selectedIndexChange"; "selectedLinkChange": "selectedLinkChange"; "selectedLinkChanging": "selectedLinkChanging"; "focusChange": "focusChange"; }, ["navItems", "navLinks"], never, true, never>;
+    static ngAcceptInputType_preserveTabContent: unknown;
+    static ngAcceptInputType_animation: unknown;
+    static ngAcceptInputType_autoSelect: unknown;
+    static ngAcceptInputType_selectedIndex: unknown;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/**
+ * Lazy loading content of the `cute-nav-item` element.
+ */
+declare class CuteNavContent {
+    readonly template: TemplateRef<unknown>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavContent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteNavContent, "ng-template[cuteNavContent], ng-template[cute-nav-content]", ["cuteNavContent"], {}, {}, never, never, true, never>;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+declare class CuteNavPaneOutlet extends CdkPortalOutlet implements OnDestroy {
+    private _pane;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavPaneOutlet, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteNavPaneOutlet, "[cuteNavPaneOutlet]", ["cuteNavPaneOutlet"], { "portal": { "alias": "cuteNavPaneOutlet"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.CdkScrollable; inputs: {}; outputs: {}; }]>;
+}
+declare class CuteNavPane extends CuteLayoutControl {
+    private _subs;
+    protected _active: boolean;
+    protected _show: boolean;
+    /** Pane index */
+    index: number;
+    /** Navigation item reference */
+    item: CuteNavItem | undefined;
+    hide: EventEmitter<void>;
+    show: EventEmitter<void>;
+    constructor();
+    protected generateId(): string;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavPane, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteNavPane, "[cute-nav-pane], [cuteNavPane]", ["cuteNavPane"], { "index": { "alias": "index"; "required": false; }; "item": { "alias": "item"; "required": false; }; }, { "hide": "hide"; "show": "show"; }, never, never, true, never>;
+    static ngAcceptInputType_index: unknown;
+}
+
+declare class CuteNavOutlet {
+    get nav(): CuteNav | undefined;
+    set nav(value: CuteNav | undefined);
+    private _nav;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavOutlet, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CuteNavOutlet, "cute-nav-outlet", ["cuteNavOutlet"], { "nav": { "alias": "for"; "required": true; }; }, {}, never, never, true, never>;
+}
+
+declare class CuteNavModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteNavModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CuteNavModule, never, [typeof i1$1.CommonModule, typeof CuteNav, typeof CuteNavItem, typeof CuteNavLink, typeof CuteNavOutlet, typeof CuteNavContent, typeof CuteNavPane], [typeof CuteNav, typeof CuteNavItem, typeof CuteNavLink, typeof CuteNavOutlet, typeof CuteNavContent, typeof CuteNavPane]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CuteNavModule>;
+}
+
+export { CUTE_NAV, CUTE_NAV_ITEM, CuteNav, CuteNavChangeEvent, CuteNavChangingEvent, CuteNavContent, CuteNavItem, CuteNavLink, CuteNavModule, CuteNavOutlet, CuteNavPane, CuteNavPaneOutlet };
+export type { CuteNavStretch, CuteNavStyle };

package/core/observers/index.d.ts

@@ -0,0 +1,124 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, OnDestroy, ElementRef, AfterContentInit, EventEmitter } from '@angular/core';
+import { Observable } from 'rxjs';
+import * as i1 from '@angular/cdk/observers';
+import * as i1$1 from '@angular/common';
+
+declare const CUTE_VISIBILITY_OBSERVER_OPTIONS: InjectionToken<IntersectionObserverInit>;
+/**
+ * Factory service that creates a new IntersectionObserver and allows us to stub it out in unit tests.
+ */
+declare class IntersectionObserverFactory {
+    private _injectedOptions;
+    private readonly _defaultOptions;
+    constructor(...args: unknown[]);
+    /** `IntersectionObserver` factory method. Returns _null_ if the API is not supported. */
+    createInstance(callback: IntersectionObserverCallback, options?: IntersectionObserverInit): IntersectionObserver | null;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IntersectionObserverFactory, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<IntersectionObserverFactory>;
+}
+/**
+ * An injectable service that allows watching elements for visibility changes.
+ */
+declare class CuteVisibilityObserver implements OnDestroy {
+    private _intersectionObserverFactory;
+    /** Keeps track of the existing IntersectionObservers, so they can be reused. */
+    private _observedElements;
+    constructor();
+    ngOnDestroy(): void;
+    /**
+     * Observe visibility changes on an element.
+     * @param element The element to observe for visibility changes.
+     * @param options Options to customize the observer
+     * @returns Observable object
+     */
+    observe(element: Element, options?: IntersectionObserverInit): Observable<IntersectionObserverEntry[]>;
+    /**
+     * Observe visibility changes on an element.
+     * @param element The element to observe for visibility changes.
+     * @param options Options to customize the observer
+     * @returns Observable object
+     */
+    observe(element: ElementRef<Element>, options?: IntersectionObserverInit): Observable<IntersectionObserverEntry[]>;
+    /**
+     * Observes the given element by using the existing IntersectionObserver if available, or creating a
+     * new one if not.
+     */
+    private _observeElement;
+    /**
+     * Un-observes the given element and cleans up the underlying IntersectionObserver if nobody else is
+     * observing this element.
+     */
+    private _unobserveElement;
+    /** Clean up the underlying IntersectionObserver for the specified element. */
+    private _cleanupObserver;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteVisibilityObserver, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CuteVisibilityObserver>;
+}
+/**
+ * Directive that triggers intersection event whenever the visibility of its associated element has changed
+ * relative to the specified root element. The root element must be the ancestor of the directive's element.
+ * Keep in mind that each directive's element will have its own instance of the `IntersectionObserver` class.
+ */
+declare class CuteObserveVisibility implements AfterContentInit, OnDestroy {
+    private _visibilityObserver;
+    private _elementRef;
+    private _currentSubscription;
+    /** Event emitted for each intersection change between directive's and root elements. */
+    readonly intersectionChange: EventEmitter<IntersectionObserverEntry[]>;
+    /**
+     * Whether observing visibility is disabled. This option can be used
+     * to disconnect the underlying IntersectionObserver until it is needed.
+     */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    private _disabled;
+    /**
+     * Debounce interval in milliseconds for emitting the visibility changes.
+     * Default is without delay (0).
+     */
+    get debounce(): number;
+    set debounce(value: number);
+    private _debounce;
+    /**
+     * A single number or an array of numbers which indicate at what percentage of the target's visibility
+     * the observer's callback should be executed. Number(s) must be in range 0..1.
+     * The default is 0 (meaning as soon as even one pixel is visible, the callback will be run).
+     */
+    get threshold(): number | number[] | undefined;
+    set threshold(value: number | number[] | undefined);
+    private _threshold;
+    /** Margin around the root. A string of one to four values similar to the CSS margin property, e.g., "10px 20px 30px 40px" (top, right, bottom, left).  */
+    get rootMargin(): number | string | undefined;
+    set rootMargin(value: number | string | undefined);
+    private _rootMargin;
+    get root(): Element | undefined;
+    set root(value: Element | ElementRef | Document | undefined);
+    private _root;
+    constructor(...args: unknown[]);
+    private _subscribe;
+    private _unsubscribe;
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteObserveVisibility, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteObserveVisibility, "[cuteObserveVisibility], [cute-observe-visibility]", ["cuteObserveVisibility"], { "disabled": { "alias": "cuteObserveVisibilityDisabled"; "required": false; }; "debounce": { "alias": "cuteObserveVisibilityDebounce"; "required": false; }; "threshold": { "alias": "cuteObserveVisibility"; "required": false; }; "rootMargin": { "alias": "cuteObserveVisibilityRootMargin"; "required": false; }; "root": { "alias": "cuteObserveVisibilityRoot"; "required": false; }; }, { "intersectionChange": "cuteObserveVisibility"; }, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_debounce: unknown;
+}
+
+/**
+ * Directive that triggers a callback whenever the content of
+ * its associated element has changed.
+ */
+declare class CuteObserveContent {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteObserveContent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteObserveContent, "[cuteObserveContent]", ["cuteObserveContent"], {}, {}, never, never, true, [{ directive: typeof i1.CdkObserveContent; inputs: { "cdkObserveContentDisabled": "cuteObserveContentDisabled"; "debounce": "cuteObserveContentDebounce"; }; outputs: { "cdkObserveContent": "cuteObserveContent"; }; }]>;
+}
+
+declare class CuteObserversModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteObserversModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CuteObserversModule, never, [typeof i1$1.CommonModule, typeof CuteObserveVisibility, typeof CuteObserveContent], [typeof CuteObserveVisibility, typeof CuteObserveContent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CuteObserversModule>;
+}
+
+export { CUTE_VISIBILITY_OBSERVER_OPTIONS, CuteObserveContent, CuteObserveVisibility, CuteObserversModule, CuteVisibilityObserver, IntersectionObserverFactory };