@bravura/ui 6.1.0 → 7.0.0

package/file-upload/index.d.ts

@@ -1,5 +1,202 @@
+import * as i0 from '@angular/core';
+import { OnInit, OnDestroy } from '@angular/core';
+import { HttpEvent } from '@angular/common/http';
+import { ControlValueAccessor } from '@angular/forms';
+import { Observable, Subscription, Subject } from 'rxjs';
+import * as i2 from '@angular/common';
+import * as i3 from '@angular/material/icon';
+import * as i4 from '@bravura/ui/icon-font';
+import * as i5 from '@angular/material/progress-bar';
+import * as i6 from '@angular/material/button';
+import * as i7 from '@angular/material/divider';
+import * as i8 from '@angular/material/tooltip';
+
 /**
- * Generated bundle index. Do not edit.
+ * This type represents a file or form item that has been sent as part of a multipart/form-data POST request.
  */
-/// <amd-module name="@bravura/ui/file-upload" />
-export * from './public-api';
+declare class FileUploadItem {
+    /** The original filename in the client's filesystem, as provided by the browser.  */
+    name: string;
+    /** The size of the file item. */
+    size: number;
+    /** An alpha-numeric string that uniquely identifies the file item. */
+    id: string;
+    /** The content type (MIME type) of the file. */
+    type: string;
+    /** @internal */
+    constructor(_id: string, _name: string, _size: number, _type: string);
+}
+/**
+ * This is an API for processing file upload requests.
+ *
+ * A sub class of this type handles multiple file requests, sent using multipart/form-data encoding type, as specified by RFC 1867.
+ *
+ * Please extend this type and provide it in an injector at the same level, or ancestral to that, of the `FileUploadComponent`.
+ */
+declare abstract class FileUploadService {
+    /**
+     * Upload a list of selected files from the browser. The returned `Observable` array provides the update of the uploading progress
+     * through HTTP events.
+     */
+    abstract upload(files: File[]): Array<Observable<HttpEvent<FileUploadItem>>>;
+    /** List all the uploaded file items in the current HTTP session. This list excludes the files still in the process of being uploaded*/
+    abstract list(): Observable<FileUploadItem[]>;
+    /** Get the content of an uploaded file item as a `Blob`. */
+    abstract get(id: string): Observable<Blob>;
+    /** Delete an uploaded file item from the server. */
+    abstract delete(id: string): Observable<void>;
+    /** Delete all uploaded file items in the current  HTTP session. */
+    abstract clear?(): Observable<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<FileUploadService>;
+}
+
+/** @ignore */
+declare class UploadingItem {
+    private oncancel?;
+    progress: number;
+    uploadedItem: FileUploadItem | null | undefined;
+    downloadingSubs?: Subscription;
+    private subscription;
+    private file?;
+    constructor(item: FileUploadItem, oncancel: (item: UploadingItem) => void);
+    constructor(event$: Observable<HttpEvent<FileUploadItem>> | FileUploadItem, file: File, oncomplete: () => void, oncancel: (item: UploadingItem) => void);
+    cancel(): void;
+    get done(): boolean;
+    get name(): string | undefined;
+    get downloading(): boolean | undefined;
+}
+/**
+ * A control value accessor component to provide the user interface for uploading files.
+ *
+ * The application that integrates this UI must provide an implementation of `FileUploadService`.
+ *
+ * The control's value is a list of alpha-numerical strings, which are the identifiers to the uploaded files.
+ *
+ * Example:
+ *
+ * ```html
+ * <form>
+ *  <bui-file-upload [(ngModel)]="uploadedFileIds" name="myFiles"></bui-file-upload>
+ * </form>
+ * ```
+ *
+ * @see FileUploadService
+ */
+declare class FileUploadComponent implements OnInit, OnDestroy, ControlValueAccessor {
+    private _service;
+    /** @ignore */
+    _value: string[] | null;
+    /**
+     * The caption of the button for opening file selection dialog.
+     */
+    uploadActionText: string;
+    /**
+     * The label for listing successful uploaded files.
+     */
+    fileUploadedLabel: string;
+    /**
+     * The text to be displayed when the user starts to drag file items over the browser window.
+     */
+    dragHint: string;
+    /**
+     * The text to be displayed when the user is dragging the file items over the drop zone.
+     */
+    dropHint: string;
+    /** Specifies the total number of files accepted. A falsy value removes the limit.*/
+    limit: number;
+    /**
+     * specify the number of maximum bytes that can be uploaded.
+     * if number is specified, bytes are assumed, otherwise enter a string for specific size type.
+     */
+    fileSize: number | string;
+    /**
+     * Accepted MIME types
+     *
+     * @example ['text/*', 'image/png']
+     */
+    get types(): string[];
+    set types(types: string[]);
+    /** @ignore */
+    _fileSizeExceedMsg: string;
+    /** @ignore */
+    _uploadingItems: UploadingItem[];
+    /** @ignore */
+    _accept: string;
+    /** @ignore */
+    _itemAnimationStart: Subject<void>;
+    /** @ignore */
+    _itemAnimationDone: Subject<void>;
+    /** @ignore */
+    _itemAnimationInProgress: boolean;
+    private _onChange;
+    private _onTouch;
+    private _frameDndEnter;
+    private _frameDndLeave;
+    private _frameDndOver;
+    private _frameDndStop;
+    private _overFrameCounter;
+    private _overCounter;
+    private _typeRegExps;
+    private _types;
+    private _initSubs?;
+    private _numberOfFilesDragged;
+    private _fileInput;
+    constructor(_service: FileUploadService);
+    /** @internal */
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** @internal */
+    writeValue(obj: any): void;
+    /** @internal */
+    registerOnChange(fn: any): void;
+    /** @internal */
+    registerOnTouched(fn: any): void;
+    /** @internal */
+    onDragEnter(event: DragEvent): void;
+    /** @internal */
+    onDragOver(event: Event): void;
+    /** @internal */
+    onDragLeave(event: Event): void;
+    /** @internal */
+    onDndDrop(event: DragEvent): void;
+    /** Open the file selection dialog */
+    selectFiles(): void;
+    /** @ignore */
+    _openItem(item: UploadingItem): void;
+    /** @ignore */
+    get _overFrame(): boolean;
+    /** @ignore */
+    get _overDropZone(): boolean;
+    /** Whether file uploading is in progress */
+    get uploading(): boolean;
+    /** The remaining number of files allowed.*/
+    get remaining(): number;
+    /** @ignore */
+    _handleFileSelection(): void;
+    /** @ignore */
+    get _invalidFilesDragged(): boolean;
+    /** @ignore */
+    get _initialising(): boolean;
+    private returnFileSize;
+    private _validateFileSize;
+    private _getMaxBytes;
+    private _uploadFiles;
+    private _onDndEnterFrame;
+    private _onDndLeaveFrame;
+    private _onDndStopFrame;
+    private _acceptChange;
+    private _updateItems;
+    private _deleteItem;
+    private _updateValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "bui-file-upload", never, { "uploadActionText": { "alias": "uploadActionText"; "required": false; }; "fileUploadedLabel": { "alias": "fileUploadedLabel"; "required": false; }; "dragHint": { "alias": "dragHint"; "required": false; }; "dropHint": { "alias": "dropHint"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "fileSize": { "alias": "fileSize"; "required": false; }; "types": { "alias": "types"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+declare class FileUploadModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FileUploadModule, [typeof FileUploadComponent], [typeof i2.CommonModule, typeof i3.MatIconModule, typeof i4.IconFontModule, typeof i5.MatProgressBarModule, typeof i6.MatButtonModule, typeof i7.MatDividerModule, typeof i8.MatTooltipModule], [typeof FileUploadComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FileUploadModule>;
+}
+
+export { FileUploadComponent, FileUploadItem, FileUploadModule, FileUploadService };

package/form-field/index.d.ts

@@ -1,5 +1,51 @@
+import * as i0 from '@angular/core';
+import { ElementRef, ModuleWithProviders } from '@angular/core';
+import * as i3 from '@angular/material/form-field';
+import { MatFormField } from '@angular/material/form-field';
+import * as i2 from '@angular/common';
+import * as i4 from '@angular/cdk/observers';
+
+interface BuiFormFieldConfig {
+    appearance?: 'fill' | 'outline' | 'bound';
+}
 /**
- * Generated bundle index. Do not edit.
+ * Container for form controls that applies Material Design styling and behavior.
+ *
+ * This component extends Angular Material's [mat-form-field](https://material.angular.io/components/form-field) and provides two additional appearances
+ * `bound` and `detach`. `bound` renders the label outside the outlined area of the field, while `detach` remove the borders all together. `detach`
+ * is generally used with form controls that render their own borders.
+ *
+ * ** IMPORTANT NOTICE **
+ *
+ * From version 3.0 onward, the selector `bui-form-field` is deprecated and will be removed in later releases. You no longer need to use this tag name
+ * for the new appearances. As long as you import the `NgModule` from this package, the new appearances will be supported by Material's `mat-form-field`
+ * component.
  */
-/// <amd-module name="@bravura/ui/form-field" />
-export * from './public-api';
+declare class FormFieldComponent extends MatFormField {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormFieldComponent, "bui-dummy-component", never, {}, {}, never, never, false, never>;
+}
+/**
+ * @ignore
+ */
+declare class FormFieldStyleDirective {
+    private matFormField;
+    private elemRef;
+    private _appearance;
+    private _flowDetection;
+    /** The form field appearance style. */
+    get appearance(): any;
+    set appearance(value: any);
+    constructor(matFormField: MatFormField, elemRef: ElementRef<HTMLElement>, config: BuiFormFieldConfig);
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormFieldStyleDirective, [{ host: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FormFieldStyleDirective, "bui-form-field, mat-form-field", never, { "appearance": { "alias": "appearance"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+declare class FormFieldModule {
+    static forConfig(config: BuiFormFieldConfig): ModuleWithProviders<FormFieldModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormFieldModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FormFieldModule, [typeof FormFieldComponent, typeof FormFieldStyleDirective], [typeof i2.CommonModule, typeof i3.MatFormFieldModule, typeof i4.ObserversModule], [typeof FormFieldComponent, typeof FormFieldStyleDirective, typeof i3.MatFormFieldModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FormFieldModule>;
+}
+
+export { FormFieldComponent, FormFieldModule, FormFieldStyleDirective };

package/icon-font/index.d.ts

@@ -1,5 +1,81 @@
+import * as i0 from '@angular/core';
+import { OnChanges, SimpleChanges } from '@angular/core';
+import * as i3 from '@angular/material/icon';
+import { MatIcon } from '@angular/material/icon';
+import * as i2 from '@angular/common';
+
 /**
- * Generated bundle index. Do not edit.
+ * Decode the FontAwesome icon font set name from the icon name
+ *
+ * `'far fa-alarm' => 'far'`
+ *
+ * `'home' => ''`
+ *
+ * `'fa-user' => 'fas'`
  */
-/// <amd-module name="@bravura/ui/icon-font" />
-export * from './public-api';
+declare function decodeFAIconFontSet(iconName: string): string;
+/**
+ * Decode the FontAwesome icon font name from the icon name
+ *
+ * `'far fa-alarm' => 'fa-alarm'`
+ *
+ * `'home' => ''`
+ *
+ * `'fa-user' => 'fa-user'`
+ */
+declare function decodeFAIconFontName(iconName: string): string;
+
+/**
+ * @ignore
+ */
+declare const BUI_ICON_MAT_VARIANTS: string[];
+/**
+ * Use this directive, together with `<mat-icon>`, to display an icon font character/symbol
+ * from Material or FontAwesome icons.
+ *
+ * To use the icon fonts, add the following statements to one of your global SCSS files:
+ *
+ * ```css
+ * @import url(https://fonts.googleapis.com/css2?family=Material+Icons);
+ * @import url(https://use.fontawesome.com/releases/v5.15.0/css/all.css);
+ * ```
+ *
+ * @example <mat-icon buiIcon="far fa-circle"></mat-icon> <!-- FontAwesome -->
+ * @example <mat-icon buiIcon="home" [size]="42"></mat-icon> <!-- Material -->
+ */
+declare class IconDirective implements OnChanges {
+    private _icon;
+    /**
+     * The icon name
+     *
+     * @example 'far fa-circle'
+     * @example 'home'
+     */
+    buiIcon: string;
+    /**
+     * Override the default icon size
+     *
+     * @default 24
+     */
+    size: number;
+    /**
+     * The style variant of Material Icons. It is not applicable for Font Awesome Icons or any other custom font icon sets.
+     * @default `filled`
+     */
+    variant: 'filled' | 'outlined' | 'round' | 'two-tone' | 'sharp';
+    constructor(_icon: MatIcon);
+    ngOnChanges(_: SimpleChanges): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<IconDirective, "[buiIcon]", never, { "buiIcon": { "alias": "buiIcon"; "required": false; }; "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+/**
+ * Module for utility functions and directives based on `mat-icon` and icon fonts.
+ */
+declare class IconFontModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconFontModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<IconFontModule, [typeof IconDirective], [typeof i2.CommonModule, typeof i3.MatIconModule], [typeof i3.MatIconModule, typeof IconDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<IconFontModule>;
+}
+
+export { BUI_ICON_MAT_VARIANTS, IconDirective, IconFontModule, decodeFAIconFontName, decodeFAIconFontSet };

package/index.d.ts

@@ -1,5 +1,3 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="@bravura/ui" />
-export * from './public-api';
+declare const NO_EXPORT = "NO_EXPORT";
+
+export { NO_EXPORT };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bravura/ui",
   "description": "Bravura UI Components for Angular applications",
-  "version": "6.1.0",
+  "version": "7.0.0",
   "keywords": [
     "Angular",
     "Angular Material",
@@ -35,10 +35,18 @@
       "types": "./alert/index.d.ts",
       "default": "./fesm2022/bravura-ui-alert.mjs"
     },
+    "./alert/testing": {
+      "types": "./alert/testing/index.d.ts",
+      "default": "./fesm2022/bravura-ui-alert-testing.mjs"
+    },
     "./behavior": {
       "types": "./behavior/index.d.ts",
       "default": "./fesm2022/bravura-ui-behavior.mjs"
     },
+    "./clip-note": {
+      "types": "./clip-note/index.d.ts",
+      "default": "./fesm2022/bravura-ui-clip-note.mjs"
+    },
     "./common": {
       "types": "./common/index.d.ts",
       "default": "./fesm2022/bravura-ui-common.mjs"
@@ -47,42 +55,42 @@
       "types": "./currency-input/index.d.ts",
       "default": "./fesm2022/bravura-ui-currency-input.mjs"
     },
-    "./clip-note": {
-      "types": "./clip-note/index.d.ts",
-      "default": "./fesm2022/bravura-ui-clip-note.mjs"
+    "./decimal-input": {
+      "types": "./decimal-input/index.d.ts",
+      "default": "./fesm2022/bravura-ui-decimal-input.mjs"
     },
     "./discrete-input": {
       "types": "./discrete-input/index.d.ts",
       "default": "./fesm2022/bravura-ui-discrete-input.mjs"
     },
-    "./form-field": {
-      "types": "./form-field/index.d.ts",
-      "default": "./fesm2022/bravura-ui-form-field.mjs"
-    },
-    "./decimal-input": {
-      "types": "./decimal-input/index.d.ts",
-      "default": "./fesm2022/bravura-ui-decimal-input.mjs"
-    },
     "./file-upload": {
       "types": "./file-upload/index.d.ts",
       "default": "./fesm2022/bravura-ui-file-upload.mjs"
     },
+    "./form-field": {
+      "types": "./form-field/index.d.ts",
+      "default": "./fesm2022/bravura-ui-form-field.mjs"
+    },
     "./icon-font": {
       "types": "./icon-font/index.d.ts",
       "default": "./fesm2022/bravura-ui-icon-font.mjs"
     },
-    "./phone-number": {
-      "types": "./phone-number/index.d.ts",
-      "default": "./fesm2022/bravura-ui-phone-number.mjs"
-    },
     "./panel": {
       "types": "./panel/index.d.ts",
       "default": "./fesm2022/bravura-ui-panel.mjs"
     },
+    "./phone-number": {
+      "types": "./phone-number/index.d.ts",
+      "default": "./fesm2022/bravura-ui-phone-number.mjs"
+    },
     "./radio-panel": {
       "types": "./radio-panel/index.d.ts",
       "default": "./fesm2022/bravura-ui-radio-panel.mjs"
     },
+    "./radio-panel/testing": {
+      "types": "./radio-panel/testing/index.d.ts",
+      "default": "./fesm2022/bravura-ui-radio-panel-testing.mjs"
+    },
     "./selection-panel": {
       "types": "./selection-panel/index.d.ts",
       "default": "./fesm2022/bravura-ui-selection-panel.mjs"
@@ -98,14 +106,6 @@
     "./tooltip": {
       "types": "./tooltip/index.d.ts",
       "default": "./fesm2022/bravura-ui-tooltip.mjs"
-    },
-    "./alert/testing": {
-      "types": "./alert/testing/index.d.ts",
-      "default": "./fesm2022/bravura-ui-alert-testing.mjs"
-    },
-    "./radio-panel/testing": {
-      "types": "./radio-panel/testing/index.d.ts",
-      "default": "./fesm2022/bravura-ui-radio-panel-testing.mjs"
     }
   },
   "dependencies": {

package/panel/index.d.ts

@@ -1,5 +1,109 @@
+import * as i0 from '@angular/core';
+import { OnInit, OnDestroy, ElementRef, ChangeDetectorRef } from '@angular/core';
+import { ThemePalette } from '@angular/material/core';
+import * as i4 from '@angular/common';
+import * as i5 from '@angular/material/card';
+import * as i6 from '@bravura/ui/behavior';
+
 /**
- * Generated bundle index. Do not edit.
+ * A "tinted" element has a shaded background specified by the `ThemePalette`, which
+ * is compatible with both light and dark themes.
  */
-/// <amd-module name="@bravura/ui/panel" />
-export * from './public-api';
+declare class TintedDirective implements OnInit, OnDestroy {
+    private _doc;
+    /**
+     *  The base color of the shaded background
+     * @default 'primary'
+     */
+    get color(): ThemePalette;
+    set color(c: ThemePalette);
+    private _color;
+    private readonly _addedStyle;
+    private readonly _attr;
+    private _element;
+    constructor(_doc: Document, elemRef: ElementRef<HTMLElement>);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private generateStyle;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TintedDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TintedDirective, "[buiTinted], bui-panel", ["buiTinted"], { "color": { "alias": "buiTinted"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+/**
+ * A `bui-panel` consists of a `mat-card` and a tinted backdrop.
+ *
+ * Unlike `mat-card`, `bui-panel` has a flat appearance by default and a transparent background.
+ * The backdrop is nearly transparent, blending the theme palette `color`
+ * and the effective background color of the DOM ancestors.
+ *
+ * `bui-panel` supports all the content child directives of `mat-card` as well as `bui-panel-section`.
+ *
+ * `bui-panel-section`s are subdivisions of `bui-panel` that rearrange their orientation based on the width of the container element.
+ *
+ */
+declare class PanelComponent implements OnInit {
+    private _cd;
+    private _tinted;
+    /**
+     * Additional style classes on the tinted backdrop element.
+     * @deprecated
+     * @ignore
+     */
+    backdropClass?: string;
+    /**
+     * Additional style classes on the `<mat-card>` element.
+     */
+    cardClass?: string;
+    /**
+     * This property defines the background (shaded) and border colors of the panel
+     */
+    get color(): ThemePalette;
+    set color(value: ThemePalette);
+    /**
+     * In contrast to using a `mat-card` alone, a `bui-panel` does not have a elevated appearance by default.
+     *
+     * This property can change the default appearance to
+     *
+     * * `raised` - the original `mat-card` default
+     * * `outline` - a `mat-card` with borders
+     * * `flat` - no border or elevation
+     */
+    get appearance(): 'outlined' | 'raised' | 'flat';
+    set appearance(value: 'outlined' | 'raised' | 'flat');
+    /**
+     * The width of the host element, at which the panel section container will change its orientation.
+     */
+    breakpoint: number;
+    /** @ignore */
+    _width: number;
+    private _color;
+    private _appearance;
+    constructor(_cd: ChangeDetectorRef, _tinted: TintedDirective);
+    ngOnInit(): void;
+    /** @ignore */
+    _resized(width: number): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PanelComponent, [null, { host: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PanelComponent, "bui-panel", never, { "backdropClass": { "alias": "backdropClass"; "required": false; }; "cardClass": { "alias": "cardClass"; "required": false; }; "color": { "alias": "color"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "breakpoint": { "alias": "breakpoint"; "required": false; }; }, {}, never, ["*"], false, never>;
+}
+
+/**
+ * `bui-panel-section`s are subdivisions of `bui-panel` that rearrange their orientation based on the width of the container element.
+ */
+declare class PanelSectionComponent implements OnInit, OnDestroy {
+    private _elementRef;
+    private _parentElement;
+    constructor(_elementRef: ElementRef<HTMLElement>);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private _calcCount;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PanelSectionComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PanelSectionComponent, "bui-panel-section", never, {}, {}, never, ["*"], false, never>;
+}
+
+declare class PanelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<PanelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PanelModule, [typeof PanelComponent, typeof PanelSectionComponent, typeof TintedDirective], [typeof i4.CommonModule, typeof i5.MatCardModule, typeof i6.BehaviorModule], [typeof i5.MatCardModule, typeof PanelComponent, typeof PanelSectionComponent, typeof TintedDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PanelModule>;
+}
+
+export { PanelComponent, PanelModule, PanelSectionComponent, TintedDirective };