@microsoft/windows-admin-center-sdk 2.508.0 → 2.510.0

package/angular/src/controls/header/header.component.d.ts

@@ -1,4 +1,5 @@
-import { OnInit } from '@angular/core';
+import { Injector, OnInit } from '@angular/core';
+import { CoreBaseComponent } from '../common/base.component';
 import * as i0 from "@angular/core";
 /**
  *
@@ -12,22 +13,33 @@ import * as i0 from "@angular/core";
  * @file {@filename component.html @filepath ./examples/header-example.component.html}
  *
  */
-export declare class HeaderComponent implements OnInit {
+export declare class HeaderComponent extends CoreBaseComponent implements OnInit {
+    /**
+     * The source name to use for logging
+     */
+    protected get logSourceName(): string;
     private static tool;
     private static h1style;
     private static h2style;
     private static h3style;
     private static h4style;
-    private static h5style;
-    private static h6style;
     styleTo: string;
     type: string;
     text: string;
     level: string;
+    /**
+     * The sme icon class for MDL icons
+     */
+    smeIconClassName: string;
+    /**
+     * The sme icon class for URL icons
+     */
+    urlIcon: string;
+    constructor(injector: Injector);
     /**
      * The method run when the component is initialized
      */
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDef<HeaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<HeaderComponent, "sme-header", never, { "type": "type"; "text": "text"; "level": "level"; }, {}, never, ["*", "*"]>;
+    static ɵcmp: i0.ɵɵComponentDefWithMeta<HeaderComponent, "sme-header", never, { "type": "type"; "text": "text"; "level": "level"; "smeIconClassName": "smeIconClassName"; "urlIcon": "urlIcon"; }, {}, never, ["*"]>;
 }

package/angular/src/controls/layout/index.d.ts

@@ -1,3 +1,4 @@
+export { LayoutItemConfig, LayoutItemConfigPropertyWidth, LayoutItemConfigPropertyWidthType, LayoutConfig, LayoutConfigItem, LayoutItemConfigMode, LayoutDrivenType, LayoutConfigGenerator } from './layout-config';
 export { EditableLayoutItemComponent } from './editable-layout-item.component';
 export { EditableLayoutComponent } from './editable-layout.component';
 export { LayoutComponent } from './layout.component';

package/angular/src/controls/layout/layout-config.d.ts

@@ -0,0 +1,53 @@
+import { SmeResponsiveWindowBreakpoints } from '../common/sme-responsive-window-manager.component';
+export interface LayoutItemConfig {
+    width: LayoutItemConfigPropertyWidth;
+}
+export interface LayoutItemConfigPropertyWidth {
+    type: LayoutItemConfigPropertyWidthType;
+    value: number;
+}
+export declare enum LayoutItemConfigPropertyWidthType {
+    Percentage = "Percentage",
+    Number = "Number"
+}
+export interface LayoutConfig {
+    [SmeResponsiveWindowBreakpoints.PhoneUp]?: LayoutConfigItem;
+    [SmeResponsiveWindowBreakpoints.PhoneDown]?: LayoutConfigItem;
+    [SmeResponsiveWindowBreakpoints.Reflow]?: LayoutConfigItem;
+}
+export interface LayoutConfigItem {
+    mode?: LayoutItemConfigMode;
+    config?: LayoutItemConfig[];
+}
+export declare enum LayoutItemConfigMode {
+    Default = "Default",
+    Custom = "Custom"
+}
+export declare enum LayoutDrivenType {
+    Default = "Default",
+    ResponsiveWindowManager = "ResponsiveWindowManager"
+}
+/**
+ * The layout config generator.
+ *
+ * It determines the configurable width for the layout item.
+ * Usage:
+ *
+ * const layoutConfigGenerator = new LayoutConfigGenerator();
+ * layoutConfigGenerator.initialize([20, '100'])
+ *
+ * type number is used for pixel.
+ * type string is used for percentage.
+ */
+export declare class LayoutConfigGenerator {
+    /**
+     * It initialized the layout configs for the layout component.
+     *
+     * @param phoneUp the layout config array for phone-up
+     * @param phoneDown the layout config array for phone-down
+     * @param reflow the layout config array for reflow
+     * @returns
+     */
+    initialize(phoneUp: any[], phoneDown?: any[], reflow?: any[]): LayoutConfig;
+    private parseConfig;
+}

package/angular/src/controls/layout/layout-item.component.d.ts

@@ -1,5 +1,6 @@
 import { Injector, OnInit } from '@angular/core';
 import { CoreBaseComponent } from '../common/base.component';
+import { LayoutItemConfig } from './layout-config';
 import * as i0 from "@angular/core";
 /**
  * Layout component
@@ -13,16 +14,19 @@ export declare class LayoutItemComponent extends CoreBaseComponent implements On
     width: string;
     paddingRight: string;
     paddingBottom: string;
+    flex: string;
+    minWidth: string;
     /**
      * The number of columns that this item should span at maximum
      */
     columnSpan: number;
     caption: string;
     get maxWidth(): number;
+    customConfig: LayoutItemConfig;
     set maxWidth(value: number);
     constructor(injector: Injector);
     ngOnInit(): void;
     ready(): void;
     static ɵfac: i0.ɵɵFactoryDef<LayoutItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<LayoutItemComponent, "sme-layout-item", never, { "columnSpan": "columnSpan"; "caption": "caption"; "maxWidth": "maxWidth"; }, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDefWithMeta<LayoutItemComponent, "sme-layout-item", never, { "columnSpan": "columnSpan"; "caption": "caption"; "customConfig": "customConfig"; "maxWidth": "maxWidth"; }, {}, never, ["*"]>;
 }

package/angular/src/controls/layout/layout-responsive-window-manager.d.ts

@@ -0,0 +1,5 @@
+import { SmeResponsiveWindowManagerComponent } from '../common/sme-responsive-window-manager.component';
+export declare class LayoutResponsiveWindowManager extends SmeResponsiveWindowManagerComponent {
+    readonly name = "sme-layout";
+    onWindowSizeChanged(): void;
+}

package/angular/src/controls/layout/layout.component.d.ts

@@ -1,41 +1,133 @@
-import { AfterViewInit, EventEmitter, Injector } from '@angular/core';
+import { AfterViewInit, EventEmitter, Injector, QueryList } from '@angular/core';
 import { CoreBaseComponent } from '../common/base.component';
 import { Layout } from '../common/layout';
+import { SmeResponsiveWindowBreakpoints } from '../common/sme-responsive-window-manager.component';
+import { LayoutConfig, LayoutDrivenType } from './layout-config';
 import { LayoutDefinitionComponent } from './layout-definition.component';
+import { LayoutItemComponent } from './layout-item.component';
 import * as i0 from "@angular/core";
 /**
  * Layout component
  */
 export declare class LayoutComponent extends CoreBaseComponent implements AfterViewInit {
-    private layout;
     /**
      * The source name to use for logging
      */
     protected get logSourceName(): string;
+    /**
+     * The layout items content children.
+     */
     private layoutItems;
+    /**
+     * The layout definition content children.
+     */
     private definitions;
+    /**
+     * The current layout definition value based on custom layout definition and the browser window size.
+     */
     currentLayoutDefinition: LayoutDefinitionComponent;
+    /**
+     * The default horizontal space in between layout items.
+     */
     itemHorizontalSpace: number;
+    /**
+     * The default vertical space in between layout items.
+     */
     itemVerticalSpace: number;
+    /**
+     * If true, will always try to fill the whole row for each layout item.
+     */
     tryToFillWholeRow: boolean;
+    /**
+     * The layout definition.
+     */
     definition: {
         [columnCount: number]: {
             lowerWidth?: number;
             upperWidth?: number;
         };
     };
+    /**
+     * If false, it will not assign extra paddings to the right for the last layout item.
+     */
     padLastItem: boolean;
+    /**
+     * If true, not extra right padding when there is only one item that uses the whole width of the row.
+     */
     noExtraRightPaddingOneItemPerRow: boolean;
+    /**
+     * It determines whether the layout is for settings where it contains a left and right layout item.
+     * If true, will apply special design for settings layout.
+     * On phone-up, the left side navigation layout item will be using a fixed width by default 300px,
+     * the right side layout item will be using the remaining width by default.
+     *
+     * On phone-down or 400% zoom, nothing is different from the regular settings page,
+     * the left right layout will be transformed to top bottom layout.
+     */
+    layoutConfig: LayoutConfig;
+    /**
+     * Implementation of the Layout interface
+     */
     layoutChanged: EventEmitter<void>;
+    /**
+     * Implementation of the Layout interface
+     */
+    windowBreakpointChanged: EventEmitter<void>;
+    private columnCount;
+    private columnSpanTotal;
+    private layoutResponsiveWindowManager;
+    private layoutDrivenType;
+    private currentLayoutItemConfig;
+    private readonly stylePixel;
     get currentLayoutDefinitionName(): string;
+    get currentLayoutDrivenType(): LayoutDrivenType;
+    get currentWindowBreakpoint(): SmeResponsiveWindowBreakpoints;
+    get currentLayoutItems(): QueryList<LayoutItemComponent>;
     constructor(injector: Injector, layout: Layout);
     ngAfterViewInit(): void;
+    /**
+     * The open API for refreshing the control externally.
+     */
+    refresh(): void;
     /**
      * On layout changed event handler, occurs every time the layout has been changed.
      */
     onLayoutChanged(): void;
+    /**
+     * The deferred layout changed handler.
+     */
+    private deferredOnLayoutChanged;
+    /**
+     * The on window breakpoint changed handler.
+     * Adding yield for component to get ElementRef after initialization.
+     */
+    onWindowBreakpointChanged(): void;
     protected getInitialHostClasses(): string[];
     protected updateLayout(): void;
+    private updateLayoutConfig;
+    private resetFlex;
+    private setLayoutDrivenType;
+    private getTotalColumnSpan;
+    private updateCurrentLayoutDefinition;
+    private layoutDefinitionWithColumnSpanCalculation;
+    private configDrivenCalculation;
+    /**
+     * It deal with configurations that only has either percentage or number.
+     * Aiming at performance optimization.
+     *
+     * @param layoutItems The layout item object array
+     * @param availableLayoutWidthInPixel available width in pixel horizontally.
+     */
+    private configDrivenCalculationDefault;
+    /**
+     * It deal with configurations that only has both percentage and number.
+     * Aiming at performance optimization.
+     *
+     * @param layoutItems The layout item object array
+     * @param availableLayoutWidthInPixel available width in pixel horizontally.
+     */
+    private configDrivenCalculationHybrid;
+    private updateCustomConfig;
     static ɵfac: i0.ɵɵFactoryDef<LayoutComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<LayoutComponent, "sme-layout", never, { "itemHorizontalSpace": "itemHorizontalSpace"; "itemVerticalSpace": "itemVerticalSpace"; "tryToFillWholeRow": "tryToFillWholeRow"; "definition": "definition"; "padLastItem": "padLastItem"; "noExtraRightPaddingOneItemPerRow": "noExtraRightPaddingOneItemPerRow"; }, { "layoutChanged": "layoutChanged"; }, ["layoutItems", "definitions"], ["sme-layout-item"]>;
+    static ɵcmp: i0.ɵɵComponentDefWithMeta<LayoutComponent, "sme-layout", never, { "itemHorizontalSpace": "itemHorizontalSpace"; "itemVerticalSpace": "itemVerticalSpace"; "tryToFillWholeRow": "tryToFillWholeRow"; "definition": "definition"; "padLastItem": "padLastItem"; "noExtraRightPaddingOneItemPerRow": "noExtraRightPaddingOneItemPerRow"; "layoutConfig": "layoutConfig"; }, { "layoutChanged": "layoutChanged"; "windowBreakpointChanged": "windowBreakpointChanged"; }, ["layoutItems", "definitions"], ["sme-layout-item"]>;
 }

package/angular/src/controls/property-grid/property-grid.component.d.ts

@@ -62,6 +62,10 @@ export declare class PropertyGridComponent extends CoreBaseComponent implements
      * Implementation of the Layout interface
      */
     layoutChanged: EventEmitter<void>;
+    /**
+     * Implementation of the Layout interface
+     */
+    windowBreakpointChanged: EventEmitter<void>;
     private propertyGridResponsiveWindowManager;
     constructor(injector: Injector, layout: Layout);
     stringifyValue(value: any): any;
@@ -85,5 +89,5 @@ export declare class PropertyGridComponent extends CoreBaseComponent implements
      */
     protected getInitialHostClasses(): string[];
     static ɵfac: i0.ɵɵFactoryDef<PropertyGridComponent, [null, { optional: true; skipSelf: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<PropertyGridComponent, "sme-property-grid", never, { "orientation": "orientation"; }, { "layoutChanged": "layoutChanged"; }, ["items"], never>;
+    static ɵcmp: i0.ɵɵComponentDefWithMeta<PropertyGridComponent, "sme-property-grid", never, { "orientation": "orientation"; }, { "layoutChanged": "layoutChanged"; "windowBreakpointChanged": "windowBreakpointChanged"; }, ["items"], never>;
 }

package/angular/src/controls/settings/settings.component.d.ts

@@ -4,6 +4,7 @@ import { ActivatedRouteSnapshot, NavigationExtras, RouterStateSnapshot } from '@
 import { Observable } from 'rxjs';
 import { CoreBaseComponent } from '../common/base.component';
 import { DialogService } from '../dialog/dialog.service';
+import { LayoutConfig, LayoutConfigGenerator } from '../layout/layout-config';
 import { CanComponentDeactivate } from './settings-can-deactivate-guard.service';
 import { SettingsFormService } from './settings-form.service';
 import * as i0 from "@angular/core";
@@ -67,6 +68,14 @@ export declare class SettingsComponent extends CoreBaseComponent implements OnIn
     fullSettingsTitle: string;
     settingsForms: SettingsFormService;
     dialogService: DialogService;
+    /**
+     * The current layout config for custom config 1.
+     */
+    currentLayoutConfig: LayoutConfig;
+    /**
+     * The generator for layout config.
+     */
+    layoutConfigGenerator: LayoutConfigGenerator;
     private autoFocus;
     constructor(injector: Injector);
     ngOnInit(): void;