@depup/angular__material 21.2.2-depup.19

package/schematics/ng-add/index.js

@@ -0,0 +1,54 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const tasks_1 = require("@angular-devkit/schematics/tasks");
+const package_config_1 = require("./package-config");
+/**
+ * Version range that will be used for the Angular CDK and Angular Material if this
+ * schematic has been run outside of the CLI `ng add` command. In those cases, there
+ * can be no dependency on `@angular/material` in the `package.json` file, and we need
+ * to manually insert the dependency based on the build version placeholder.
+ *
+ * Note that the fallback version range does not use caret, but tilde because that is
+ * the default for Angular framework dependencies in CLI projects.
+ */
+const fallbackMaterialVersionRange = `~21.2.2`;
+/**
+ * Schematic factory entry-point for the `ng-add` schematic. The ng-add schematic will be
+ * automatically executed if developers run `ng add @angular/material`.
+ *
+ * Since the Angular Material schematics depend on the schematic utility functions from the CDK,
+ * we need to install the CDK before loading the schematic files that import from the CDK.
+ */
+function default_1(options) {
+    return (host, context) => {
+        // Version tag of the `@angular/core` dependency that has been loaded from the `package.json`
+        // of the CLI project. This tag should be preferred because all Angular dependencies should
+        // have the same version tag if possible.
+        const ngCoreVersionTag = (0, package_config_1.getPackageVersionFromPackageJson)(host, '@angular/core');
+        const materialVersionRange = (0, package_config_1.getPackageVersionFromPackageJson)(host, '@angular/material');
+        const angularDependencyVersion = ngCoreVersionTag || `^21.0.0 || ^22.0.0`;
+        // The CLI inserts `@angular/material` into the `package.json` before this schematic runs.
+        // This means that we do not need to insert Angular Material into `package.json` files again.
+        // In some cases though, it could happen that this schematic runs outside of the CLI `ng add`
+        // command, or Material is only listed a dev dependency. If that is the case, we insert a
+        // version based on the current build version (substituted version placeholder).
+        if (materialVersionRange === null) {
+            (0, package_config_1.addPackageToPackageJson)(host, '@angular/material', fallbackMaterialVersionRange);
+        }
+        (0, package_config_1.addPackageToPackageJson)(host, '@angular/cdk', materialVersionRange || fallbackMaterialVersionRange);
+        (0, package_config_1.addPackageToPackageJson)(host, '@angular/forms', angularDependencyVersion);
+        // Since the Angular Material schematics depend on the schematic utility functions from the
+        // CDK, we need to install the CDK before loading the schematic files that import from the CDK.
+        const installTaskId = context.addTask(new tasks_1.NodePackageInstallTask());
+        context.addTask(new tasks_1.RunSchematicTask('ng-add-setup-project', options), [installTaskId]);
+    };
+}
+//# sourceMappingURL=index.js.map

package/schematics/ng-add/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAyBH,4BA+BC;AArDD,4DAA0F;AAC1F,qDAA2F;AAG3F;;;;;;;;GAQG;AACH,MAAM,4BAA4B,GAAG,oBAAoB,CAAC;AAE1D;;;;;;GAMG;AACH,mBAAyB,OAAe;IACtC,OAAO,CAAC,IAAU,EAAE,OAAyB,EAAE,EAAE;QAC/C,6FAA6F;QAC7F,2FAA2F;QAC3F,yCAAyC;QACzC,MAAM,gBAAgB,GAAG,IAAA,iDAAgC,EAAC,IAAI,EAAE,eAAe,CAAC,CAAC;QACjF,MAAM,oBAAoB,GAAG,IAAA,iDAAgC,EAAC,IAAI,EAAE,mBAAmB,CAAC,CAAC;QACzF,MAAM,wBAAwB,GAAG,gBAAgB,IAAI,UAAU,CAAC;QAEhE,0FAA0F;QAC1F,6FAA6F;QAC7F,6FAA6F;QAC7F,yFAAyF;QACzF,gFAAgF;QAChF,IAAI,oBAAoB,KAAK,IAAI,EAAE,CAAC;YAClC,IAAA,wCAAuB,EAAC,IAAI,EAAE,mBAAmB,EAAE,4BAA4B,CAAC,CAAC;QACnF,CAAC;QAED,IAAA,wCAAuB,EACrB,IAAI,EACJ,cAAc,EACd,oBAAoB,IAAI,4BAA4B,CACrD,CAAC;QACF,IAAA,wCAAuB,EAAC,IAAI,EAAE,gBAAgB,EAAE,wBAAwB,CAAC,CAAC;QAE1E,2FAA2F;QAC3F,+FAA+F;QAC/F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,8BAAsB,EAAE,CAAC,CAAC;QAEpE,OAAO,CAAC,OAAO,CAAC,IAAI,wBAAgB,CAAC,sBAAsB,EAAE,OAAO,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAC1F,CAAC,CAAC;AACJ,CAAC"}

package/schematics/ng-add/package-config.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+import { Tree } from '@angular-devkit/schematics';
+/** Adds a package to the package.json in the given host tree. */
+export declare function addPackageToPackageJson(host: Tree, pkg: string, version: string): Tree;
+/** Gets the version of the specified package by looking at the package.json in the given tree. */
+export declare function getPackageVersionFromPackageJson(tree: Tree, name: string): string | null;

package/schematics/ng-add/package-config.js

@@ -0,0 +1,51 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addPackageToPackageJson = addPackageToPackageJson;
+exports.getPackageVersionFromPackageJson = getPackageVersionFromPackageJson;
+/**
+ * Sorts the keys of the given object.
+ * @returns A new object instance with sorted keys
+ */
+function sortObjectByKeys(obj) {
+    return Object.keys(obj)
+        .sort()
+        .reduce((result, key) => {
+        result[key] = obj[key];
+        return result;
+    }, {});
+}
+/** Adds a package to the package.json in the given host tree. */
+function addPackageToPackageJson(host, pkg, version) {
+    if (host.exists('package.json')) {
+        const sourceText = host.read('package.json').toString('utf-8');
+        const json = JSON.parse(sourceText);
+        if (!json.dependencies) {
+            json.dependencies = {};
+        }
+        if (!json.dependencies[pkg]) {
+            json.dependencies[pkg] = version;
+            json.dependencies = sortObjectByKeys(json.dependencies);
+        }
+        host.overwrite('package.json', JSON.stringify(json, null, 2));
+    }
+    return host;
+}
+/** Gets the version of the specified package by looking at the package.json in the given tree. */
+function getPackageVersionFromPackageJson(tree, name) {
+    if (!tree.exists('package.json')) {
+        return null;
+    }
+    const packageJson = JSON.parse(tree.read('package.json').toString('utf8'));
+    if (packageJson.dependencies && packageJson.dependencies[name]) {
+        return packageJson.dependencies[name];
+    }
+    return null;
+}
+//# sourceMappingURL=package-config.js.map

package/schematics/ng-add/package-config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"package-config.js","sourceRoot":"","sources":["package-config.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAyBH,0DAkBC;AAGD,4EAYC;AAlDD;;;GAGG;AACH,SAAS,gBAAgB,CAAC,GAA2B;IACnD,OAAO,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;SACpB,IAAI,EAAE;SACN,MAAM,CACL,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;QACd,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;QACvB,OAAO,MAAM,CAAC;IAChB,CAAC,EACD,EAA4B,CAC7B,CAAC;AACN,CAAC;AAED,iEAAiE;AACjE,SAAgB,uBAAuB,CAAC,IAAU,EAAE,GAAW,EAAE,OAAe;IAC9E,IAAI,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,CAAC;QAChC,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,cAAc,CAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QAChE,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAgB,CAAC;QAEnD,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACzB,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC;YACjC,IAAI,CAAC,YAAY,GAAG,gBAAgB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC1D,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;IAChE,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC;AAED,kGAAkG;AAClG,SAAgB,gCAAgC,CAAC,IAAU,EAAE,IAAY;IACvE,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,CAAC;QACjC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAgB,CAAC;IAE3F,IAAI,WAAW,CAAC,YAAY,IAAI,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;QAC/D,OAAO,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC"}

package/schematics/ng-add/schema.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+export interface Schema {
+    /** Name of the project. */
+    project: string;
+    /** Name of pre-built theme to install. */
+    theme: 'azure-blue' | 'rose-red' | 'magenta-violet' | 'cyan-orange' | 'custom';
+    /** Whether to set up global typography styles. */
+    typography: boolean;
+}

package/schematics/ng-add/schema.js

@@ -0,0 +1,10 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=schema.js.map

package/schematics/ng-add/schema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.js","sourceRoot":"","sources":["schema.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG"}

package/schematics/ng-add/schema.json

@@ -0,0 +1,43 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "angular-material-ng-add",
+  "title": "Angular Material ng-add schematic",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "Name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "theme": {
+      "description": "The theme to apply",
+      "type": "string",
+      "default": "azure-blue",
+      "x-prompt": {
+        "message": "Select a pair of starter prebuilt color palettes for your Angular Material theme",
+        "type": "list",
+        "items": [
+          {
+            "value": "azure-blue",
+            "label": "Azure/Blue         [Preview: https://material.angular.dev?theme=azure-blue]"
+          },
+          {
+            "value": "rose-red",
+            "label": "Rose/Red           [Preview: https://material.angular.dev?theme=rose-red]"
+          },
+          {
+            "value": "magenta-violet",
+            "label": "Magenta/Violet     [Preview: https://material.angular.dev?theme=magenta-violet]"
+          },
+          {
+            "value": "cyan-orange",
+            "label": "Cyan/Orange        [Preview: https://material.angular.dev?theme=cyan-orange]"
+          }
+        ]
+      }
+    }
+  },
+  "required": []
+}

package/schematics/ng-add/setup-project.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+/**
+ * Scaffolds the basics of a Angular Material application, this includes:
+ *  - Add Packages to package.json
+ *  - Adds pre-built themes to styles.ext
+ */
+export default function (options: Schema): Rule;

package/schematics/ng-add/setup-project.js

@@ -0,0 +1,36 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const schematics_1 = require("@angular-devkit/schematics");
+const schematics_2 = require("@angular/cdk/schematics");
+const utility_1 = require("@schematics/angular/utility");
+const workspace_models_1 = require("@schematics/angular/utility/workspace-models");
+const material_fonts_1 = require("./fonts/material-fonts");
+const theming_1 = require("./theming/theming");
+/**
+ * Scaffolds the basics of a Angular Material application, this includes:
+ *  - Add Packages to package.json
+ *  - Adds pre-built themes to styles.ext
+ */
+function default_1(options) {
+    return async (host, context) => {
+        const workspace = await (0, utility_1.readWorkspace)(host);
+        const project = (0, schematics_2.getProjectFromWorkspace)(workspace, options.project);
+        if (project.extensions['projectType'] === workspace_models_1.ProjectType.Application) {
+            return (0, schematics_1.chain)([(0, theming_1.addThemeToAppStyles)(options), (0, material_fonts_1.addFontsToIndex)(options)]);
+        }
+        context.logger.warn('Angular Material has been set up in your workspace. There is no additional setup ' +
+            'required for consuming Angular Material in your library project.\n\n' +
+            'If you intended to run the schematic on a different project, pass the `--project` ' +
+            'option.');
+        return;
+    };
+}
+//# sourceMappingURL=setup-project.js.map

package/schematics/ng-add/setup-project.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup-project.js","sourceRoot":"","sources":["setup-project.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAeH,4BAgBC;AA7BD,2DAA+E;AAC/E,wDAAgE;AAChE,yDAA0D;AAC1D,mFAAyE;AACzE,2DAAuD;AAEvD,+CAAsD;AAEtD;;;;GAIG;AACH,mBAAyB,OAAe;IACtC,OAAO,KAAK,EAAE,IAAU,EAAE,OAAyB,EAAE,EAAE;QACrD,MAAM,SAAS,GAAG,MAAM,IAAA,uBAAa,EAAC,IAAI,CAAC,CAAC;QAC5C,MAAM,OAAO,GAAG,IAAA,oCAAuB,EAAC,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;QAEpE,IAAI,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,8BAAW,CAAC,WAAW,EAAE,CAAC;YAClE,OAAO,IAAA,kBAAK,EAAC,CAAC,IAAA,6BAAmB,EAAC,OAAO,CAAC,EAAE,IAAA,gCAAe,EAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACzE,CAAC;QACD,OAAO,CAAC,MAAM,CAAC,IAAI,CACjB,mFAAmF;YACjF,sEAAsE;YACtE,oFAAoF;YACpF,SAAS,CACZ,CAAC;QACF,OAAO;IACT,CAAC,CAAC;AACJ,CAAC"}

package/schematics/ng-add/theming/create-theme.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+/** Create theme for the given application configuration. */
+export declare function createTheme(userPaletteChoice: string): string;

package/schematics/ng-add/theming/create-theme.js

@@ -0,0 +1,58 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createTheme = createTheme;
+/** Create theme for the given application configuration. */
+function createTheme(userPaletteChoice) {
+    const colorPalettes = new Map([
+        ['azure-blue', { primary: 'azure', tertiary: 'blue' }],
+        ['rose-red', { primary: 'rose', tertiary: 'red' }],
+        ['magenta-violet', { primary: 'magenta', tertiary: 'violet' }],
+        ['cyan-orange', { primary: 'cyan', tertiary: 'orange' }],
+    ]);
+    return `
+// Include theming for Angular Material with \`mat.theme()\`.
+// This Sass mixin will define CSS variables that are used for styling Angular Material
+// components according to the Material 3 design spec.
+// Learn more about theming and how to use it for your application's
+// custom components at https://material.angular.dev/guide/theming
+@use '@angular/material' as mat;
+
+html {
+  height: 100%;
+  @include mat.theme((
+    color: (
+      primary: mat.$${colorPalettes.get(userPaletteChoice).primary}-palette,
+      tertiary: mat.$${colorPalettes.get(userPaletteChoice).tertiary}-palette,
+    ),
+    typography: Roboto,
+    density: 0,
+  ));
+}
+
+body {
+  // Default the application to a light color theme. This can be changed to
+  // \`dark\` to enable the dark color theme, or to \`light dark\` to defer to the
+  // user's system settings.
+  color-scheme: light;
+
+  // Set a default background, font and text colors for the application using
+  // Angular Material's system-level CSS variables. Learn more about these
+  // variables at https://material.angular.dev/guide/system-variables
+  background-color: var(--mat-sys-surface);
+  color: var(--mat-sys-on-surface);
+  font: var(--mat-sys-body-medium);
+
+  // Reset the user agent margin.
+  margin: 0;
+  height: 100%;
+}
+`;
+}
+//# sourceMappingURL=create-theme.js.map

package/schematics/ng-add/theming/create-theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-theme.js","sourceRoot":"","sources":["create-theme.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAGH,kCA6CC;AA9CD,4DAA4D;AAC5D,SAAgB,WAAW,CAAC,iBAAyB;IACnD,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC;QAC5B,CAAC,YAAY,EAAE,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAC,CAAC;QACpD,CAAC,UAAU,EAAE,EAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAC,CAAC;QAChD,CAAC,gBAAgB,EAAE,EAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAC,CAAC;QAC5D,CAAC,aAAa,EAAE,EAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAC,CAAC;KACvD,CAAC,CAAC;IACH,OAAO;;;;;;;;;;;;sBAYa,aAAa,CAAC,GAAG,CAAC,iBAAiB,CAAE,CAAC,OAAO;uBAC5C,aAAa,CAAC,GAAG,CAAC,iBAAiB,CAAE,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;CAwBpE,CAAC;AACF,CAAC"}

package/schematics/ng-add/theming/theming.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from '../schema';
+/** Add pre-built styles to the main project style file. */
+export declare function addThemeToAppStyles(options: Schema): Rule;

package/schematics/ng-add/theming/theming.js

@@ -0,0 +1,133 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addThemeToAppStyles = addThemeToAppStyles;
+const core_1 = require("@angular-devkit/core");
+const schematics_1 = require("@angular-devkit/schematics");
+const schematics_2 = require("@angular/cdk/schematics");
+const change_1 = require("@schematics/angular/utility/change");
+const utility_1 = require("@schematics/angular/utility");
+const path_1 = require("path");
+const create_theme_1 = require("./create-theme");
+/** Path segment that can be found in paths that refer to a prebuilt theme. */
+const prebuiltThemePathSegment = '@angular/material/prebuilt-themes';
+/** Default file name of the custom theme that can be generated. */
+const defaultThemeFilename = 'material-theme.scss';
+/** Add pre-built styles to the main project style file. */
+function addThemeToAppStyles(options) {
+    return (host, context) => {
+        let palettes = options.theme || 'azure-blue';
+        // For a long time, theme param could be "custom" which meant to add a custom theme. This option
+        // was removed since we always add a custom theme, and we expect this option to be the
+        // user's preferred palettes. However it's possible that users will have hardcoded CLI commands
+        // that pass "--theme custom" and we can gracefully handle this by assuming azure-blue.
+        if (palettes === 'custom') {
+            palettes = 'azure-blue';
+        }
+        return insertTheme(palettes, options.project, host, context.logger);
+    };
+}
+/**
+ * Insert an Angular Material theme to project style file. If no valid style file could be found,
+ * a new Sass file for the theme will be created.
+ */
+async function insertTheme(palettes, projectName, host, logger) {
+    const workspace = await (0, utility_1.readWorkspace)(host);
+    const project = (0, schematics_2.getProjectFromWorkspace)(workspace, projectName);
+    const stylesPath = (0, schematics_2.getProjectStyleFile)(project, 'scss');
+    const themeContent = (0, create_theme_1.createTheme)(palettes);
+    if (!stylesPath) {
+        if (!project.sourceRoot) {
+            throw new schematics_1.SchematicsException(`Could not find source root for project: "${projectName}". ` +
+                `Please make sure that the "sourceRoot" property is set in the workspace config.`);
+        }
+        // Normalize the path through the devkit utilities because we want to avoid having
+        // unnecessary path segments and windows backslash delimiters.
+        const themePath = (0, core_1.normalize)((0, path_1.join)(project.sourceRoot, defaultThemeFilename));
+        if (host.exists(themePath)) {
+            logger.warn(`Cannot create an Angular Material theme because
+          ${themePath} already exists. Skipping theme generation.`);
+            return (0, schematics_1.noop)();
+        }
+        host.create(themePath, themeContent);
+        return addThemeStyleToTarget(projectName, 'build', themePath, logger);
+    }
+    const insertion = new change_1.InsertChange(stylesPath, 0, themeContent);
+    const recorder = host.beginUpdate(stylesPath);
+    recorder.insertLeft(insertion.pos, insertion.toAdd);
+    host.commitUpdate(recorder);
+    return (0, schematics_1.noop)();
+}
+/** Adds a theming style entry to the given project target options. */
+function addThemeStyleToTarget(projectName, targetName, assetPath, logger) {
+    return (0, utility_1.updateWorkspace)(workspace => {
+        const project = (0, schematics_2.getProjectFromWorkspace)(workspace, projectName);
+        // Do not update the builder options in case the target does not use the default CLI builder.
+        if (!validateDefaultTargetBuilder(project, targetName, logger)) {
+            return;
+        }
+        const targetOptions = (0, schematics_2.getProjectTargetOptions)(project, targetName);
+        const styles = targetOptions['styles'];
+        if (!styles) {
+            targetOptions['styles'] = [assetPath];
+        }
+        else {
+            const existingStyles = styles.map(s => (typeof s === 'string' ? s : s.input));
+            for (let [index, stylePath] of existingStyles.entries()) {
+                // If the given asset is already specified in the styles, we don't need to do anything.
+                if (stylePath === assetPath) {
+                    return;
+                }
+                // In case a prebuilt theme is already set up, we can safely replace the theme with the new
+                // theme file. If a custom theme is set up, we are not able to safely replace the custom
+                // theme because these files can contain custom styles, while prebuilt themes are
+                // always packaged and considered replaceable.
+                if (stylePath.includes(defaultThemeFilename)) {
+                    logger.error(`Could not add the selected theme to the CLI project ` +
+                        `configuration because there is already a theme file referenced.`);
+                    logger.info(`Please manually add the following style file to your configuration:`);
+                    logger.info(`    ${assetPath}`);
+                    return;
+                }
+                else if (stylePath.includes(prebuiltThemePathSegment)) {
+                    styles.splice(index, 1);
+                }
+            }
+            styles.unshift(assetPath);
+        }
+    });
+}
+/**
+ * Validates that the specified project target is configured with the default builders which are
+ * provided by the Angular CLI. If the configured builder does not match the default builder,
+ * this function can either throw or just show a warning.
+ */
+function validateDefaultTargetBuilder(project, targetName, logger) {
+    const targets = targetName === 'test' ? (0, schematics_2.getProjectTestTargets)(project) : (0, schematics_2.getProjectBuildTargets)(project);
+    const isDefaultBuilder = targets.length > 0;
+    // Because the build setup for the Angular CLI can be customized by developers, we can't know
+    // where to put the theme file in the workspace configuration if custom builders are being
+    // used. In case the builder has been changed for the "build" target, we throw an error and
+    // exit because setting up a theme is a primary goal of `ng-add`. Otherwise if just the "test"
+    // builder has been changed, we warn because a theme is not mandatory for running tests
+    // with Material. See: https://github.com/angular/components/issues/14176
+    if (!isDefaultBuilder && targetName === 'build') {
+        throw new schematics_1.SchematicsException(`Your project is not using the default builders for ` +
+            `"${targetName}". The Angular Material schematics cannot add a theme to the workspace ` +
+            `configuration if the builder has been changed.`);
+    }
+    else if (!isDefaultBuilder) {
+        // for non-build targets we gracefully report the error without actually aborting the
+        // setup schematic. This is because a theme is not mandatory for running tests.
+        logger.warn(`Your project is not using the default builders for "${targetName}". This ` +
+            `means that we cannot add the configured theme to the "${targetName}" target.`);
+    }
+    return isDefaultBuilder;
+}
+//# sourceMappingURL=theming.js.map

package/schematics/ng-add/theming/theming.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theming.js","sourceRoot":"","sources":["theming.ts"],"names":[],"mappings":"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"}

package/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.__style__.template

@@ -0,0 +1,27 @@
+.full-width {
+  width: 100%;
+}
+
+.shipping-card {
+  min-width: 120px;
+  margin: 20px auto;
+}
+
+.mat-radio-button {
+  display: block;
+  margin: 5px 0;
+}
+
+.row {
+  display: flex;
+  flex-direction: row;
+}
+
+.col {
+  flex: 1;
+  margin-right: 20px;
+}
+
+.col:last-child {
+  margin-right: 0;
+}

package/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html.template

@@ -0,0 +1,99 @@
+<form [formGroup]="addressForm" novalidate (ngSubmit)="onSubmit()">
+  <mat-card class="shipping-card">
+    <mat-card-header>
+      <mat-card-title>Shipping Information</mat-card-title>
+    </mat-card-header>
+    <mat-card-content>
+      <div class="row">
+        <div class="col">
+          <mat-form-field class="full-width">
+            <input matInput placeholder="Company" formControlName="company">
+          </mat-form-field>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <mat-form-field class="full-width">
+            <input matInput placeholder="First name" formControlName="firstName">
+            @if (addressForm.controls['firstName'].hasError('required')) {
+              <mat-error>First name is <strong>required</strong></mat-error>
+            }
+          </mat-form-field>
+        </div>
+        <div class="col">
+          <mat-form-field class="full-width">
+            <input matInput placeholder="Last name" formControlName="lastName">
+            @if (addressForm.controls['lastName'].hasError('required')) {
+              <mat-error>Last name is <strong>required</strong></mat-error>
+            }
+          </mat-form-field>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <mat-form-field class="full-width">
+            <textarea matInput placeholder="Address" formControlName="address"></textarea>
+            @if (addressForm.controls['address'].hasError('required')) {
+              <mat-error>Address is <strong>required</strong></mat-error>
+            }
+          </mat-form-field>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          @if (hasUnitNumber) {
+            <mat-form-field class="full-width">
+              <textarea matInput placeholder="Address 2" formControlName="address2"></textarea>
+            </mat-form-field>
+          } @else {
+            <button matButton type="button" (click)="hasUnitNumber = !hasUnitNumber">
+              + Add C/O, Apt, Suite, Unit
+            </button>
+          }
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <mat-form-field class="full-width">
+            <input matInput placeholder="City" formControlName="city">
+            @if (addressForm.controls['city'].hasError('required')) {
+              <mat-error>City is <strong>required</strong></mat-error>
+            }
+          </mat-form-field>
+        </div>
+        <div class="col">
+          <mat-form-field class="full-width">
+            <mat-select placeholder="State" formControlName="state">
+              @for (state of states; track state) {
+                <mat-option [value]="state.abbreviation">{{ state.name }}</mat-option>
+              }
+            </mat-select>
+            @if (addressForm.controls['state'].hasError('required')) {
+              <mat-error>State is <strong>required</strong></mat-error>
+            }
+          </mat-form-field>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <mat-form-field class="full-width">
+            <input matInput #postalCode maxlength="5" placeholder="Postal Code" type="number" formControlName="postalCode">
+            <mat-hint align="end">{{postalCode.value.length}} / 5</mat-hint>
+          </mat-form-field>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <mat-radio-group formControlName="shipping">
+            <mat-radio-button value="free">Free Shipping</mat-radio-button>
+            <mat-radio-button value="priority">Priority Shipping</mat-radio-button>
+            <mat-radio-button value="nextday">Next Day Shipping</mat-radio-button>
+          </mat-radio-group>
+        </div>
+      </div>
+    </mat-card-content>
+    <mat-card-actions>
+      <button matButton="elevated" color="primary" type="submit">Submit</button>
+    </mat-card-actions>
+  </mat-card>
+</form>