@covalent/core 3.1.2 → 4.0.0-beta.2

package/common/styles/core/_button.scss

@@ -34,6 +34,7 @@ $mat-icon-border-radius: $mat-fab-border-radius;
 
     bottom: $bottom;
     position: absolute;
+
     &.fixed {
       position: fixed;
     }
@@ -41,7 +42,7 @@ $mat-icon-border-radius: $mat-fab-border-radius;
 }
 
 @mixin td-button-utilities() {
-  $mat-fab-pos-offset: ($mat-fab-size - $mat-fab-padding) / 2;
+  $mat-fab-pos-offset: calc(($mat-fab-size - $mat-fab-padding) / 2);
   @include mat-fab-position(bottom-right, auto, $mat-fab-pos-offset, $mat-fab-pos-offset, auto);
   @include mat-fab-position(bottom-left, auto, auto, $mat-fab-pos-offset, $mat-fab-pos-offset);
   @include mat-fab-position(top-right, $mat-fab-pos-offset, $mat-fab-pos-offset, auto, auto);

package/common/styles/core/_card.scss

@@ -12,16 +12,18 @@
   text-shadow: makelongshadow($color);
 }
 
-$color: rgba(0, 0, 0, 0.01);
+$color: rgba(0, 0, 0, 1%);
 
 @mixin td-card-utilities() {
   html {
     .mat-card {
       padding: 0;
       margin: 8px;
+
       mat-card-header {
         height: auto;
       }
+
       [matCardAvatar] {
         font-size: $mat-card-header-size;
         line-height: $mat-card-header-size;
@@ -30,9 +32,11 @@ $color: rgba(0, 0, 0, 0.01);
         margin: 16px 0 0 15px;
         border-radius: 50%;
       }
+
       .mat-card-image {
         width: 100%;
       }
+
       .mat-card-image,
       .mat-card-lg-image,
       .mat-card-md-image,
@@ -40,33 +44,40 @@ $color: rgba(0, 0, 0, 0.01);
       .mat-card-title-group {
         margin: 0;
       }
+
       mat-card-title {
         padding-top: $padding;
         padding-left: $padding;
         padding-right: $padding;
       }
+
       mat-card-subtitle {
         padding-left: $padding;
         padding-right: $padding;
       }
+
       mat-card-content {
         padding: $padding;
       }
+
       &,
       & .mat-card {
         & .mat-card-actions {
-          padding: $padding / 2;
+          padding: calc($padding / 2);
           margin: 0;
         }
       }
+
       .mat-card-actions:last-child {
         margin-bottom: 0;
         padding-bottom: 8px;
       }
+
       .mat-divider.relative {
         position: relative;
       }
     }
+
     &[dir='rtl'] {
       .mat-card-title-group {
         .mat-card-image,
@@ -79,6 +90,7 @@ $color: rgba(0, 0, 0, 0.01);
           }
         }
       }
+
       .mat-card {
         .mat-card-image {
           &:first-child {
@@ -86,6 +98,7 @@ $color: rgba(0, 0, 0, 0.01);
             border-top-right-radius: $mat-card-radius;
           }
         }
+
         .mat-card-lg-image,
         .mat-card-md-image,
         .mat-card-sm-image {
@@ -95,6 +108,7 @@ $color: rgba(0, 0, 0, 0.01);
         }
       }
     }
+
     &:not([dir='rtl']) {
       .mat-card-title-group {
         .mat-card-image,
@@ -107,6 +121,7 @@ $color: rgba(0, 0, 0, 0.01);
           }
         }
       }
+
       .mat-card {
         .mat-card-image {
           &:first-child {
@@ -114,6 +129,7 @@ $color: rgba(0, 0, 0, 0.01);
             border-top-right-radius: $mat-card-radius;
           }
         }
+
         .mat-card-lg-image,
         .mat-card-md-image,
         .mat-card-sm-image {
@@ -130,23 +146,27 @@ $color: rgba(0, 0, 0, 0.01);
     &[ng-reflect-href] {
       &:hover {
         cursor: pointer;
-        box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
+        box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 20%), 0 4px 5px 0 rgba(0, 0, 0, 14%), 0 1px 10px 0 rgba(0, 0, 0, 12%);
       }
+
       &:active {
-        box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
-          0 4px 18px 3px rgba(0, 0, 0, 0.12);
+        box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 20%), 0 10px 14px 1px rgba(0, 0, 0, 14%),
+          0 4px 18px 3px rgba(0, 0, 0, 12%);
+
         & mat-toolbar {
-          background-color: rgba(255, 255, 255, 0.2);
+          background-color: rgba(255, 255, 255, 20%);
           background-position: -100% 100%;
         }
       }
+
       & mat-toolbar {
         background-size: 200% 100%;
-        background-image: linear-gradient(to right, transparent 50%, rgba(255, 255, 255, 0.2) 50%);
+        background-image: linear-gradient(to right, transparent 50%, rgba(255, 255, 255, 20%) 50%);
         transition: background-position 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0.1s, color 0.5s ease 0s,
           background-color 0.5s ease;
       }
     }
+
     & mat-toolbar {
       height: 148px;
       border-radius: 2px 2px 0 0;

package/common/styles/core/_content.scss

@@ -15,6 +15,7 @@
       overflow-y: auto;
       overflow-x: hidden;
     }
+
     &[md-scroll-x],
     &.mat-scroll-x {
       overflow-x: auto;
@@ -22,7 +23,7 @@
     }
     // For iOS allow disabling of momentum scrolling
     // @see issue #2640.
-    &.autoScroll {
+    &.auto-scroll {
       -webkit-overflow-scrolling: auto;
     }
   }

package/common/styles/core/_divider.scss

@@ -7,6 +7,7 @@
       @include rtl(margin-left, 72px, 0);
       @include rtl(margin-right, 0, 72px);
     }
+
     &[mat-inset] {
       @include rtl(margin-left, 72px, 0);
       @include rtl(margin-right, 0, 72px);

package/common/styles/core/_icons.scss

@@ -10,10 +10,12 @@
       }
     }
   }
+
   .mat-icon.mat-icon-logo {
     height: 24px;
     width: 100px;
   }
+
   .mat-icon {
     flex-shrink: 0;
   }

package/common/styles/core/_sidenav.scss

@@ -3,12 +3,14 @@
 @mixin td-sidenav-utilities() {
   mat-sidenav {
     width: $navigation-drawer-width;
+
     .mat-list-item-content {
       mat-icon {
         @include rtl(margin-left, 0, $margin);
         @include rtl(margin-right, $margin, 0);
       }
     }
+
     [mat-list-item] {
       &,
       &:active,

package/common/styles/core/_structure.scss

@@ -4,7 +4,7 @@
   html,
   body {
     height: 100%;
-    color: rgba(0, 0, 0, 0.87);
+    color: rgba(0, 0, 0, 87%);
     background: white;
     position: relative;
   }
@@ -45,7 +45,7 @@
   html input[type='button'],
   button {
     cursor: pointer;
-    -webkit-appearance: button;
+    appearance: button;
 
     &[disabled] {
       cursor: default;
@@ -59,13 +59,12 @@
 
   input {
     &[type='search'] {
-      -webkit-appearance: textfield;
+      appearance: textfield;
       box-sizing: content-box;
-      -webkit-box-sizing: content-box;
 
       &::-webkit-search-decoration,
       &::-webkit-search-cancel-button {
-        -webkit-appearance: none;
+        appearance: none;
       }
     }
   }
@@ -96,12 +95,12 @@
 
   .md-shadow-bottom-z-1,
   .mat-shadow-bottom-z-1 {
-    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
+    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 26%);
   }
 
   .md-shadow-bottom-z-2,
   .mat-shadow-bottom-z-2 {
-    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4);
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 40%);
   }
 
   .md-shadow-animated.md-shadow,

package/common/styles/core/_toolbar.scss

@@ -15,30 +15,37 @@
       height: 48px;
     }
   }
+
   mat-toolbar {
     [mat-button] {
       &:first-of-type:not(:last-child) {
         margin-left: -6px;
+
         [dir='rtl'] & {
           margin-right: -6px;
           margin-left: 0;
         }
       }
+
       &:last-of-type:not(:first-child) {
         margin-right: -6px;
+
         [dir='rtl'] & {
           margin-left: -6px;
           margin-right: 0;
         }
       }
     }
+
     .mat-icon-logo {
       margin-right: 10px;
+
       [dir='rtl'] & {
         margin-left: 10px;
         margin-right: 0;
       }
     }
+
     [mat-icon-button] {
       margin: 0 6px;
     }

package/common/styles/core/_whiteframe.scss

@@ -1,8 +1,8 @@
 // Elements can have an "elevation" from 1 to 5, signified by shadows.
 // See http://google.com/design/spec/what-is-material/objects-in-3d-space.html
 
-$mat-shadow-bottom-z-1: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
-$mat-shadow-bottom-z-2: 0 4px 8px 0 rgba(0, 0, 0, 0.4);
+$mat-shadow-bottom-z-1: 0 2px 5px 0 rgba(0, 0, 0, 26%);
+$mat-shadow-bottom-z-2: 0 4px 8px 0 rgba(0, 0, 0, 40%);
 
 // Whiteframes
 

package/common/styles/font/_font.scss

@@ -7,6 +7,7 @@ $mat-font-url: 'styles/font/' !default;
     font-weight: 400;
     src: url($mat-font-url + 'MaterialIcons-Regular-v48.woff2') format('woff2');
   }
+
   .material-icons {
     /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword */
     font-family: 'Material Icons';
@@ -52,18 +53,21 @@ $mat-font-url: 'styles/font/' !default;
     height: 18px;
     width: 18px;
   }
+
   .material-icons.md-24,
   .material-icons.mat-24 {
     font-size: 24px;
     height: 24px;
     width: 24px;
   }
+
   .material-icons.md-36,
   .material-icons.mat-36 {
     font-size: 36px;
     height: 36px;
     width: 36px;
   }
+
   .material-icons.md-48,
   .material-icons.mat-48 {
     font-size: 48px;
@@ -74,20 +78,22 @@ $mat-font-url: 'styles/font/' !default;
   // Rules for using icons as black on a light background.
   .material-icons.md-dark,
   .material-icons.mat-dark {
-    color: rgba(0, 0, 0, 0.54);
+    color: rgba(0, 0, 0, 54%);
   }
+
   .material-icons.md-dark.md-inactive,
   .material-icons.mat-dark.mat-inactive {
-    color: rgba(0, 0, 0, 0.26);
+    color: rgba(0, 0, 0, 26%);
   }
 
   // Rules for using icons as white on a dark background.
   .material-icons.md-light,
   .material-icons.mat-light {
-    color: rgba(255, 255, 255, 1);
+    color: rgba(255, 255, 255, 100%);
   }
+
   .material-icons.md-light.md-inactive,
   .material-icons.mat-light.mat-inactive {
-    color: rgba(255, 255, 255, 0.3);
+    color: rgba(255, 255, 255, 30%);
   }
 }

package/common/styles/utilities/_general.scss

@@ -4,46 +4,60 @@
     [tabindex]:focus {
       outline: none;
     }
+
     .radius-none {
       border-radius: 0;
     }
+
     .overflow-hidden {
       overflow: hidden;
     }
+
     .overflow-auto {
       overflow: auto;
     }
+
     .overflow-visible {
       overflow: visible;
     }
+
     .block {
       display: block;
     }
+
     .inline-block {
       display: inline-block;
     }
+
     .relative {
       position: relative;
     }
+
     .fixed {
       position: fixed;
     }
+
     .height-auto {
       min-height: 0;
     }
+
     .z-3 {
       z-index: 3;
     }
+
     .z-2 {
       z-index: 2;
     }
+
     .z-1 {
       z-index: 1;
     }
+
     .focus-weight:focus {
       outline: 0;
       font-weight: 700;
     }
+
     .cursor-pointer:hover {
       cursor: pointer;
     }

package/common/styles/utilities/_text.scss

@@ -10,73 +10,94 @@
         font-size: 60%;
       }
     }
+
     .text-normal {
       font-style: normal;
     }
+
     .text-center {
       text-align: center;
     }
+
     .text-left {
       text-align: left;
     }
+
     .text-right {
       text-align: right;
     }
+
     .text-xs,
     .text-sm,
     .text-md,
     .text-lg {
       text-rendering: optimizeLegibility;
     }
+
     .text-micro {
       font-size: 10px;
       font-weight: normal;
       letter-spacing: 1px;
     }
+
     .text-xs {
       font-size: 50%;
     }
+
     .text-sm {
       font-size: 70%;
     }
+
     .text-md {
       font-size: 80%;
     }
+
     .text-lg {
       font-size: 110%;
     }
+
     .text-xl {
       font-size: 120%;
     }
+
     .text-xxl {
       font-size: 130%;
     }
+
     .text-30 {
       font-size: 30px;
     }
+
     .text-super {
       font-size: 60px;
     }
+
     .text-wrap {
       white-space: normal;
     }
+
     .text-break {
       word-break: break-word;
     }
+
     .text-upper {
       text-transform: uppercase;
     }
+
     .text-lower {
       text-transform: lowercase;
     }
+
     .text-caps {
       text-transform: capitalize;
     }
+
     .text-truncate {
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
     }
+
     .text-nodecoration {
       text-decoration: none;
     }

package/covalent-core.d.ts

@@ -1,4 +1,5 @@
 /**
  * Generated bundle index. Do not edit.
  */
+/// <amd-module name="@covalent/core" />
 export * from './index';

package/dialogs/_dialog-theme.scss

@@ -9,6 +9,7 @@
       weight: td-font-weight($config, title);
     }
   }
+
   .td-dialog-message {
     font: {
       family: td-font-family($config);

package/dialogs/alert-dialog/alert-dialog.component.d.ts

@@ -1,4 +1,5 @@
 import { MatDialogRef } from '@angular/material/dialog';
+import * as i0 from "@angular/core";
 export declare class TdAlertDialogComponent {
     private _dialogRef;
     title: string;
@@ -6,4 +7,6 @@ export declare class TdAlertDialogComponent {
     closeButton: string;
     constructor(_dialogRef: MatDialogRef<TdAlertDialogComponent>);
     close(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdAlertDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdAlertDialogComponent, "td-alert-dialog", never, {}, {}, never, never>;
 }

package/dialogs/confirm-dialog/confirm-dialog.component.d.ts

@@ -1,4 +1,5 @@
 import { MatDialogRef } from '@angular/material/dialog';
+import * as i0 from "@angular/core";
 export declare class TdConfirmDialogComponent {
     private _dialogRef;
     title: string;
@@ -9,4 +10,6 @@ export declare class TdConfirmDialogComponent {
     constructor(_dialogRef: MatDialogRef<TdConfirmDialogComponent>);
     cancel(): void;
     accept(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdConfirmDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdConfirmDialogComponent, "td-confirm-dialog", never, {}, {}, never, never>;
 }

package/dialogs/covalent-core-dialogs.d.ts

@@ -1,5 +1,5 @@
 /**
  * Generated bundle index. Do not edit.
  */
+/// <amd-module name="@covalent/core/dialogs" />
 export * from './index';
-export { TdWindowDialogComponent as ɵa } from './window-dialog/window-dialog.component';

package/dialogs/dialog.component.d.ts

@@ -1,13 +1,22 @@
 import { QueryList, AfterContentInit } from '@angular/core';
+import * as i0 from "@angular/core";
 export declare class TdDialogTitleDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdDialogTitleDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TdDialogTitleDirective, "td-dialog-title", never, {}, {}, never>;
 }
 export declare class TdDialogContentDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdDialogContentDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TdDialogContentDirective, "td-dialog-content", never, {}, {}, never>;
 }
 export declare class TdDialogActionsDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdDialogActionsDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TdDialogActionsDirective, "td-dialog-actions", never, {}, {}, never>;
 }
 export declare class TdDialogComponent implements AfterContentInit {
     dialogTitle: QueryList<TdDialogTitleDirective>;
     dialogContent: QueryList<TdDialogContentDirective>;
     dialogActions: QueryList<TdDialogActionsDirective>;
     ngAfterContentInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdDialogComponent, "td-dialog", never, {}, {}, ["dialogTitle", "dialogContent", "dialogActions"], ["td-dialog-title", "td-dialog-content", "td-dialog-actions"]>;
 }

package/dialogs/dialog.component.scss

@@ -11,6 +11,7 @@
   position: relative;
   top: 16px;
   left: 16px;
+
   ::ng-deep [dir='rtl'] & {
     right: 16px;
     left: auto;
@@ -19,18 +20,22 @@
 
 :host {
   display: block;
+
   .td-dialog-actions {
     // [layout="row"]
     flex-direction: row;
     box-sizing: border-box;
     display: flex;
+
     .td-dialog-spacer {
       // flex
       flex: 1;
     }
+
     ::ng-deep button {
       text-transform: uppercase;
       margin-left: 8px;
+
       [dir='rtl'] & {
         margin-right: 8px;
         margin-left: inherit;

package/dialogs/dialogs.module.d.ts

@@ -1,2 +1,19 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./alert-dialog/alert-dialog.component";
+import * as i2 from "./confirm-dialog/confirm-dialog.component";
+import * as i3 from "./prompt-dialog/prompt-dialog.component";
+import * as i4 from "./dialog.component";
+import * as i5 from "./window-dialog/window-dialog.component";
+import * as i6 from "@angular/forms";
+import * as i7 from "@angular/common";
+import * as i8 from "@angular/material/dialog";
+import * as i9 from "@angular/material/input";
+import * as i10 from "@angular/material/button";
+import * as i11 from "@angular/material/toolbar";
+import * as i12 from "@angular/material/tooltip";
+import * as i13 from "@angular/material/icon";
 export declare class CovalentDialogsModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentDialogsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CovalentDialogsModule, [typeof i1.TdAlertDialogComponent, typeof i2.TdConfirmDialogComponent, typeof i3.TdPromptDialogComponent, typeof i4.TdDialogComponent, typeof i4.TdDialogTitleDirective, typeof i4.TdDialogActionsDirective, typeof i4.TdDialogContentDirective, typeof i5.TdWindowDialogComponent], [typeof i6.FormsModule, typeof i7.CommonModule, typeof i8.MatDialogModule, typeof i9.MatInputModule, typeof i10.MatButtonModule, typeof i11.MatToolbarModule, typeof i12.MatTooltipModule, typeof i13.MatIconModule], [typeof i1.TdAlertDialogComponent, typeof i2.TdConfirmDialogComponent, typeof i3.TdPromptDialogComponent, typeof i4.TdDialogComponent, typeof i4.TdDialogTitleDirective, typeof i4.TdDialogActionsDirective, typeof i4.TdDialogContentDirective, typeof i5.TdWindowDialogComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CovalentDialogsModule>;
 }

package/dialogs/package.json

@@ -1,11 +1,10 @@
 {
-  "main": "../bundles/covalent-core-dialogs.umd.js",
-  "module": "../fesm2015/covalent-core-dialogs.js",
-  "es2015": "../fesm2015/covalent-core-dialogs.js",
-  "esm2015": "../esm2015/dialogs/covalent-core-dialogs.js",
-  "fesm2015": "../fesm2015/covalent-core-dialogs.js",
+  "module": "../fesm2015/covalent-core-dialogs.mjs",
+  "es2020": "../fesm2020/covalent-core-dialogs.mjs",
+  "esm2020": "../esm2020/dialogs/covalent-core-dialogs.mjs",
+  "fesm2020": "../fesm2020/covalent-core-dialogs.mjs",
+  "fesm2015": "../fesm2015/covalent-core-dialogs.mjs",
   "typings": "covalent-core-dialogs.d.ts",
-  "metadata": "covalent-core-dialogs.metadata.json",
   "sideEffects": false,
   "name": "@covalent/core/dialogs"
-}
+}