@dugararchit/cdk 0.0.0-dugararchit

package/schematics/schematics/collection.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
+  "schematics": {
+    "ng-add": {
+      "description": "Installs the Angular CDK",
+      "factory": "./ng-add/index",
+      "schema": "./ng-add/schema.json",
+      "aliases": ["install"],
+      "hidden": true
+    },
+    "drag-drop": {
+      "description": "Generates a component using the Drag and Drop module",
+      "factory": "./ng-generate/drag-drop/index",
+      "schema": "./ng-generate/drag-drop/schema.json",
+      "aliases": ["dragdrop", "drag-and-drop"]
+    }
+  }
+}

package/schematics/schematics/index.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
+ */
+
+export * from './utils';
+export * from './ng-update/public-api';
+export * from './update-tool/public-api';
+
+// Re-exported so that Angular Material schematic code can consume the
+// vendored "@schematics/angular" AST utils.
+export * from './utils/vendored-ast-utils';
+
+// Re-export parse5 from the CDK. Material schematics code cannot simply import
+// "parse5" because it could result in a different version. As long as we import
+// it from within the CDK, it will always be the correct version that is specified
+// in the CDK "package.json" as optional dependency.
+import * as parse5 from 'parse5';
+export {parse5};

package/schematics/schematics/migration.json

@@ -0,0 +1,50 @@
+{
+  "$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
+  "schematics": {
+    "migration-v6": {
+      "version": "6.0.0",
+      "description": "Updates the Angular CDK to v6",
+      "factory": "./ng-update/index#updateToV6"
+    },
+    "migration-v7": {
+      "version": "7.0.0",
+      "description": "Updates the Angular CDK to v7",
+      "factory": "./ng-update/index#updateToV7"
+    },
+    "migration-v8": {
+      "version": "8.0.0",
+      "description": "Updates the Angular CDK to v8",
+      "factory": "./ng-update/index#updateToV8"
+    },
+    "migration-v9": {
+      "version": "9.0.0-0",
+      "description": "Updates the Angular CDK to v9",
+      "factory": "./ng-update/index#updateToV9"
+    },
+    "migration-v10": {
+      "version": "10.0.0-0",
+      "description": "Updates the Angular CDK to v10",
+      "factory": "./ng-update/index#updateToV10"
+    },
+    "migration-v11": {
+      "version": "11.0.0-0",
+      "description": "Updates the Angular CDK to v11",
+      "factory": "./ng-update/index#updateToV11"
+    },
+    "migration-v12": {
+      "version": "12.0.0-0",
+      "description": "Updates the Angular CDK to v12",
+      "factory": "./ng-update/index#updateToV12"
+    },
+    "migration-v13": {
+      "version": "13.0.0-0",
+      "description": "Updates the Angular CDK to v13",
+      "factory": "./ng-update/index#updateToV13"
+    },
+    "ng-post-update": {
+      "description": "Prints out results after ng-update.",
+      "factory": "./ng-update/index#postUpdate",
+      "private": true
+    }
+  }
+}

package/schematics/schematics/ng-add/index.spec.ts

@@ -0,0 +1,50 @@
+import {Tree} from '@angular-devkit/schematics';
+import {SchematicTestRunner} from '@angular-devkit/schematics/testing';
+import {COLLECTION_PATH} from '../paths';
+import {createTestApp, getFileContent} from '../testing';
+import {addPackageToPackageJson} from './package-config';
+
+interface PackageJson {
+  dependencies: Record<string, string>;
+}
+
+describe('CDK ng-add', () => {
+  let runner: SchematicTestRunner;
+  let appTree: Tree;
+
+  beforeEach(async () => {
+    runner = new SchematicTestRunner('schematics', COLLECTION_PATH);
+    appTree = await createTestApp(runner);
+  });
+
+  it('should update the package.json', async () => {
+    const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
+    const dependencies = packageJson.dependencies;
+
+    expect(dependencies['@dugararchit/cdk']).toBe('~0.0.0-dugararchit');
+    expect(Object.keys(dependencies))
+      .withContext('Expected the modified "dependencies" to be sorted alphabetically.')
+      .toEqual(Object.keys(dependencies).sort());
+    expect(runner.tasks.some(task => task.name === 'node-package'))
+      .withContext('Expected the package manager to be scheduled in order to update lock files.')
+      .toBe(true);
+  });
+
+  it('should respect version range from CLI ng-add command', async () => {
+    // Simulates the behavior of the CLI `ng add` command. The command inserts the
+    // requested package version into the `package.json` before the actual schematic runs.
+    addPackageToPackageJson(appTree, '@dugararchit/cdk', '^9.0.0');
+
+    const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
+    const dependencies = packageJson.dependencies;
+
+    expect(dependencies['@dugararchit/cdk']).toBe('^9.0.0');
+    expect(runner.tasks.some(task => task.name === 'node-package'))
+      .withContext(
+        'Expected the package manager to not run since the CDK version ' + 'was already inserted.',
+      )
+      .toBe(false);
+  });
+});

package/schematics/schematics/ng-add/index.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 {Rule, SchematicContext, Tree} from '@angular-devkit/schematics';
+import {NodePackageInstallTask} from '@angular-devkit/schematics/tasks';
+import {addPackageToPackageJson, getPackageVersionFromPackageJson} from './package-config';
+
+/**
+ * Schematic factory entry-point for the `ng-add` schematic. The ng-add schematic will be
+ * automatically executed if developers run `ng add @dugararchit/cdk`.
+ *
+ * By default, the CLI already installs the package that has been specified with `ng add`.
+ * We just store the version in the `package.json` in case the package manager didn't. Also
+ * this ensures that there will be no error that says that the CDK does not support `ng add`.
+ */
+export default function (): Rule {
+  return (host: Tree, context: SchematicContext) => {
+    // The CLI inserts `@dugararchit/cdk` into the `package.json` before this schematic runs. This
+    // means that we do not need to insert the CDK into `package.json` files again. In some cases
+    // though, it could happen that this schematic runs outside of the CLI `ng add` command, or
+    // the CDK is only listed as a dev dependency. If that is the case, we insert a version based
+    // on the current build version (substituted version placeholder).
+    if (getPackageVersionFromPackageJson(host, '@dugararchit/cdk') === null) {
+      // In order to align the CDK version with other Angular dependencies that are setup by
+      // `@schematics/angular`, we use tilde instead of caret. This is default for Angular
+      // dependencies in new CLI projects.
+      addPackageToPackageJson(host, '@dugararchit/cdk', `~0.0.0-dugararchit`);
+
+      // Add a task to run the package manager. This is necessary because we updated the
+      // workspace "package.json" file and we want lock files to reflect the new version range.
+      context.addTask(new NodePackageInstallTask());
+    }
+  };
+}

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

@@ -0,0 +1,62 @@
+/**
+ * @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 {Tree} from '@angular-devkit/schematics';
+
+interface PackageJson {
+  dependencies: Record<string, string>;
+}
+
+/**
+ * Sorts the keys of the given object.
+ * @returns A new object instance with sorted keys
+ */
+function sortObjectByKeys(obj: Record<string, string>) {
+  return Object.keys(obj)
+    .sort()
+    .reduce((result, key) => {
+      result[key] = obj[key];
+      return result;
+    }, {} as Record<string, string>);
+}
+
+/** Adds a package to the package.json in the given host tree. */
+export function addPackageToPackageJson(host: Tree, pkg: string, version: string): Tree {
+  if (host.exists('package.json')) {
+    const sourceText = host.read('package.json')!.toString('utf-8');
+    const json = JSON.parse(sourceText) as PackageJson;
+
+    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. */
+export function getPackageVersionFromPackageJson(tree: Tree, name: string): string | null {
+  if (!tree.exists('package.json')) {
+    return null;
+  }
+
+  const packageJson = JSON.parse(tree.read('package.json')!.toString('utf8')) as PackageJson;
+
+  if (packageJson.dependencies && packageJson.dependencies[name]) {
+    return packageJson.dependencies[name];
+  }
+
+  return null;
+}

package/schematics/schematics/ng-add/schema.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "angular-cdk-ng-add",
+  "title": "Angular CDK ng-add",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    }
+  },
+  "required": []
+}

package/schematics/schematics/ng-add/schema.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.io/license
+ */
+
+export interface Schema {
+  /** Name of the project to target. */
+  project: string;
+}

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

@@ -0,0 +1,53 @@
+.container {
+  width: 400px;
+  max-width: 100%;
+  margin: 0 20px;
+  display: inline-block;
+  vertical-align: top;
+}
+
+.list {
+  border: solid 1px #ccc;
+  min-height: 60px;
+  background: white;
+  border-radius: 4px;
+  display: block;
+  overflow: hidden;
+}
+
+.list-item {
+  padding: 20px 10px;
+  border-bottom: solid 1px #ccc;
+  box-sizing: border-box;
+  cursor: move;
+  background: white;
+  color: black;
+  font-size: 14px;
+}
+
+.list-item:last-child {
+  border: none;
+}
+
+/* Highlight the list item that is being dragged. */
+.cdk-drag-preview {
+  border-radius: 4px;
+  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+              0 8px 10px 1px rgba(0, 0, 0, 0.14),
+              0 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+
+/* Animate items as they're being sorted. */
+.cdk-drop-list-dragging .cdk-drag {
+  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+/* Animate an item that has been dropped. */
+.cdk-drag-animating {
+  transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.cdk-drag-placeholder {
+  opacity: 0;
+}
+

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

@@ -0,0 +1,17 @@
+<div class="container">
+  <h2>To do</h2>
+
+  <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="todo"
+      [cdkDropListConnectedTo]="doneList" class="list" (cdkDropListDropped)="drop($event)">
+    <div class="list-item" *ngFor="let item of todo" cdkDrag>{{item}}</div>
+  </div>
+</div>
+
+<div class="container">
+  <h2>Done</h2>
+
+  <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="done"
+      [cdkDropListConnectedTo]="todoList" class="list" (cdkDropListDropped)="drop($event)">
+    <div class="list-item" *ngFor="let item of done" cdkDrag>{{item}}</div>
+  </div>
+</div>

package/schematics/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.spec.ts.template

@@ -0,0 +1,29 @@
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';
+
+describe('<%= classify(name) %>Component', () => {
+  let component: <%= classify(name) %>Component;
+  let fixture: ComponentFixture<<%= classify(name) %>Component>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ <%= classify(name) %>Component ],
+      imports: [
+        NoopAnimationsModule,
+        DragDropModule,
+      ]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(<%= classify(name) %>Component);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should compile', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/schematics/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template

@@ -0,0 +1,43 @@
+import { Component<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
+import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
+
+@Component({
+  selector: '<%= selector %>',<% if(inlineTemplate) { %>
+  template: `
+    <%= indentTextContent(resolvedFiles.template, 4) %>
+  `,<% } else { %>
+  templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %>
+  styles: [`
+    <%= indentTextContent(resolvedFiles.stylesheet, 4) %>
+  `],<% } else { %>
+  styleUrls: ['./<%= dasherize(name) %>.component.<%= style %>'],<% } %><% if(!!viewEncapsulation) { %>
+  encapsulation: ViewEncapsulation.<%= viewEncapsulation %>,<% } if (changeDetection !== 'Default') { %>
+  changeDetection: ChangeDetectionStrategy.<%= changeDetection %>,<% } %>
+})
+export class <%= classify(name) %>Component {
+  todo = [
+    'Get to work',
+    'Pick up groceries',
+    'Go home',
+    'Fall asleep'
+  ];
+
+  done = [
+    'Get up',
+    'Brush teeth',
+    'Take a shower',
+    'Check e-mail',
+    'Walk dog'
+  ];
+
+  drop(event: CdkDragDrop<string[]>): void {
+    if (event.previousContainer === event.container) {
+      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+    } else {
+      transferArrayItem(event.previousContainer.data,
+          event.container.data,
+          event.previousIndex,
+          event.currentIndex);
+    }
+  }
+}

package/schematics/schematics/ng-generate/drag-drop/index.spec.ts

@@ -0,0 +1,205 @@
+import {SchematicTestRunner} from '@angular-devkit/schematics/testing';
+import {COLLECTION_PATH} from '../../paths';
+import {createTestApp, getFileContent} from '../../testing';
+import {Schema} from './schema';
+
+describe('CDK drag-drop schematic', () => {
+  let runner: SchematicTestRunner;
+
+  const baseOptions: Schema = {
+    name: 'foo',
+    // TODO(devversion): rename project to something that is not tied to Material. This involves
+    // updating the other tests as well because `createTestApp` is responsible for creating
+    // the project.
+    project: 'material',
+  };
+
+  beforeEach(() => {
+    runner = new SchematicTestRunner('schematics', COLLECTION_PATH);
+  });
+
+  it('should create drag-drop files and add them to module', async () => {
+    const app = await createTestApp(runner);
+    const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
+    const moduleContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
+    const files = tree.files;
+
+    expect(files).toContain('/projects/material/src/app/foo/foo.component.css');
+    expect(files).toContain('/projects/material/src/app/foo/foo.component.html');
+    expect(files).toContain('/projects/material/src/app/foo/foo.component.spec.ts');
+    expect(files).toContain('/projects/material/src/app/foo/foo.component.ts');
+
+    expect(moduleContent).toMatch(/import.*Foo.*from '.\/foo\/foo.component'/);
+    expect(moduleContent).toMatch(/declarations:\s*\[[^\]]+?,\r?\n\s+FooComponent\r?\n/m);
+  });
+
+  it('should add drag-drop module', async () => {
+    const app = await createTestApp(runner);
+    const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
+    const moduleContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
+
+    expect(moduleContent).toContain('DragDropModule');
+  });
+
+  describe('style option', () => {
+    it('should respect the option value', async () => {
+      const tree = await runner
+        .runSchematicAsync(
+          'drag-drop',
+          {style: 'scss', ...baseOptions},
+          await createTestApp(runner),
+        )
+        .toPromise();
+
+      expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.scss');
+    });
+
+    it('should respect the deprecated "styleext" option value', async () => {
+      let tree = await createTestApp(runner);
+      tree.overwrite(
+        'angular.json',
+        JSON.stringify({
+          version: 1,
+          defaultProject: 'material',
+          projects: {
+            material: {
+              projectType: 'application',
+              schematics: {
+                // We need to specify the default component options by overwriting
+                // the existing workspace configuration because passing the "styleext"
+                // option is no longer supported. Though we want to verify that we
+                // properly handle old CLI projects which still use the "styleext" option.
+                '@schematics/angular:component': {styleext: 'scss'},
+              },
+              root: 'projects/material',
+            },
+          },
+        }),
+      );
+      tree = await runner.runSchematicAsync('drag-drop', baseOptions, tree).toPromise();
+
+      expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.scss');
+    });
+
+    it('should not generate invalid stylesheets', async () => {
+      const tree = await runner
+        .runSchematicAsync(
+          'drag-drop',
+          {style: 'styl', ...baseOptions},
+          await createTestApp(runner),
+        )
+        .toPromise();
+
+      // In this case we expect the schematic to generate a plain "css" file because
+      // the component schematics are using CSS style templates which are not compatible
+      // with all CLI supported styles (e.g. Stylus or Sass)
+      // In this case we expect the schematic to generate a plain "css" file because
+      // the component schematics are using CSS style templates which are not compatible
+      // with all CLI supported styles (e.g. Stylus or Sass)
+      expect(tree.files)
+        .withContext('Expected the schematic to generate a plain "css" file.')
+        .toContain('/projects/material/src/app/foo/foo.component.css');
+      expect(tree.files)
+        .not.withContext('Expected the schematic to not generate a "stylus" file')
+        .toContain('/projects/material/src/app/foo/foo.component.styl');
+    });
+
+    it('should fall back to the @schematics/angular:component option value', async () => {
+      const tree = await runner
+        .runSchematicAsync('drag-drop', baseOptions, await createTestApp(runner, {style: 'less'}))
+        .toPromise();
+
+      expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.less');
+    });
+  });
+
+  describe('inlineStyle option', () => {
+    it('should respect the option value', async () => {
+      const app = await createTestApp(runner);
+      const tree = await runner
+        .runSchematicAsync('drag-drop', {inlineStyle: true, ...baseOptions}, app)
+        .toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.css');
+    });
+
+    it('should fall back to the @schematics/angular:component option value', async () => {
+      const tree = await runner
+        .runSchematicAsync(
+          'drag-drop',
+          baseOptions,
+          await createTestApp(runner, {inlineStyle: true}),
+        )
+        .toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.css');
+    });
+  });
+
+  describe('inlineTemplate option', () => {
+    it('should respect the option value', async () => {
+      const app = await createTestApp(runner);
+      const tree = await runner
+        .runSchematicAsync('drag-drop', {inlineTemplate: true, ...baseOptions}, app)
+        .toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.html');
+    });
+
+    it('should fall back to the @schematics/angular:component option value', async () => {
+      const app = await createTestApp(runner, {inlineTemplate: true});
+      const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.html');
+    });
+  });
+
+  describe('skipTests option', () => {
+    it('should respect the option value', async () => {
+      const tree = await runner
+        .runSchematicAsync(
+          'drag-drop',
+          {skipTests: true, ...baseOptions},
+          await createTestApp(runner),
+        )
+        .toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
+    });
+
+    it('should respect the deprecated global "spec" option value', async () => {
+      let tree = await createTestApp(runner);
+      tree.overwrite(
+        'angular.json',
+        JSON.stringify({
+          version: 1,
+          defaultProject: 'material',
+          projects: {
+            material: {
+              projectType: 'application',
+              schematics: {
+                // We need to specify the default component options by overwriting
+                // the existing workspace configuration because passing the "spec"
+                // option is no longer supported. Though we want to verify that we
+                // properly handle old CLI projects which still use the "spec" option.
+                '@schematics/angular:component': {spec: false},
+              },
+              root: 'projects/material',
+            },
+          },
+        }),
+      );
+      tree = await runner.runSchematicAsync('drag-drop', baseOptions, tree).toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
+    });
+
+    it('should fall back to the @schematics/angular:component option value', async () => {
+      const tree = await runner
+        .runSchematicAsync('drag-drop', baseOptions, await createTestApp(runner, {skipTests: true}))
+        .toPromise();
+
+      expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
+    });
+  });
+});

package/schematics/schematics/ng-generate/drag-drop/index.ts

@@ -0,0 +1,35 @@
+/**
+ * @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 {chain, noop, Rule, Tree} from '@angular-devkit/schematics';
+import {addModuleImportToModule, buildComponent, findModuleFromOptions} from '../../utils';
+import {Schema} from './schema';
+
+/** Scaffolds a new Angular component that uses the Drag and Drop module. */
+export default function (options: Schema): Rule {
+  return chain([
+    buildComponent(
+      {...options},
+      {
+        template:
+          './__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html.template',
+        stylesheet:
+          './__path__/__name@dasherize@if-flat__/__name@dasherize__.component.__style__.template',
+      },
+    ),
+    options.skipImport ? noop() : addDragDropModulesToModule(options),
+  ]);
+}
+
+/** Adds the required modules to the main module of the CLI project. */
+function addDragDropModulesToModule(options: Schema) {
+  return async (host: Tree) => {
+    const modulePath = await findModuleFromOptions(host, options);
+    addModuleImportToModule(host, modulePath!, 'DragDropModule', '@dugararchit/cdk/drag-drop');
+  };
+}