Schematic fixes

schematics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -4,7 +4,7 @@
     class="sidenav"
     fixedInViewport="true"
     [attr.role]="isHandset ? 'dialog' : 'navigation'"
-    [mode]="isHandset ? 'over' : 'side'"
+    [mode]="(isHandset | async)!.matches ? 'over' : 'side'"
     [opened]="!(isHandset | async)!.matches">
     <mat-toolbar color="primary">Menu</mat-toolbar>
     <mat-nav-list>

schematics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -11,7 +11,7 @@ import { Observable } from 'rxjs/Observable';
         class="sidenav"
         fixedInViewport="true"
         [attr.role]="isHandset ? 'dialog' : 'navigation'"
-        [mode]="isHandset ? 'over' : 'side'"
+        [mode]="(isHandset | async)!.matches ? 'over' : 'side'"
         [opened]="!(isHandset | async)!.matches">
         <mat-toolbar color="primary">Menu</mat-toolbar>
         <mat-nav-list>

schematics/shell/index.ts

@@ -9,7 +9,7 @@ import {
 import {Schema} from './schema';
 import {materialVersion, cdkVersion, angularVersion} from '../utils/lib-versions';
 import {getConfig, getAppFromConfig, AppConfig, CliConfig} from '../utils/devkit-utils/config';
-import {addModuleImportToRootModule} from '../utils/ast';
+import {addModuleImportToRootModule, getStylesPath} from '../utils/ast';
 import {addHeadLink} from '../utils/html';
 import {addPackageToPackageJson} from '../utils/package';
 import {createCustomTheme} from './custom-theme';
@@ -27,7 +27,8 @@ export default function(options: Schema): Rule {
     options && options.skipPackageJson ? noop() : addMaterialToPackageJson(options),
     addThemeToAppStyles(options),
     addAnimationRootConfig(),
-    addFontsToIndex()
+    addFontsToIndex(),
+    addBodyMarginToStyles()
   ]);
 }
 
@@ -115,10 +116,32 @@ function addAnimationRootConfig() {
  */
 function addFontsToIndex() {
   return (host: Tree) => {
-    addHeadLink(host,
-      `<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">`);
-    addHeadLink(host,
-      `<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">`);
+    addHeadLink(host, `
+  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">`);
+    addHeadLink(host, `
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">`);
     return host;
   };
 }
+
+/**
+ * Add 0 margin to body in styles.ext
+ */
+function addBodyMarginToStyles() {
+  return (host: Tree) => {
+    const stylesPath = getStylesPath(host);
+
+    const buffer = host.read(stylesPath);
+    if (!buffer) {
+      throw new SchematicsException(`Could not find file for path: ${stylesPath}`);
+    }
+
+    const src = buffer.toString();
+    const insertion = new InsertChange(stylesPath, src.length, `
+body { margin: 0; }
+`);
+    const recorder = host.beginUpdate(stylesPath);
+    recorder.insertLeft(insertion.pos, insertion.toAdd);
+    host.commitUpdate(recorder);
+  };
+}

schematics/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__-datasource.ts

@@ -61,8 +61,11 @@ export class <%= classify(name) %>DataSource extends DataSource<<%= classify(nam
       this.sort.sortChange
     ];
 
+    // Set the paginators length
+    this.paginator.length = this.data.length;
+
     return merge(...dataMutations).pipe(map(() => {
-      return this.getPagedData(this.getSortedData(this.data));
+      return this.getPagedData(this.getSortedData([...this.data]));
     }));
   }
 
@@ -91,7 +94,7 @@ export class <%= classify(name) %>DataSource extends DataSource<<%= classify(nam
     }
 
     return data.sort((a, b) => {
-      const isAsc = this.sort.direction == 'asc';
+      const isAsc = this.sort.direction === 'asc';
       switch (this.sort.active) {
         case 'name': return compare(a.name, b.name, isAsc);
         case 'id': return compare(+a.id, +b.id, isAsc);

schematics/utils/ast.ts

@@ -60,3 +60,23 @@ export function getIndexHtmlPath(host: Tree) {
   const app = getAppFromConfig(config, '0');
   return normalize(`/${app.root}/${app.index}`);
 }
+
+/**
+ * Get the root stylesheet file.
+ */
+export function getStylesPath(host: Tree) {
+  const config = getConfig(host);
+  const app = getAppFromConfig(config, '0');
+  const styles = app.styles.find(style => {
+    const str = style.toString();
+    return str === 'styles.css' ||
+           str === 'styles.less' ||
+           str === 'styles.scss';
+  });
+
+  if (!styles) {
+    throw new SchematicsException(`Could not find global styles.ext file.`);
+  }
+
+  return normalize(`/${app.root}/${styles}`);
+}