@ptsecurity/mosaic 12.1.0 → 13.0.0

package/navbar/navbar-item.component.d.ts

@@ -1,72 +1,160 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { AfterContentInit, ElementRef, OnDestroy } from '@angular/core';
-import { McButtonCssStyler } from '@ptsecurity/mosaic/button';
-import { CanDisable, CanDisableCtor } from '@ptsecurity/mosaic/core';
+import { FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
+import { Directionality } from '@angular/cdk/bidi';
+import { Overlay, ScrollDispatcher } from '@angular/cdk/overlay';
+import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ElementRef, NgZone, OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core';
+import { IFocusableOption } from '@ptsecurity/cdk/a11y';
+import { McButton, McButtonCssStyler } from '@ptsecurity/mosaic/button';
+import { McDropdownTrigger } from '@ptsecurity/mosaic/dropdown';
 import { McIcon } from '@ptsecurity/mosaic/icon';
+import { McTooltipTrigger, TooltipModifier } from '@ptsecurity/mosaic/tooltip';
 import { Subject } from 'rxjs';
+import { McVerticalNavbar } from './vertical-navbar.component';
 import * as i0 from "@angular/core";
+export interface McNavbarFocusableItemEvent {
+    item: McNavbarFocusableItem;
+}
 export declare class McNavbarLogo {
     readonly hovered: Subject<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarLogo, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarLogo, "mc-navbar-logo, [mc-navbar-logo]", never, {}, {}, never>;
 }
-export declare class McNavbarTitle implements AfterContentInit {
+export declare class McNavbarBento {
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarBento, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarBento, "mc-navbar-item[bento], [mc-navbar-item][bento]", never, {}, {}, never>;
+}
+export declare class McNavbarTitle implements AfterViewInit {
     private elementRef;
     readonly hovered: Subject<boolean>;
     outerElementWidth: number;
+    isTextOverflown: boolean;
     get text(): string;
+    get isOverflown(): boolean;
     constructor(elementRef: ElementRef);
     getOuterElementWidth(): number;
-    ngAfterContentInit(): void;
+    checkTextOverflown(): void;
+    ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarTitle, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarTitle, "mc-navbar-title, [mc-navbar-title]", never, {}, {}, never>;
 }
+export declare class McNavbarSubTitle implements AfterContentInit {
+    private elementRef;
+    readonly hovered: Subject<boolean>;
+    outerElementWidth: number;
+    get text(): string;
+    get isOverflown(): boolean;
+    constructor(elementRef: ElementRef);
+    getOuterElementWidth(): number;
+    ngAfterContentInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarSubTitle, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarSubTitle, "mc-navbar-subtitle, [mc-navbar-subtitle]", never, {}, {}, never>;
+}
 export declare class McNavbarBrand implements AfterContentInit, OnDestroy {
+    private navbar;
     logo: McNavbarLogo;
     title: McNavbarTitle;
     hovered: boolean;
+    get hasBento(): boolean;
     private destroyed;
+    constructor(navbar: McVerticalNavbar);
     ngAfterContentInit(): void;
     ngOnDestroy(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarBrand, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarBrand, "mc-navbar-brand, [mc-navbar-brand]", never, {}, {}, ["logo", "title"]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarBrand, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarBrand, "mc-navbar-brand, [mc-navbar-brand]", ["mcNavbarBrand"], {}, {}, ["logo", "title"], ["*"]>;
 }
 export declare class McNavbarDivider {
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarDivider, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarDivider, "mc-navbar-divider", never, {}, {}, never>;
 }
-export declare class McNavbarItemBase {
-    elementRef: ElementRef;
-    button: McButtonCssStyler;
-    vertical: boolean;
-    horizontal: boolean;
-    closed: boolean;
-    constructor(elementRef: ElementRef);
-    getOuterElementWidth(): number;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarItemBase, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarItemBase, "mc-navbar-item, [mc-navbar-item], mc-navbar-divider, mc-navbar-brand, [mc-navbar-brand]", never, {}, {}, ["button"]>;
-}
-export declare const McNavbarMixinBase: CanDisableCtor & typeof McNavbarItemBase;
-export declare class McNavbarItem extends McNavbarMixinBase implements OnDestroy, CanDisable, AfterContentInit {
+export declare class McNavbarFocusableItem implements IFocusableOption, AfterContentInit, OnDestroy {
+    private elementRef;
+    private changeDetector;
     private focusMonitor;
-    elementRef: ElementRef;
-    button: McButtonCssStyler;
+    private ngZone;
+    title: McNavbarTitle;
+    button: McButton;
+    readonly onFocus: Subject<McNavbarFocusableItemEvent>;
+    readonly onBlur: Subject<McNavbarFocusableItemEvent>;
+    get hasFocus(): boolean;
+    set hasFocus(value: boolean);
+    private _hasFocus;
+    get disabled(): any;
+    set disabled(value: any);
+    private _disabled;
+    get tabIndex(): number;
+    constructor(elementRef: ElementRef<HTMLElement>, changeDetector: ChangeDetectorRef, focusMonitor: FocusMonitor, ngZone: NgZone);
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    onFocusHandler(): void;
+    focus(origin?: FocusOrigin): FocusOrigin | undefined;
+    blur(): void;
+    getLabel(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarFocusableItem, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarFocusableItem, "mc-navbar-item, [mc-navbar-item], mc-navbar-brand, [mc-navbar-brand], mc-navbar-toggle", never, { "disabled": "disabled"; }, {}, ["title", "button"]>;
+}
+export declare class McNavbarItem extends McTooltipTrigger {
+    rectangleElement: McNavbarRectangleElement;
+    private changeDetectorRef;
+    private dropdownTrigger;
+    private bento;
     title: McNavbarTitle;
+    subTitle: McNavbarSubTitle;
     icon: McIcon;
+    collapsedText: string;
+    get collapsed(): boolean;
+    set collapsed(value: boolean);
+    private _collapsed;
+    get croppedText(): string;
     get collapsable(): boolean;
     set collapsable(value: boolean);
     private _collapsable;
-    collapsed: boolean;
-    get collapsedTitle(): string | null;
-    set collapsedTitle(value: string | null);
-    private _collapsedTitle;
-    get tabIndex(): number;
-    set tabIndex(value: number);
-    private _tabIndex;
-    constructor(focusMonitor: FocusMonitor, elementRef: ElementRef);
-    ngOnDestroy(): void;
+    get titleText(): string | null;
+    get subTitleText(): string | null;
+    get disabled(): boolean;
+    get hasDropDownTrigger(): boolean;
+    get showVerticalDropDownAngle(): boolean;
+    get showHorizontalDropDownAngle(): boolean;
+    get hasCroppedText(): boolean;
+    constructor(rectangleElement: McNavbarRectangleElement, changeDetectorRef: ChangeDetectorRef, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, dropdownTrigger: McDropdownTrigger, bento: McNavbarBento);
     ngAfterContentInit(): void;
+    updateTooltip(): void;
     getTitleWidth(): number;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarItem, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarItem, "mc-navbar-item, [mc-navbar-item]", ["mcNavbarItem"], { "disabled": "disabled"; "collapsable": "collapsable"; "collapsed": "collapsed"; "collapsedTitle": "collapsedTitle"; }, {}, ["button", "title", "icon"], ["*"]>;
+    onKeyDown($event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarItem, [null, null, null, null, null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarItem, "mc-navbar-item, [mc-navbar-item]", ["mcNavbarItem"], { "collapsedText": "collapsedText"; "collapsed": "collapsed"; "collapsable": "collapsable"; }, {}, ["title", "subTitle", "icon"], ["[mc-icon]", "mc-navbar-title, [mc-navbar-title]", "mc-navbar-subtitle, [mc-navbar-subtitle]", "*"]>;
+}
+export declare class McNavbarRectangleElement {
+    elementRef: ElementRef;
+    readonly state: Subject<void>;
+    get horizontal(): boolean;
+    set horizontal(value: boolean);
+    private _horizontal;
+    get vertical(): boolean;
+    set vertical(value: boolean);
+    private _vertical;
+    get collapsed(): boolean;
+    set collapsed(value: boolean);
+    private _collapsed;
+    button: McButtonCssStyler;
+    constructor(elementRef: ElementRef);
+    getOuterElementWidth(): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarRectangleElement, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarRectangleElement, "mc-navbar-item, [mc-navbar-item], mc-navbar-divider, mc-navbar-brand, [mc-navbar-brand]", never, {}, {}, ["button"]>;
+}
+export declare class McNavbarToggle extends McTooltipTrigger implements OnDestroy {
+    navbar: McVerticalNavbar;
+    private changeDetectorRef;
+    private document;
+    customIcon: McIcon;
+    get content(): string | TemplateRef<any>;
+    set content(content: string | TemplateRef<any>);
+    get disabled(): boolean;
+    protected modifier: TooltipModifier;
+    constructor(navbar: McVerticalNavbar, changeDetectorRef: ChangeDetectorRef, overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, document: any);
+    onKeydown($event: KeyboardEvent): void;
+    ngOnDestroy(): void;
+    toggle: () => void;
+    private getWindow;
+    private windowToggleHandler;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarToggle, [null, null, null, null, null, null, null, null, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarToggle, "mc-navbar-toggle", never, { "content": "mcCollapsedTooltip"; }, {}, ["customIcon"], ["[mc-icon]", "mc-navbar-title"]>;
 }

package/navbar/navbar.component.d.ts

@@ -1,15 +1,42 @@
-import { AfterContentInit, AfterViewInit, ElementRef, OnDestroy, QueryList } from '@angular/core';
-import { Subject } from 'rxjs';
-import { McNavbarItem, McNavbarItemBase } from './navbar-item.component';
+import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ElementRef, OnDestroy, QueryList } from '@angular/core';
+import { FocusKeyManager } from '@ptsecurity/cdk/a11y';
+import { Observable, Subject } from 'rxjs';
+import { McNavbarFocusableItem, McNavbarFocusableItemEvent, McNavbarItem, McNavbarRectangleElement } from './navbar-item.component';
 import * as i0 from "@angular/core";
 export declare type McNavbarContainerPositionType = 'left' | 'right';
+export declare class McFocusableComponent implements AfterContentInit, OnDestroy {
+    protected changeDetectorRef: ChangeDetectorRef;
+    focusableItems: QueryList<McNavbarFocusableItem>;
+    keyManager: FocusKeyManager<McNavbarFocusableItem>;
+    get tabIndex(): any;
+    set tabIndex(value: any);
+    private _tabIndex;
+    get optionFocusChanges(): Observable<McNavbarFocusableItemEvent>;
+    get optionBlurChanges(): Observable<McNavbarFocusableItemEvent>;
+    protected readonly destroyed: Subject<void>;
+    private optionFocusSubscription;
+    private optionBlurSubscription;
+    constructor(changeDetectorRef: ChangeDetectorRef);
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    focus(): void;
+    blur(): void;
+    protected resetOptions(): void;
+    protected dropSubscriptions(): void;
+    private listenToOptionsFocus;
+    private updateTabIndex;
+    private isValidIndex;
+    private hasFocusedItem;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McFocusableComponent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<McFocusableComponent, never, never, { "tabIndex": "tabIndex"; }, {}, ["focusableItems"]>;
+}
 export declare class McNavbarContainer {
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarContainer, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McNavbarContainer, "mc-navbar-container", never, {}, {}, never>;
 }
-export declare class McNavbar implements AfterViewInit, AfterContentInit, OnDestroy {
+export declare class McNavbar extends McFocusableComponent implements AfterViewInit, AfterContentInit, OnDestroy {
     private elementRef;
-    navbarBaseItems: QueryList<McNavbarItemBase>;
+    rectangleElements: QueryList<McNavbarRectangleElement>;
     navbarItems: QueryList<McNavbarItem>;
     readonly resizeStream: Subject<Event>;
     private readonly resizeDebounceInterval;
@@ -17,14 +44,15 @@ export declare class McNavbar implements AfterViewInit, AfterContentInit, OnDest
     private get totalItemsWidth();
     private get collapsableItems();
     private resizeSubscription;
-    constructor(elementRef: ElementRef);
+    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef);
     ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
-    updateCollapsed: () => void;
+    onKeyDown(event: KeyboardEvent): void;
+    updateExpandedStateForItems: () => void;
     private collapseItems;
-    private unCollapseItems;
+    private expandItems;
     private setItemsState;
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbar, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbar, "mc-navbar", never, {}, {}, ["navbarBaseItems", "navbarItems"], ["[mc-navbar-container], mc-navbar-container"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbar, "mc-navbar", never, {}, {}, ["rectangleElements", "navbarItems"], ["[mc-navbar-container], mc-navbar-container"]>;
 }

package/navbar/navbar.module.d.ts

@@ -6,8 +6,9 @@ import * as i4 from "@angular/common";
 import * as i5 from "@angular/cdk/a11y";
 import * as i6 from "@angular/cdk/platform";
 import * as i7 from "@ptsecurity/mosaic/icon";
+import * as i8 from "@ptsecurity/mosaic/tooltip";
 export declare class McNavbarModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<McNavbarModule, [typeof i1.McNavbar, typeof i1.McNavbarContainer, typeof i2.McNavbarTitle, typeof i2.McNavbarItem, typeof i2.McNavbarBrand, typeof i2.McNavbarLogo, typeof i3.McNavbarToggle, typeof i3.McVerticalNavbar, typeof i2.McNavbarDivider, typeof i2.McNavbarItemBase], [typeof i4.CommonModule, typeof i5.A11yModule, typeof i6.PlatformModule, typeof i7.McIconModule], [typeof i1.McNavbar, typeof i1.McNavbarContainer, typeof i2.McNavbarTitle, typeof i2.McNavbarItem, typeof i2.McNavbarBrand, typeof i2.McNavbarLogo, typeof i3.McNavbarToggle, typeof i3.McVerticalNavbar, typeof i2.McNavbarDivider, typeof i2.McNavbarItemBase]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<McNavbarModule, [typeof i1.McNavbar, typeof i1.McNavbarContainer, typeof i2.McNavbarTitle, typeof i2.McNavbarItem, typeof i2.McNavbarBrand, typeof i2.McNavbarLogo, typeof i2.McNavbarToggle, typeof i3.McVerticalNavbar, typeof i2.McNavbarDivider, typeof i2.McNavbarFocusableItem, typeof i2.McNavbarRectangleElement, typeof i2.McNavbarSubTitle, typeof i2.McNavbarBento], [typeof i4.CommonModule, typeof i5.A11yModule, typeof i6.PlatformModule, typeof i7.McIconModule, typeof i8.McToolTipModule], [typeof i1.McNavbar, typeof i1.McNavbarContainer, typeof i2.McNavbarTitle, typeof i2.McNavbarItem, typeof i2.McNavbarBrand, typeof i2.McNavbarLogo, typeof i2.McNavbarToggle, typeof i3.McVerticalNavbar, typeof i2.McNavbarDivider, typeof i2.McNavbarFocusableItem, typeof i2.McNavbarRectangleElement, typeof i2.McNavbarSubTitle, typeof i2.McNavbarBento]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<McNavbarModule>;
 }

package/navbar/package.json

@@ -1,9 +1,9 @@
 {
-  "main": "../bundles/ptsecurity-mosaic-navbar.umd.js",
-  "module": "../fesm2015/ptsecurity-mosaic-navbar.js",
-  "es2015": "../fesm2015/ptsecurity-mosaic-navbar.js",
-  "esm2015": "../esm2015/navbar/ptsecurity-mosaic-navbar.js",
-  "fesm2015": "../fesm2015/ptsecurity-mosaic-navbar.js",
+  "module": "../fesm2015/ptsecurity-mosaic-navbar.mjs",
+  "es2020": "../fesm2020/ptsecurity-mosaic-navbar.mjs",
+  "esm2020": "../esm2020/navbar/ptsecurity-mosaic-navbar.mjs",
+  "fesm2020": "../fesm2020/ptsecurity-mosaic-navbar.mjs",
+  "fesm2015": "../fesm2015/ptsecurity-mosaic-navbar.mjs",
   "typings": "ptsecurity-mosaic-navbar.d.ts",
   "sideEffects": false,
   "name": "@ptsecurity/mosaic/navbar"

package/navbar/vertical-navbar.component.d.ts

@@ -1,34 +1,23 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { AfterContentInit, ElementRef, QueryList } from '@angular/core';
-import { CanDisableCtor, HasTabIndexCtor } from '@ptsecurity/mosaic/core';
-import { McIcon } from '@ptsecurity/mosaic/icon';
-import { McNavbarItemBase } from './navbar-item.component';
+import { AfterContentInit, ChangeDetectorRef, QueryList } from '@angular/core';
+import { Subject } from 'rxjs';
+import { McNavbarBento, McNavbarItem, McNavbarRectangleElement } from './navbar-item.component';
+import { McFocusableComponent } from './navbar.component';
 import * as i0 from "@angular/core";
-export declare class McVerticalNavbar implements AfterContentInit {
+export declare class McVerticalNavbar extends McFocusableComponent implements AfterContentInit {
+    rectangleElements: QueryList<McNavbarRectangleElement>;
+    items: QueryList<McNavbarItem>;
+    bento: McNavbarBento;
+    readonly animationDone: Subject<void>;
     get expanded(): boolean;
     set expanded(value: boolean);
     private _expanded;
-    navbarBaseItems: QueryList<McNavbarItemBase>;
-    toggle(): void;
+    constructor(changeDetectorRef: ChangeDetectorRef);
     ngAfterContentInit(): void;
-    private setClosedStateForItems;
+    toggle(): void;
+    onKeyDown(event: KeyboardEvent): void;
+    private updateExpandedStateForItems;
+    private updateTooltipForItems;
     private setItemsState;
     static ɵfac: i0.ɵɵFactoryDeclaration<McVerticalNavbar, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McVerticalNavbar, "mc-vertical-navbar", ["McVerticalNavbar"], { "expanded": "expanded"; }, {}, ["navbarBaseItems"], ["[mc-navbar-container], mc-navbar-container", "[mc-navbar-toggle], mc-navbar-toggle"]>;
-}
-export declare class McNavbarToggleBase {
-    _elementRef: ElementRef;
-    constructor(_elementRef: ElementRef);
-}
-export declare const McNavbarToggleMixinBase: HasTabIndexCtor & CanDisableCtor & typeof McNavbarToggleBase;
-export declare class McNavbarToggle extends McNavbarToggleMixinBase {
-    mcNavbar: McVerticalNavbar;
-    private focusMonitor;
-    private elementRef;
-    customIcon: McIcon;
-    constructor(mcNavbar: McVerticalNavbar, focusMonitor: FocusMonitor, elementRef: ElementRef);
-    ngOnDestroy(): void;
-    ngAfterContentInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarToggle, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarToggle, "mc-navbar-toggle", never, { "tabIndex": "tabIndex"; }, {}, ["customIcon"], ["[mc-icon]", "mc-navbar-title"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McVerticalNavbar, "mc-vertical-navbar", ["McVerticalNavbar"], { "expanded": "expanded"; }, {}, ["bento", "rectangleElements", "items"], ["[mc-navbar-container], mc-navbar-container", "[mc-navbar-toggle], mc-navbar-toggle"]>;
 }