@bravura/ui 6.0.1 → 7.0.0

package/CHANGELOG.md

@@ -1,8 +1,22 @@
 # Change history
 
+## 7.0.0 (2025-12-30)
+
+* fix: published version to angular version ([70668b7](https://scm.bravurasolutions.net/projects/DIGI/repos/ui-components/commits/70668b7))
+* build: angular upgrade ([475b99e](https://scm.bravurasolutions.net/projects/DIGI/repos/ui-components/commits/475b99e))
+
+
+### BREAKING CHANGE
+
+* upgrade angular to 20
+
+## 6.1.0 (2025-12-30)
+
+- feat: upgrade angular material to 19 ([b115af0](https://scm.bravurasolutions.net/projects/DIGI/repos/ui-components/commits/b115af0))
+
 ## <small>6.0.1 (2025-12-30)</small>
 
-* fix: add version mapping to angular version ([0262a77](https://scm.bravurasolutions.net/projects/DIGI/repos/ui-components/commits/0262a77))
+- fix: add version mapping to angular version ([0262a77](https://scm.bravurasolutions.net/projects/DIGI/repos/ui-components/commits/0262a77))
 
 ## 6.0.0 (2025-12-30)
 

package/README.md

@@ -8,6 +8,7 @@ This package contains a set of UI components built on top of [Angular Material l
 
 | BUI versions | Compatible Angular versions |
 | ------------ | --------------------------- |
+| ^7.0.0       | 20                          |
 | ^6.0.0       | 19                          |
 | ^5.0.0       | 18                          |
 | ^4.0.0       | 17                          |

package/alert/index.d.ts

@@ -1,5 +1,128 @@
+import { AnimationEvent } from '@angular/animations';
+import { ScrollDispatcher } from '@angular/cdk/scrolling';
+import * as i0 from '@angular/core';
+import { OnInit, OnDestroy, NgZone, ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
+import { Subject } from 'rxjs';
+import * as i3 from '@angular/common';
+import * as i4 from '@bravura/ui/icon-font';
+import * as i5 from '@angular/material/button';
+
+/**@internal */
+declare class InternalAlertOject {
+    readonly type: 'success' | 'info' | 'warn' | 'error';
+    readonly message: string;
+    id: string;
+    deleted: boolean;
+    constructor(type: 'success' | 'info' | 'warn' | 'error', message: string);
+}
 /**
- * Generated bundle index. Do not edit.
+ * Use this component in a designated area of a page for displaying notification messages
+ *
  */
-/// <amd-module name="@bravura/ui/alert" />
-export * from './public-api';
+declare class AlertContainerComponent implements OnInit, OnDestroy {
+    private zone;
+    private cdRef;
+    private _elementRef;
+    private scroll;
+    /** The maximum number of messages displayed in the container area. */
+    max: number;
+    /**
+     * This property determines the behavior for displaying the notifications when the container is outside the viewport.
+     *
+     * `scroll`: The component will try to scroll to reveal the new notifications.
+     * `float`: The component will float the alert panel to the center of the screen for a couple of seconds and move it back to the original position.
+     */
+    outsideViewportBehavior: 'scroll' | 'float';
+    /**
+     * The number of milliseconds for which the alert container will be floated when new notification arrives.
+     *
+     * This will only take effect when `outsideViewportBehavior` is set to `float` and the container is outside the viewport.
+     */
+    floatDuration: number;
+    /**@internal */
+    _alerts: InternalAlertOject[];
+    /**@internal */
+    _floated: boolean;
+    /**@internal */
+    _floatPanelHidden: boolean;
+    /** @ignore Emits whenever the animation is started. */
+    readonly _animationStarted: Subject<AnimationEvent>;
+    /** @ignore Emits whenever the animation is done. */
+    readonly _animationEnded: Subject<AnimationEvent>;
+    private _destroyed$;
+    private _endFloatingSub?;
+    /** Emits the component instance after initialisation. */
+    private init;
+    constructor(zone: NgZone, cdRef: ChangeDetectorRef, _elementRef: ElementRef<HTMLElement>, scroll: ScrollDispatcher);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**@internal */
+    get _remaining(): InternalAlertOject[];
+    /**@internal */
+    get _width(): number;
+    /** Add a message to the notification area */
+    notify(type: 'success' | 'info' | 'warn' | 'error', message: string): Promise<void>;
+    /**@ignore */
+    _checkViewport(): Promise<void>;
+    /**@ignore */
+    _dismiss(a: InternalAlertOject): Promise<void>;
+    /** Remove all messages currently displayed. */
+    clear(): Promise<void>;
+    private _endFloating;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AlertContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AlertContainerComponent, "bui-alert-container", never, { "max": { "alias": "max"; "required": false; }; "outsideViewportBehavior": { "alias": "outsideViewportBehavior"; "required": false; }; "floatDuration": { "alias": "floatDuration"; "required": false; }; }, { "init": "init"; }, never, never, false, never>;
+}
+
+/**
+ * An alert style message usually appears in a global notification area.
+ *
+ * The base color of the message is determined by the `type` of the message and a list of predefined
+ * CSS custom properties.
+ *
+ * ```scss
+ * --bui-color-success: #519602;
+ * --bui-color-info: #0dcaf0;
+ * --bui-color-warning: #ffc107;
+ * --bui-color-error: #dc3545;
+ * ```
+ *
+ *
+ */
+declare class AlertMessageComponent implements OnInit {
+    /** @ignore */
+    static ngAcceptInputType_dismissible: boolean | string | null | undefined;
+    /** @ignore */
+    static ngAcceptInputType_blink: boolean | string | null | undefined;
+    /** The type of the message, used to derive the icon and base color.  */
+    type: 'success' | 'info' | 'warn' | 'error';
+    /** The message to be displayed, HTML supported.  */
+    message: string;
+    /** Specifies the ARIA live region politeness. */
+    politeness: 'off' | 'polite' | 'assertive';
+    /** Whether to display the button to fire the `dismissed` event. */
+    get dismissible(): any;
+    set dismissible(value: any);
+    /** To be emitted when the user choose to dismiss the message. The event object is the ID of the element.  */
+    dismissed: EventEmitter<string>;
+    /** To be emitted when the component finishes initialisation. The event object is the ID of the element.  */
+    initialised: EventEmitter<string>;
+    /** @ignore */
+    _id: string;
+    private _dismissible;
+    constructor();
+    ngOnInit(): void;
+    /** @ignore */
+    get iconName(): string;
+    /** @ignore */
+    _dismiss(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AlertMessageComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AlertMessageComponent, "bui-alert", never, { "type": { "alias": "type"; "required": false; }; "message": { "alias": "message"; "required": false; }; "politeness": { "alias": "politeness"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "_id": { "alias": "id"; "required": false; }; }, { "dismissed": "dismissed"; "initialised": "initialised"; }, never, ["*"], false, never>;
+}
+
+declare class AlertModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AlertModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AlertModule, [typeof AlertMessageComponent, typeof AlertContainerComponent], [typeof i3.CommonModule, typeof i4.IconFontModule, typeof i5.MatButtonModule], [typeof AlertMessageComponent, typeof AlertContainerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AlertModule>;
+}
+
+export { AlertContainerComponent, AlertMessageComponent, AlertModule };

package/alert/testing/index.d.ts

@@ -1,5 +1,28 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="@bravura/ui/alert/testing" />
-export * from './test-api';
+import { BaseHarnessFilters, ComponentHarness, ComponentHarnessConstructor, HarnessPredicate, TextOptions } from '@angular/cdk/testing';
+
+interface AlertMessageHarnessFilters extends BaseHarnessFilters {
+    /** only select the alert with the content matching this regular expression */
+    content?: RegExp;
+}
+declare class AlertMessageHarness extends ComponentHarness {
+    static hostSelector: string;
+    private _getBackdrop;
+    private _getDeleteButton;
+    private _getContentDiv;
+    static with<T extends AlertMessageHarness>(this: ComponentHarnessConstructor<T>, options?: AlertMessageHarnessFilters): HarnessPredicate<T>;
+    getColor(): Promise<string>;
+    delete(): Promise<void>;
+    getContent(options?: TextOptions): Promise<string>;
+    private static filterByContent;
+}
+declare class AlertContainerHarness extends ComponentHarness {
+    static hostSelector: string;
+    private _items;
+    private _floatingFrame;
+    getAlertItem(content: RegExp): Promise<AlertMessageHarness | null>;
+    countAlertItems(): Promise<number>;
+    isFloated(): Promise<boolean>;
+}
+
+export { AlertContainerHarness, AlertMessageHarness };
+export type { AlertMessageHarnessFilters };

package/behavior/index.d.ts

@@ -1,5 +1,233 @@
+import * as i0 from '@angular/core';
+import { ElementRef, OnChanges, OnDestroy, EventEmitter, NgZone, SimpleChanges, AfterViewInit, DoCheck, ViewContainerRef, OnInit } from '@angular/core';
+import * as i6 from '@angular/material/button';
+import { MatButton, MatIconButton, MatIconAnchor, MatFabButton, MatFabAnchor, MatMiniFabButton, MatMiniFabAnchor } from '@angular/material/button';
+import { Subscription } from 'rxjs';
+import * as i8 from '@angular/cdk/observers';
+import { ContentObserver } from '@angular/cdk/observers';
+import * as i5 from '@angular/common';
+import * as i7 from '@angular/material/progress-spinner';
+
 /**
- * Generated bundle index. Do not edit.
+ * Use this directive to designate a target HTML element, based on which the child elements'
+ * `[buiSizing]` directives will calculate the sizes.
+ *
+ * ```html
+ * <div [buiSizingMonitor]>
+ *    <div [buiSizing]="...">
+ *    </div>
+ *    <div>
+ *       <div [buiSizing]="...">
+ *       </div>
+ *    </div>
+ * <div>
+ * ```
  */
-/// <amd-module name="@bravura/ui/behavior" />
-export * from './public-api';
+declare class SizingMonitorDirective {
+    readonly element: ElementRef<HTMLElement>;
+    constructor(element: ElementRef<HTMLElement>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<SizingMonitorDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SizingMonitorDirective, "[buiSizingMonitor]", never, {}, {}, never, never, false, never>;
+}
+
+/**
+ * This directive monitors the changes in the width of the `sizingBy` target, and apply specified style
+ *  classes and/or inline styles to the current element dynamically.
+ *
+ * In order for the layout engine to efficiently calculate and stabilize the dimensions, the effective style property
+ * `box-sizing` of the `sizingBy` target element must be set to `border-box`.
+ *
+ * The directive uses [ResizeObserver API](https://developer.mozilla.org/en-US/docs/Web/API/Resize_Observer_API)
+ * to capture the events of element resizing. Please use a polyfill if you want to support older browsers
+ * that do not implement ResizeObserver API.
+ *
+ * Examples:
+ *
+ * ```html
+ * <div #parentElement>
+ *   <div [buiSizing]="{'400': 'small', '800': 'medium', '~': 'large'}" [buiSizingBy]="parentElement"></div>
+ *   <div [buiSizing]="['small', 'medium', 'large']" [buiSizingBy]="'root'"></div>
+ *   <div [buiSizing]="{'650': 'border-color: #28569', '~': 'bg-muted; border-style: dotted'}" [buiSizingBy]="parentElement"></div>
+ * </div>
+ * ```
+ */
+declare class SizingDirective implements OnChanges, OnDestroy {
+    private _doc;
+    private _defaultTarget;
+    private _zone;
+    /**
+     * @ignore
+     */
+    static defaultSizingBreakpoints: string[];
+    /**
+     * Specifies the breakpoint widths and the style classes.
+     *
+     * The sizing spec `{"400": "small", "800": "medium", "~": "large"}` tells the directive to apply
+     * a style class `small` when the width of the monitored target is smaller than 400 pixels,
+     * `medium` when the width is between 400 and 800 pixels, and `large` when above.
+     *
+     * @example {'400': 'small', '800': 'medium', '~': 'large'}
+     */
+    buiSizing: string | Array<string> | {
+        [key: string]: string;
+    };
+    /**
+     * The alias of `buiSizingBy`.
+     * @default 'root'
+     * @deprecated
+     * @ignore
+     */
+    sizingBy: 'root' | 'parent' | HTMLElement;
+    /**
+     * Designate an element to be monitored for recalculating the style classes of the current element.
+     *
+     * - `root` specifies the document root or the enclosing shadow host. This is the default value.
+     * - `parent` specifies the parent element.
+     *
+     * @default 'root'
+     * @alias sizingBy
+     */
+    get buiSizingBy(): 'root' | 'parent' | HTMLElement;
+    set buiSizingBy(target: 'root' | 'parent' | HTMLElement);
+    /**
+     * Emits `{width, height}` when the monitor target element resizes.
+     *
+     * Note that the dimensions emitted are of the [sizingBy] target, but not the current element.
+     */
+    buiResized: EventEmitter<{
+        width: number;
+        height: number;
+    }>;
+    /**
+     * Recalculate the height of this element according to the height of the monitored target.
+     */
+    buiFixedHeight: boolean;
+    private _monitorTarget;
+    private _observer;
+    private _sizingSpec;
+    private _width;
+    private _height;
+    private _reflowFrameCount;
+    private _element;
+    private _frameHandlerId;
+    constructor(_doc: Document, _defaultTarget: SizingMonitorDirective, elemRef: ElementRef<HTMLElement>, _zone: NgZone);
+    ngOnChanges(_: SimpleChanges): void;
+    ngOnDestroy(): void;
+    private _initOrReset;
+    private _setUpNodeMonitor;
+    private _tearDownNodeMonitor;
+    private _runWithObserver;
+    private _calculateSize;
+    private _applyClassesOrStyles;
+    private _removeClassesOrStyles;
+    private _reflowHeight;
+    private _toNumber;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SizingDirective, [null, { optional: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SizingDirective, "[buiSizing],[buiResized],[buiSizingBy],[buiFixedHeight]", never, { "buiSizing": { "alias": "buiSizing"; "required": false; }; "sizingBy": { "alias": "sizingBy"; "required": false; }; "buiSizingBy": { "alias": "buiSizingBy"; "required": false; }; "buiFixedHeight": { "alias": "buiFixedHeight"; "required": false; }; }, { "buiResized": "buiResized"; }, never, never, false, never>;
+}
+
+/**
+ * Use this directive on a `MatButton` element to provide an alternative view when an async operation is in progress.
+ *
+ * For example:
+ *
+ * ```
+ * <button (click)="submit();" [buiAwait]="submitSubscription" buiAwaitAriaLabel="submitting">Submit</button>
+ * ```
+ *
+ * Please refer to [Material Design](https://material.io/components/progress-indicators#circular-progress-indicators)
+ * for more details of integrating circular spinner component with action buttons.
+ *
+ * The operation is considered 'in progress' when the bound property `buiAwait` evaluates to
+ *
+ * - `true`; or
+ * - a `number` within 0 - 100; or
+ * - an instance of `rxjs/Subscription` and `buiAwait.closed` is falsy
+ *
+ * When in progress
+ *
+ * - the button's caption will be hidden;
+ * - a `<mat-progress-spinner>` will be displayed in place of the caption;
+ * - the button will be disabled by setting the property `disabled` of the `MatButton` instance.
+ */
+declare class AwaitDirective implements AfterViewInit, DoCheck {
+    private readonly _eRef;
+    readonly _button: MatButton;
+    readonly _iconButton: MatIconButton;
+    readonly _iconAnchor: MatIconAnchor;
+    readonly _fab: MatFabButton;
+    readonly _fabAnchor: MatFabAnchor;
+    readonly _miniFab: MatMiniFabButton;
+    readonly _miniFabAnchor: MatMiniFabAnchor;
+    private readonly doc;
+    private _viewCont;
+    /**
+     * Indicates the `in progress` status of an async operation.
+     *
+     * The operation is considered 'in progress' when the property evaluates to
+     *
+     * - `true`; or
+     * - a `number` within 0 - 100; or
+     * - an instance of `rxjs/Subscription` and `buiAwait.closed` is falsy
+     *
+     * When it is a number, it represets the progress in percentage term.
+     */
+    buiAwait: null | undefined | boolean | Subscription | number;
+    /** The ARIA label to be put on the spinner. The default value is `"In progress"`. */
+    buiAwaitAriaLabel: string;
+    /** The diameter of the in-progress spinner. The default value is `20`. */
+    buiAwaitDiameter: number;
+    private _overlayEl;
+    private _processing;
+    private _spinnerRef;
+    private _captionWrapper;
+    private button;
+    constructor(_eRef: ElementRef<HTMLElement>, _button: MatButton, _iconButton: MatIconButton, _iconAnchor: MatIconAnchor, _fab: MatFabButton, _fabAnchor: MatFabAnchor, _miniFab: MatMiniFabButton, _miniFabAnchor: MatMiniFabAnchor, doc: Document, _viewCont: ViewContainerRef);
+    /** @ignore */
+    ngAfterViewInit(): void;
+    /** @ignore */
+    ngDoCheck(): void;
+    /** @ignore */
+    private get _isDeterminate();
+    private _statusChanged;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AwaitDirective, [null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AwaitDirective, "[buiAwait]", never, { "buiAwait": { "alias": "buiAwait"; "required": false; }; "buiAwaitAriaLabel": { "alias": "buiAwaitAriaLabel"; "required": false; }; "buiAwaitDiameter": { "alias": "buiAwaitDiameter"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+/**
+ * Use `[bui-class.not-empty]` to specify a style class activated only when the host element has DOM children;
+ *
+ * use `[bui-class.empty]` for a style class activated when it has no DOM children.
+ *
+ * Use `[bui-class.no-text]` to specify a style class activated only when the host element has text content;
+ *
+ * use `[bui-class.has-text]` for a style class activated when it has no text content.
+ */
+declare class ObserveContentClassDirective implements OnDestroy, OnInit {
+    private readonly subscription;
+    private readonly element;
+    private classToRemove;
+    private classEmpty?;
+    private classNotEmpty?;
+    private classNoText?;
+    private classHasText?;
+    constructor(observer: ContentObserver, elementRef: ElementRef<HTMLElement>);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private checkClass;
+    private checkClassWith;
+    private addClass;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ObserveContentClassDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ObserveContentClassDirective, "[bui-class.empty],[bui-class.not-empty],[bui-class.no-text],[bui-class.has-text]", never, { "classEmpty": { "alias": "bui-class.empty"; "required": false; }; "classNotEmpty": { "alias": "bui-class.not-empty"; "required": false; }; "classNoText": { "alias": "bui-class.no-text"; "required": false; }; "classHasText": { "alias": "bui-class.has-text"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+/**
+ *  For functionality that cannot be easily achieved via CSS.
+ */
+declare class BehaviorModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<BehaviorModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<BehaviorModule, [typeof SizingDirective, typeof SizingMonitorDirective, typeof AwaitDirective, typeof ObserveContentClassDirective], [typeof i5.CommonModule, typeof i6.MatButtonModule, typeof i7.MatProgressSpinnerModule, typeof i8.ObserversModule], [typeof SizingDirective, typeof SizingMonitorDirective, typeof AwaitDirective, typeof i7.MatProgressSpinnerModule, typeof ObserveContentClassDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<BehaviorModule>;
+}
+
+export { AwaitDirective, BehaviorModule, ObserveContentClassDirective, SizingDirective, SizingMonitorDirective };

package/clip-note/index.d.ts

@@ -1,5 +1,127 @@
+import * as i0 from '@angular/core';
+import { AfterViewInit, TemplateRef, EventEmitter, ElementRef, ViewContainerRef, OnInit, OnDestroy, EmbeddedViewRef, ChangeDetectorRef, ModuleWithProviders } from '@angular/core';
+import { ThemePalette } from '@angular/material/core';
+import * as i6 from '@angular/cdk/bidi';
+import { Directionality } from '@angular/cdk/bidi';
+import * as i3 from '@angular/common';
+import * as i4 from '@angular/material/button';
+import * as i5 from '@angular/material/icon';
+import * as i7 from '@bravura/ui/common';
+import * as i8 from '@angular/cdk/observers';
+import * as i9 from '@bravura/ui/icon-font';
+
+interface ClipNoteDefaultConfig {
+    color: ThemePalette;
+    caption: string;
+}
 /**
- * Generated bundle index. Do not edit.
+ * A clip note consists of a toggle button and a floating 'notepad' element, attached to the top end of the host element's
+ * viewable area. The 'notepad' normally collapses away and only reveals itself when the toggle button is active.
+ *
+ * The toggle button clips on the edge of the host element and expands to display the full caption when hovered. It hides itself
+ * automatically when there is no content provided via the `buiClipNote` property of the directive.
+ *
+ * The clip note component is suitable for large page container elements with visible boundaries. It can present contextual
+ * information regarding and in addition to the content displayed in the main view area.
+ *
+ * The properties `buiClipNoteColor` and `buiClipNoteCaption` customise the appearance of the clip note, the default values of which
+ * can optionally be provided by the `ClipNoteModule.forConfig()` method.
+ *
  */
-/// <amd-module name="@bravura/ui/clip-note" />
-export * from './public-api';
+declare class ClipNoteDirective implements AfterViewInit {
+    private _elementRef;
+    private _vc;
+    /**
+     * Provide content to the clip note's floating notepad element.
+     * It accepts a `string` of HTML content or a `TemplateRef` object.
+     */
+    get buiClipNote(): string | TemplateRef<any> | undefined;
+    set buiClipNote(note: string | TemplateRef<any> | undefined);
+    /**
+     * Customise the theme color alias.
+     * @default 'primary'
+     */
+    get buiClipNoteColor(): ThemePalette;
+    set buiClipNoteColor(color: ThemePalette);
+    /**
+     * Customise the icon on the toggle button. With this property specified, the animation on the icon
+     * will not be active.
+     */
+    get buiClipNoteIcon(): string | undefined;
+    set buiClipNoteIcon(icon: string | undefined);
+    /**
+     * The caption of the toggle button when expanded.
+     */
+    get buiClipNoteCaption(): string;
+    set buiClipNoteCaption(text: string);
+    /** Emits when the panel opens */
+    readonly buiClipNoteOpened: EventEmitter<void>;
+    /** Emits when the panel closes */
+    readonly buiClipNoteClosed: EventEmitter<void>;
+    private _content?;
+    private _color;
+    private _compRef;
+    private _caption;
+    private _icon?;
+    constructor(_elementRef: ElementRef<HTMLElement>, _vc: ViewContainerRef, _config: ClipNoteDefaultConfig);
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /** Open the note panel */
+    open(): void;
+    /** Close the note panel */
+    close(): void;
+    private _processContent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ClipNoteDirective, [{ host: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ClipNoteDirective, "[buiClipNote]", ["buiClipNote"], { "buiClipNote": { "alias": "buiClipNote"; "required": false; }; "buiClipNoteColor": { "alias": "buiClipNoteColor"; "required": false; }; "buiClipNoteIcon": { "alias": "buiClipNoteIcon"; "required": false; }; "buiClipNoteCaption": { "alias": "buiClipNoteCaption"; "required": false; }; }, { "buiClipNoteOpened": "buiClipNoteOpened"; "buiClipNoteClosed": "buiClipNoteClosed"; }, never, never, false, never>;
+}
+
+declare class ClipNoteComponent implements OnInit, OnDestroy {
+    private _cd;
+    private _dir;
+    private _elemRef;
+    buttonText: string;
+    get buttonState(): string;
+    get buttonIconState(): string;
+    panelState: 'open' | 'closed-ltr' | 'closed-rtl';
+    direction: string;
+    _contentView?: EmbeddedViewRef<any>;
+    _content?: string;
+    _color: ThemePalette;
+    _buttonAnimating: boolean;
+    _icon?: string;
+    _hasContent: boolean;
+    readonly opened: EventEmitter<void>;
+    readonly closed: EventEmitter<void>;
+    private _hovering;
+    private _destroyed$;
+    private _toggleQueue;
+    private _viewDiv;
+    private _noteViewRef;
+    private _fallbackTemplate;
+    constructor(_cd: ChangeDetectorRef, _dir: Directionality, _elemRef: ElementRef<HTMLElement>);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    _mouseOverButton(hovering: boolean): void;
+    toggle(): void;
+    _scheduleToggle(): void;
+    _checkToggle(): void;
+    open(): void;
+    close(): void;
+    _emit(): void;
+    _contentChanged(content?: string | TemplateRef<any>): void;
+    _checkContent(initial?: boolean): void;
+    _assignColor(color: ThemePalette): void;
+    _assignButtonText(text: string): void;
+    _assignButtonIcon(icon?: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ClipNoteComponent, [null, null, { host: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ClipNoteComponent, "bui-clip-note", never, {}, {}, never, never, false, never>;
+}
+
+declare class ClipNoteModule {
+    static forConfig(config: ClipNoteDefaultConfig): ModuleWithProviders<ClipNoteModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ClipNoteModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ClipNoteModule, [typeof ClipNoteComponent, typeof ClipNoteDirective], [typeof i3.CommonModule, typeof i4.MatButtonModule, typeof i5.MatIconModule, typeof i6.BidiModule, typeof i7.BuiCommonModule, typeof i8.ObserversModule, typeof i9.IconFontModule], [typeof ClipNoteDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ClipNoteModule>;
+}
+
+export { ClipNoteDirective, ClipNoteModule };

package/common/index.d.ts

@@ -1,5 +1,26 @@
+import * as i1 from '@angular/cdk/bidi';
+import { Direction, Directionality } from '@angular/cdk/bidi';
+import * as i0 from '@angular/core';
+
+declare function generateID(): string;
+declare function isElementInViewport(el: HTMLElement): boolean;
 /**
- * Generated bundle index. Do not edit.
+ * Uses canvas.measureText to compute and return the width of the given text of given font in pixels.
+ *
+ * @param {String} text The text to be rendered.
+ * @param el the element used to compute the font styles
+ *
+ * @see https://stackoverflow.com/questions/118241/calculate-text-width-with-javascript/21015393#21015393
  */
-/// <amd-module name="@bravura/ui/common" />
-export * from './public-api';
+declare function getTextWidth(text: string, el?: HTMLElement): number;
+
+/** Resolves a string value to a specific direction. */
+declare function _resolveDirectionality(rawValue: string): Direction;
+declare class BuiCommonModule {
+    constructor(dir: Directionality, thisModule: BuiCommonModule, document: Document);
+    static ɵfac: i0.ɵɵFactoryDeclaration<BuiCommonModule, [null, { optional: true; skipSelf: true; }, null]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<BuiCommonModule, never, [typeof i1.BidiModule], [typeof i1.BidiModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<BuiCommonModule>;
+}
+
+export { BuiCommonModule, _resolveDirectionality, generateID, getTextWidth, isElementInViewport };