@covalent/core 8.1.0 → 8.2.0-beta.1

package/fesm2022/covalent-core-user-profile.mjs

@@ -20,10 +20,10 @@ class TdUserProfileMenuComponent {
         event.preventDefault();
         event.stopPropagation();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: TdUserProfileMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: TdUserProfileMenuComponent, selector: "td-user-profile-menu", inputs: { email: "email", name: "name" }, ngImport: i0, template: "<td-menu class=\"user-profile-menu\">\n  <!--header-->\n  <mat-list td-menu-header>\n    <mat-list-item *ngIf=\"name || email\" (click)=\"_blockEvent($event)\">\n      <mat-icon matListItemAvatar>person</mat-icon>\n      <span matListItemLine *ngIf=\"name\" class=\"mat-body-1\">{{ name }}</span>\n      <span matListItemLine *ngIf=\"email\">{{ email }}</span>\n    </mat-list-item>\n    <ng-content select=\"[td-user-info-list]\"></ng-content>\n  </mat-list>\n  <!--content-->\n  <mat-action-list>\n    <ng-content select=\"[td-user-action-list]\"></ng-content>\n  </mat-action-list>\n</td-menu>\n", styles: [".user-profile-menu [td-menu-header]{text-align:left;padding-bottom:0}::ng-deep mat-list-item:not(:first-child) .mat-list-item-content .mat-icon[matListItemAvatar],::ng-deep [mat-list-item] .mat-list-item-content .mat-icon[matListItemAvatar]{background:none}.mat-action-list{padding-top:0}:host ::ng-deep .mat-action-list .mat-divider,:host ::ng-deep .mat-divider{margin:8px 0}:host ::ng-deep mat-divider:last-child{display:none}:host ::ng-deep mat-list .mat-list-item.mat-2-line .mat-list-item-content{height:inherit}:host ::ng-deep mat-list .mat-list-item .mat-list-item-content{padding:8px}td-menu{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3.MatActionList, selector: "mat-action-list", exportAs: ["matActionList"] }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i3.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i3.MatListItemLine, selector: "[matListItemLine]" }, { kind: "component", type: i4.TdMenuComponent, selector: "td-menu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: TdUserProfileMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: TdUserProfileMenuComponent, selector: "td-user-profile-menu", inputs: { email: "email", name: "name" }, ngImport: i0, template: "<td-menu class=\"user-profile-menu\">\n  <!--header-->\n  <mat-list td-menu-header>\n    <mat-list-item *ngIf=\"name || email\" (click)=\"_blockEvent($event)\">\n      <mat-icon matListItemAvatar>person</mat-icon>\n      <span matListItemLine *ngIf=\"name\" class=\"mat-body-1\">{{ name }}</span>\n      <span matListItemLine *ngIf=\"email\">{{ email }}</span>\n    </mat-list-item>\n    <ng-content select=\"[td-user-info-list]\"></ng-content>\n  </mat-list>\n  <!--content-->\n  <mat-action-list>\n    <ng-content select=\"[td-user-action-list]\"></ng-content>\n  </mat-action-list>\n</td-menu>\n", styles: [".user-profile-menu [td-menu-header]{text-align:left;padding-bottom:0}::ng-deep mat-list-item:not(:first-child) .mat-list-item-content .mat-icon[matListItemAvatar],::ng-deep [mat-list-item] .mat-list-item-content .mat-icon[matListItemAvatar]{background:none}.mat-action-list{padding-top:0}:host ::ng-deep .mat-action-list .mat-divider,:host ::ng-deep .mat-divider{margin:8px 0}:host ::ng-deep mat-divider:last-child{display:none}:host ::ng-deep mat-list .mat-list-item.mat-2-line .mat-list-item-content{height:inherit}:host ::ng-deep mat-list .mat-list-item .mat-list-item-content{padding:8px}td-menu{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3.MatActionList, selector: "mat-action-list", exportAs: ["matActionList"] }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i3.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i3.MatListItemLine, selector: "[matListItemLine]" }, { kind: "component", type: i4.TdMenuComponent, selector: "td-menu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: TdUserProfileMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: TdUserProfileMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'td-user-profile-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<td-menu class=\"user-profile-menu\">\n  <!--header-->\n  <mat-list td-menu-header>\n    <mat-list-item *ngIf=\"name || email\" (click)=\"_blockEvent($event)\">\n      <mat-icon matListItemAvatar>person</mat-icon>\n      <span matListItemLine *ngIf=\"name\" class=\"mat-body-1\">{{ name }}</span>\n      <span matListItemLine *ngIf=\"email\">{{ email }}</span>\n    </mat-list-item>\n    <ng-content select=\"[td-user-info-list]\"></ng-content>\n  </mat-list>\n  <!--content-->\n  <mat-action-list>\n    <ng-content select=\"[td-user-action-list]\"></ng-content>\n  </mat-action-list>\n</td-menu>\n", styles: [".user-profile-menu [td-menu-header]{text-align:left;padding-bottom:0}::ng-deep mat-list-item:not(:first-child) .mat-list-item-content .mat-icon[matListItemAvatar],::ng-deep [mat-list-item] .mat-list-item-content .mat-icon[matListItemAvatar]{background:none}.mat-action-list{padding-top:0}:host ::ng-deep .mat-action-list .mat-divider,:host ::ng-deep .mat-divider{margin:8px 0}:host ::ng-deep mat-divider:last-child{display:none}:host ::ng-deep mat-list .mat-list-item.mat-2-line .mat-list-item-content{height:inherit}:host ::ng-deep mat-list .mat-list-item .mat-list-item-content{padding:8px}td-menu{margin-bottom:0}\n"] }]
         }], propDecorators: { email: [{
@@ -35,10 +35,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
 class TdUserProfileComponent {
     name;
     email;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: TdUserProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: TdUserProfileComponent, selector: "td-user-profile", inputs: { name: "name", email: "email" }, ngImport: i0, template: "<button mat-icon-button [matMenuTriggerFor]=\"accountMenu\">\n  <mat-icon>person</mat-icon>\n</button>\n\n<mat-menu #accountMenu=\"matMenu\" [overlapTrigger]=\"false\">\n  <td-user-profile-menu [name]=\"name\" [email]=\"email\">\n    <ng-content select=\"[td-user-info-list]\" td-user-info-list></ng-content>\n    <ng-content select=\"[td-user-action-list]\" td-user-action-list></ng-content>\n  </td-user-profile-menu>\n</mat-menu>\n", dependencies: [{ kind: "component", type: i1$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i1$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: TdUserProfileMenuComponent, selector: "td-user-profile-menu", inputs: ["email", "name"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: TdUserProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: TdUserProfileComponent, selector: "td-user-profile", inputs: { name: "name", email: "email" }, ngImport: i0, template: "<button mat-icon-button [matMenuTriggerFor]=\"accountMenu\">\n  <mat-icon>person</mat-icon>\n</button>\n\n<mat-menu #accountMenu=\"matMenu\" [overlapTrigger]=\"false\">\n  <td-user-profile-menu [name]=\"name\" [email]=\"email\">\n    <ng-content select=\"[td-user-info-list]\" td-user-info-list></ng-content>\n    <ng-content select=\"[td-user-action-list]\" td-user-action-list></ng-content>\n  </td-user-profile-menu>\n</mat-menu>\n", dependencies: [{ kind: "component", type: i1$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i1$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: TdUserProfileMenuComponent, selector: "td-user-profile-menu", inputs: ["email", "name"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: TdUserProfileComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: TdUserProfileComponent, decorators: [{
             type: Component,
             args: [{ selector: 'td-user-profile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button mat-icon-button [matMenuTriggerFor]=\"accountMenu\">\n  <mat-icon>person</mat-icon>\n</button>\n\n<mat-menu #accountMenu=\"matMenu\" [overlapTrigger]=\"false\">\n  <td-user-profile-menu [name]=\"name\" [email]=\"email\">\n    <ng-content select=\"[td-user-info-list]\" td-user-info-list></ng-content>\n    <ng-content select=\"[td-user-action-list]\" td-user-action-list></ng-content>\n  </td-user-profile-menu>\n</mat-menu>\n" }]
         }], propDecorators: { name: [{
@@ -48,21 +48,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
             }] } });
 
 class CovalentUserProfileModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: CovalentUserProfileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.4", ngImport: i0, type: CovalentUserProfileModule, declarations: [TdUserProfileComponent, TdUserProfileMenuComponent], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: CovalentUserProfileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.2", ngImport: i0, type: CovalentUserProfileModule, declarations: [TdUserProfileComponent, TdUserProfileMenuComponent], imports: [CommonModule,
             MatMenuModule,
             MatIconModule,
             MatButtonModule,
             MatListModule,
             CovalentMenuModule], exports: [TdUserProfileComponent, TdUserProfileMenuComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: CovalentUserProfileModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: CovalentUserProfileModule, imports: [CommonModule,
             MatMenuModule,
             MatIconModule,
             MatButtonModule,
             MatListModule,
             CovalentMenuModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: CovalentUserProfileModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: CovalentUserProfileModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [TdUserProfileComponent, TdUserProfileMenuComponent],

package/layout/_layout-theme.scss

@@ -55,6 +55,9 @@
   td-layout-card-over,
   td-navigation-drawer,
   td-layout {
+    --mat-sidenav-container-background-color: var(--mat-sidenav-content-background-color);
+    --mat-expansion-container-background-color: var(--mat-sidenav-content-background-color);
+
     mat-toolbar {
       @include mat-elevation(1);
 
@@ -90,8 +93,6 @@
   }
 
   .td-layout-footer {
-    background: mat-color($background, app-bar);
-    color: mat-color($foreground, text);
     @include mat-elevation(2);
 
     &.mat-primary {
@@ -99,7 +100,7 @@
 
       &,
       mat-icon {
-        color: mat-color($primary, default-contrast);
+        color: mat-color($primary);
       }
     }
 
@@ -108,7 +109,7 @@
 
       &,
       mat-icon {
-        color: mat-color($accent, default-contrast);
+        color: mat-color($accent);
       }
     }
 
@@ -117,12 +118,12 @@
 
       &,
       mat-icon {
-        color: mat-color($warn, default-contrast);
+        color: mat-color($warn);
       }
     }
 
     .mat-mdc-button {
-      --mdc-text-button-label-text-color: mat-color($foreground, text);
+      --mdc-text-button-label-text-color: #{mat-color($foreground, text)};
     }
   }
 }

package/layout/layout-card-over/layout-card-over.component.d.ts

@@ -25,7 +25,7 @@ export declare class TdLayoutCardOverComponent {
      * toolbar color option: primary | accent | warn.
      * If [color] is not set, primary is used.
      */
-    color: 'accent' | 'primary' | 'warn';
+    color?: 'accent' | 'primary' | 'warn';
     static ɵfac: i0.ɵɵFactoryDeclaration<TdLayoutCardOverComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<TdLayoutCardOverComponent, "td-layout-card-over", never, { "cardTitle": { "alias": "cardTitle"; "required": false; }; "cardSubtitle": { "alias": "cardSubtitle"; "required": false; }; "cardWidth": { "alias": "cardWidth"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, ["*", "[td-after-card]"], false, never>;
 }

package/layout/navigation-drawer/navigation-drawer.component.d.ts

@@ -65,7 +65,7 @@ export declare class TdNavigationDrawerComponent implements OnInit, OnDestroy {
      * toolbar color option: primary | accent | warn.
      * If [color] is not set, default is used.
      */
-    color: 'accent' | 'primary' | 'warn';
+    color?: 'accent' | 'primary' | 'warn';
     /**
      * navigationRoute?: string
      *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@covalent/core",
-  "version": "8.1.0",
+  "version": "8.2.0-beta.1",
   "exports": {
     ".": {
       "sass": "./theming/_all-theme.scss",
@@ -107,7 +107,7 @@
     "@angular/router": "17.x.x",
     "@angular/cdk": "17.x.x",
     "@angular/material": "17.x.x",
-    "@covalent/core": "8.1.0"
+    "@covalent/core": "8.2.0-beta.1"
   },
   "dependencies": {
     "tslib": "^2.0.0"