@dugararchit/cdk 0.0.0-dugararchit

package/schematics/schematics/ng-update/test-cases/v13/misc/tilde-import-v13.spec.ts

@@ -0,0 +1,149 @@
+import {UnitTestTree} from '@angular-devkit/schematics/testing';
+import {createTestCaseSetup} from '../../../../testing';
+import {join} from 'path';
+import {MIGRATION_PATH} from '../../../../paths';
+
+describe('v13 tilde import migration', () => {
+  const PROJECT_PATH = '/projects/cdk-testing';
+  const TEST_PATH = join(PROJECT_PATH, 'src/test.scss');
+  let tree: UnitTestTree;
+  let _writeFile: (filePath: string, text: string) => void;
+  let runMigration: () => Promise<{logOutput: string}>;
+
+  beforeEach(async () => {
+    const testSetup = await createTestCaseSetup('migration-v13', MIGRATION_PATH, []);
+    tree = testSetup.appTree;
+    runMigration = testSetup.runFixers;
+    _writeFile = testSetup.writeFile;
+  });
+
+  /** Writes an array of lines as a single file. */
+  function writeLines(path: string, lines: string[]): void {
+    _writeFile(path, lines.join('\n'));
+  }
+
+  /** Reads a file and split it into an array where each item is a new line. */
+  function splitFile(path: string): string[] {
+    return tree.readContent(path).split('\n');
+  }
+
+  it('should remove the tilde from angular imports', async () => {
+    writeLines(TEST_PATH, [
+      `@use '~@dugararchit/material' as mat;`,
+      `@import '~@dugararchit/material/theming';`,
+      `@import '~@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use '@dugararchit/material' as mat;`,
+      `@import '@dugararchit/material/theming';`,
+      `@import '@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+  });
+
+  it('should handle an arbitrary amount of whitespace', async () => {
+    writeLines(TEST_PATH, [
+      `@use                               '~@dugararchit/material' as mat;`,
+
+      `@include mat.core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use                               '@dugararchit/material' as mat;`,
+
+      `@include mat.core();`,
+    ]);
+  });
+
+  it('should preserve tilde after the start', async () => {
+    writeLines(TEST_PATH, [
+      `@use '~@angular/~material' as mat;`,
+      `@import '@dugararchit/cdk/~overlay-prebuilt.css';`,
+
+      `@include mat.core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use '@angular/~material' as mat;`,
+      `@import '@dugararchit/cdk/~overlay-prebuilt.css';`,
+
+      `@include mat.core();`,
+    ]);
+  });
+
+  it('should handle different types of quotes', async () => {
+    writeLines(TEST_PATH, [
+      `@use "~@dugararchit/material" as mat;`,
+      `@import '~@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use "@dugararchit/material" as mat;`,
+      `@import '@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+  });
+
+  it('should preserve the tilde in non-angular imports', async () => {
+    writeLines(TEST_PATH, [
+      `@use '~@angular-momentum/material' as mat;`,
+      `@import '~@angular-momentum/material/theming';`,
+      `@import '@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use '~@angular-momentum/material' as mat;`,
+      `@import '~@angular-momentum/material/theming';`,
+      `@import '@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+  });
+
+  it('should remove remove .scss file extension', async () => {
+    writeLines(TEST_PATH, [
+      `@use '~@dugararchit/material.scss' as mat;`,
+      `@import '~@dugararchit/material/theming.scss';`,
+      `@import '~@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use '@dugararchit/material' as mat;`,
+      `@import '@dugararchit/material/theming';`,
+      `@import '@dugararchit/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+  });
+});

package/schematics/schematics/ng-update/test-cases/v6/attribute-selectors_expected_output.ts

@@ -0,0 +1,36 @@
+import {Component} from '@angular/core';
+import * as core from '@angular/core';
+import {By} from '@angular/platform-browser';
+
+const a = By.css('[cdkPortalOutlet]');
+const b = By.css('[cdkPortalOutlet]');
+
+// These should not change because we only update string literals that are
+// inside of a call expression.
+const c = 'cdkPortalHost';
+const d = 'portalHost';
+
+@core.Component({
+  template: `
+    <div cdkPortalOutlet="E"></div>
+    <div [cdkPortalOutlet]="myPortal"></div>
+  `,
+  styles: [
+    '[cdkPortalOutlet] {background: red}',
+    'div[cdkPortalOutlet] {color: blue}'
+  ]
+})
+class E {}
+
+@Component({
+  standalone: false,
+  template: `
+    <div cdkPortalOutlet="F"></div>
+    <div [cdkPortalOutlet]="myPortal"></div>
+  `,
+  styles: [
+    '[cdkPortalOutlet] {background: red}',
+    'div[cdkPortalOutlet] {color: blue}'
+  ]
+})
+class F {}

package/schematics/schematics/ng-update/test-cases/v6/attribute-selectors_input.ts

@@ -0,0 +1,36 @@
+import {Component} from '@angular/core';
+import * as core from '@angular/core';
+import {By} from '@angular/platform-browser';
+
+const a = By.css('[cdkPortalHost]');
+const b = By.css('[portalHost]');
+
+// These should not change because we only update string literals that are
+// inside of a call expression.
+const c = 'cdkPortalHost';
+const d = 'portalHost';
+
+@core.Component({
+  template: `
+    <div cdkPortalHost="E"></div>
+    <div [cdkPortalHost]="myPortal"></div>
+  `,
+  styles: [
+    '[cdkPortalHost] {background: red}',
+    'div[cdkPortalHost] {color: blue}'
+  ]
+})
+class E {}
+
+@Component({
+  standalone: false,
+  template: `
+    <div portalHost="F"></div>
+    <div [portalHost]="myPortal"></div>
+  `,
+  styles: [
+    '[portalHost] {background: red}',
+    'div[portalHost] {color: blue}'
+  ]
+})
+class F {}

package/schematics/schematics/ng-update/test-cases/v6/class-names_expected_output.ts

@@ -0,0 +1,8 @@
+import {CdkConnectedOverlay, CdkOverlayOrigin} from '@dugararchit/cdk/overlay';
+import {CdkObserveContent} from '@dugararchit/cdk/observers';
+import {CdkTrapFocus} from '@dugararchit/cdk/a11y';
+
+const a = new CdkConnectedOverlay();
+const b = new CdkOverlayOrigin();
+const c = new CdkObserveContent();
+const d = new CdkTrapFocus();

package/schematics/schematics/ng-update/test-cases/v6/class-names_input.ts

@@ -0,0 +1,8 @@
+import {ConnectedOverlayDirective, OverlayOrigin} from '@dugararchit/cdk/overlay';
+import {ObserveContent} from '@dugararchit/cdk/observers';
+import {FocusTrapDirective} from '@dugararchit/cdk/a11y';
+
+const a = new ConnectedOverlayDirective();
+const b = new OverlayOrigin();
+const c = new ObserveContent();
+const d = new FocusTrapDirective();

package/schematics/schematics/ng-update/test-cases/v6/input-names_expected_output.ts

@@ -0,0 +1,22 @@
+import {Component} from '@angular/core';
+
+@Component({
+  standalone: false,
+  template: `
+    <ng-template cdkConnectedOverlay
+                 [cdkConnectedOverlayOrigin]="myOrigin"
+                 [cdkConnectedOverlayPositions]="myPositions"
+                 [cdkConnectedOverlayOffsetX]="myOffsetX"
+                 [cdkConnectedOverlayOffsetY]="myOffsetY"
+                 [cdkConnectedOverlayWidth]="myWidth"
+                 [cdkConnectedOverlayHeight]="myHeight"
+                 [cdkConnectedOverlayMinWidth]="myMinWidth"
+                 [cdkConnectedOverlayMinHeight]="myMinHeight"
+                 [cdkConnectedOverlayBackdropClass]="myBackdropClass"
+                 [cdkConnectedOverlayScrollStrategy]="myScrollStrategy"
+                 [cdkConnectedOverlayOpen]="isOpen"
+                 [cdkConnectedOverlayHasBackdrop]="hasBackdrop">
+    </ng-template>
+  `
+})
+class A {}

package/schematics/schematics/ng-update/test-cases/v6/input-names_input.ts

@@ -0,0 +1,22 @@
+import {Component} from '@angular/core';
+
+@Component({
+  standalone: false,
+  template: `
+    <ng-template cdkConnectedOverlay
+                 [origin]="myOrigin"
+                 [positions]="myPositions"
+                 [offsetX]="myOffsetX"
+                 [offsetY]="myOffsetY"
+                 [width]="myWidth"
+                 [height]="myHeight"
+                 [minWidth]="myMinWidth"
+                 [minHeight]="myMinHeight"
+                 [backdropClass]="myBackdropClass"
+                 [scrollStrategy]="myScrollStrategy"
+                 [open]="isOpen"
+                 [hasBackdrop]="hasBackdrop">
+    </ng-template>
+  `
+})
+class A {}

package/schematics/schematics/ng-update/test-cases/v6/property-names_expected_output.ts

@@ -0,0 +1,64 @@
+class CdkConnectedOverlay {
+  _deprecatedOrigin: any;
+  _deprecatedPositions: any;
+  _deprecatedOffsetX: any;
+  _deprecatedOffsetY: any;
+  _deprecatedWidth: any;
+  _deprecatedHeight: any;
+  _deprecatedMinWidth: any;
+  _deprecatedMinHeight: any;
+  _deprecatedBackdropClass: any;
+  _deprecatedScrollStrategy: any;
+  _deprecatedOpen: any;
+  _deprecatedHasBackdrop: any;
+}
+
+class CdkPortalOutlet {
+  _deprecatedPortal: any;
+  _deprecatedPortalHost: any;
+}
+
+class A {
+  self = {me: this};
+
+  constructor(private a: CdkConnectedOverlay) {}
+
+  onAngularClick() {
+    this.a.origin = '1';
+    this.a.positions = '2';
+    this.a.offsetX = '3';
+    this.a.offsetY = '4';
+    this.a.height = '5';
+
+    console.log(this.a.width || 10);
+    console.log(this.a.minWidth || this.a.minHeight);
+
+    this.self.me.a.backdropClass = ['a', 'b', 'c'];
+
+    const x = ({test: true} || this.a);
+
+    if (this.isConnectedOverlay(x)) {
+      x.scrollStrategy = 'myScrollStrategy';
+      x.open = false;
+      x.hasBackdrop = true;
+    }
+  }
+
+  isConnectedOverlay(val: any): val is CdkConnectedOverlay {
+    return val instanceof CdkConnectedOverlay;
+  }
+}
+
+class B {
+  self = {me: this};
+
+  constructor(protected a: CdkPortalOutlet) {}
+
+  onClick() {
+    this.a.portal = this.a.portal = 'myNewPortal';
+
+    if (this.self.me.a) {
+      console.log(this.a.portal || this.self.me.a.portal);
+    }
+  }
+}

package/schematics/schematics/ng-update/test-cases/v6/property-names_input.ts

@@ -0,0 +1,64 @@
+class CdkConnectedOverlay {
+  _deprecatedOrigin: any;
+  _deprecatedPositions: any;
+  _deprecatedOffsetX: any;
+  _deprecatedOffsetY: any;
+  _deprecatedWidth: any;
+  _deprecatedHeight: any;
+  _deprecatedMinWidth: any;
+  _deprecatedMinHeight: any;
+  _deprecatedBackdropClass: any;
+  _deprecatedScrollStrategy: any;
+  _deprecatedOpen: any;
+  _deprecatedHasBackdrop: any;
+}
+
+class CdkPortalOutlet {
+  _deprecatedPortal: any;
+  _deprecatedPortalHost: any;
+}
+
+class A {
+  self = {me: this};
+
+  constructor(private a: CdkConnectedOverlay) {}
+
+  onAngularClick() {
+    this.a._deprecatedOrigin = '1';
+    this.a._deprecatedPositions = '2';
+    this.a._deprecatedOffsetX = '3';
+    this.a._deprecatedOffsetY = '4';
+    this.a._deprecatedHeight = '5';
+
+    console.log(this.a._deprecatedWidth || 10);
+    console.log(this.a._deprecatedMinWidth || this.a._deprecatedMinHeight);
+
+    this.self.me.a._deprecatedBackdropClass = ['a', 'b', 'c'];
+
+    const x = ({test: true} || this.a);
+
+    if (this.isConnectedOverlay(x)) {
+      x._deprecatedScrollStrategy = 'myScrollStrategy';
+      x._deprecatedOpen = false;
+      x._deprecatedHasBackdrop = true;
+    }
+  }
+
+  isConnectedOverlay(val: any): val is CdkConnectedOverlay {
+    return val instanceof CdkConnectedOverlay;
+  }
+}
+
+class B {
+  self = {me: this};
+
+  constructor(protected a: CdkPortalOutlet) {}
+
+  onClick() {
+    this.a._deprecatedPortal = this.a._deprecatedPortalHost = 'myNewPortal';
+
+    if (this.self.me.a) {
+      console.log(this.a._deprecatedPortalHost || this.self.me.a._deprecatedPortal);
+    }
+  }
+}

package/schematics/schematics/ng-update/test-cases/v7/property-names_expected_output.ts

@@ -0,0 +1,28 @@
+import {EventEmitter, OnInit} from '@angular/core';
+
+class SelectionModel {
+  onChange = new EventEmitter<void>();
+}
+
+class CdkConnectedOverlay {
+  flexibleDiemsions: boolean;
+}
+
+/* Actual test case using the previously defined definitions. */
+
+class A implements OnInit {
+  self = {me: this};
+
+  constructor(private a: SelectionModel, private b: CdkConnectedOverlay) {}
+
+  ngOnInit() {
+    this.a.changed.subscribe(() => console.log('Changed'));
+    this.self.me.a.changed.subscribe(() => console.log('Changed 2'));
+
+    if (this.b.flexibleDimensions) {
+      console.log(this.b.flexibleDimensions ? 'true' : 'false');
+    }
+
+    const _state = this.self.me.b.flexibleDimensions.toString() || 'not-defined';
+  }
+}

package/schematics/schematics/ng-update/test-cases/v7/property-names_input.ts

@@ -0,0 +1,28 @@
+import {EventEmitter, OnInit} from '@angular/core';
+
+class SelectionModel {
+  onChange = new EventEmitter<void>();
+}
+
+class CdkConnectedOverlay {
+  flexibleDiemsions: boolean;
+}
+
+/* Actual test case using the previously defined definitions. */
+
+class A implements OnInit {
+  self = {me: this};
+
+  constructor(private a: SelectionModel, private b: CdkConnectedOverlay) {}
+
+  ngOnInit() {
+    this.a.onChange.subscribe(() => console.log('Changed'));
+    this.self.me.a.onChange.subscribe(() => console.log('Changed 2'));
+
+    if (this.b.flexibleDiemsions) {
+      console.log(this.b.flexibleDiemsions ? 'true' : 'false');
+    }
+
+    const _state = this.self.me.b.flexibleDiemsions.toString() || 'not-defined';
+  }
+}

package/schematics/schematics/ng-update/typescript/base-types.ts

@@ -0,0 +1,22 @@
+/**
+ * @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.io/license
+ */
+
+import * as ts from 'typescript';
+
+/** Determines the base types of the specified class declaration. */
+export function determineBaseTypes(node: ts.ClassDeclaration): string[] | null {
+  if (!node.heritageClauses) {
+    return null;
+  }
+
+  return node.heritageClauses
+    .reduce((types, clause) => types.concat(clause.types), [] as ts.ExpressionWithTypeArguments[])
+    .map(typeExpression => typeExpression.expression)
+    .filter(expression => expression && ts.isIdentifier(expression))
+    .map(identifier => (identifier as ts.Identifier).text);
+}

package/schematics/schematics/ng-update/typescript/imports.ts

@@ -0,0 +1,54 @@
+/**
+ * @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.io/license
+ */
+
+import * as ts from 'typescript';
+
+/** Checks whether the given node is part of an import specifier node. */
+export function isImportSpecifierNode(node: ts.Node) {
+  return isPartOfKind(node, ts.SyntaxKind.ImportSpecifier);
+}
+
+/** Checks whether the given node is part of an export specifier node. */
+export function isExportSpecifierNode(node: ts.Node) {
+  return isPartOfKind(node, ts.SyntaxKind.ExportSpecifier);
+}
+
+/** Checks whether the given node is part of a namespace import. */
+export function isNamespaceImportNode(node: ts.Node) {
+  return isPartOfKind(node, ts.SyntaxKind.NamespaceImport);
+}
+
+/** Finds the parent import declaration of a given TypeScript node. */
+export function getImportDeclaration(node: ts.Node) {
+  return findDeclaration(node, ts.SyntaxKind.ImportDeclaration) as ts.ImportDeclaration;
+}
+
+/** Finds the parent export declaration of a given TypeScript node */
+export function getExportDeclaration(node: ts.Node) {
+  return findDeclaration(node, ts.SyntaxKind.ExportDeclaration) as ts.ExportDeclaration;
+}
+
+/** Finds the specified declaration for the given node by walking up the TypeScript nodes. */
+function findDeclaration<T extends ts.SyntaxKind>(node: ts.Node, kind: T) {
+  while (node.kind !== kind) {
+    node = node.parent;
+  }
+
+  return node;
+}
+
+/** Checks whether the given node is part of another TypeScript Node with the specified kind. */
+function isPartOfKind<T extends ts.SyntaxKind>(node: ts.Node, kind: T): boolean {
+  if (node.kind === kind) {
+    return true;
+  } else if (node.kind === ts.SyntaxKind.SourceFile) {
+    return false;
+  }
+
+  return isPartOfKind(node.parent, kind);
+}

package/schematics/schematics/ng-update/typescript/literal.ts

@@ -0,0 +1,32 @@
+/**
+ * @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.io/license
+ */
+
+import * as ts from 'typescript';
+
+/** Finds all start indices of the given search string in the input string. */
+export function findAllSubstringIndices(input: string, search: string): number[] {
+  const result: number[] = [];
+  let i = -1;
+  while ((i = input.indexOf(search, i + 1)) !== -1) {
+    result.push(i);
+  }
+  return result;
+}
+
+/**
+ * Checks whether the given node is either a string literal or a no-substitution template
+ * literal. Note that we cannot use `ts.isStringLiteralLike()` because if developers update
+ * an outdated project, their TypeScript version is not automatically being updated
+ * and therefore could throw because the function is not available yet.
+ * https://github.com/Microsoft/TypeScript/commit/8518343dc8762475a5e92c9f80b5c5725bd81796
+ */
+export function isStringLiteralLike(
+  node: ts.Node,
+): node is ts.StringLiteral | ts.NoSubstitutionTemplateLiteral {
+  return ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node);
+}

package/schematics/schematics/ng-update/typescript/module-specifiers.ts

@@ -0,0 +1,39 @@
+/**
+ * @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.io/license
+ */
+
+import * as ts from 'typescript';
+import {getExportDeclaration, getImportDeclaration} from '../typescript/imports';
+
+/** Name of the Angular Material module specifier. */
+export const materialModuleSpecifier = '@dugararchit/material';
+
+/** Name of the Angular CDK module specifier. */
+export const cdkModuleSpecifier = '@dugararchit/cdk';
+
+/** Whether the specified node is part of an Angular Material or CDK import declaration. */
+export function isMaterialImportDeclaration(node: ts.Node) {
+  return isMaterialDeclaration(getImportDeclaration(node));
+}
+
+/** Whether the specified node is part of an Angular Material or CDK import declaration. */
+export function isMaterialExportDeclaration(node: ts.Node) {
+  return isMaterialDeclaration(getExportDeclaration(node));
+}
+
+/** Whether the declaration is part of Angular Material. */
+function isMaterialDeclaration(declaration: ts.ImportDeclaration | ts.ExportDeclaration) {
+  if (!declaration.moduleSpecifier) {
+    return false;
+  }
+
+  const moduleSpecifier = declaration.moduleSpecifier.getText();
+  return (
+    moduleSpecifier.indexOf(materialModuleSpecifier) !== -1 ||
+    moduleSpecifier.indexOf(cdkModuleSpecifier) !== -1
+  );
+}