diff --git a/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.html b/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.html
index a5f6e89e34..4266929856 100644
--- a/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.html
+++ b/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.html
@@ -1,7 +1,7 @@
 <mat-checkbox class="mat-primary"
     color="primary"
     [(ngModel)]="authoringComponentContent.excludeFromTotalScore"
-    (change)="excludeFromTotalScoreChanged.next($event)"
+    (change)="inputChanged.next($event)"
     i18n>
   Do not count score on this activity towards the total score
 </mat-checkbox>
diff --git a/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.ts b/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.ts
index c1a0bb084c..ef5b6b1551 100644
--- a/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.ts
+++ b/src/app/authoring-tool/edit-component-exclude-from-total-score/edit-component-exclude-from-total-score.component.ts
@@ -1,29 +1,8 @@
-import { Component, Input } from '@angular/core';
-import { Subject, Subscription } from 'rxjs';
-import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
-import { TeacherProjectService } from '../../../assets/wise5/services/teacherProjectService';
+import { Component } from '@angular/core';
+import { EditComponentFieldComponent } from '../edit-component-field.component';
 
 @Component({
   selector: 'edit-component-exclude-from-total-score',
   templateUrl: 'edit-component-exclude-from-total-score.component.html'
 })
-export class EditComponentExcludeFromTotalScoreComponent {
-  @Input()
-  authoringComponentContent: any;
-  excludeFromTotalScoreChanged: Subject<string> = new Subject<string>();
-  excludeFromTotalScoreChangedSubscription: Subscription;
-
-  constructor(private ProjectService: TeacherProjectService) {}
-
-  ngOnInit() {
-    this.excludeFromTotalScoreChangedSubscription = this.excludeFromTotalScoreChanged
-      .pipe(debounceTime(1000), distinctUntilChanged())
-      .subscribe(() => {
-        this.ProjectService.componentChanged();
-      });
-  }
-
-  ngOnDestroy() {
-    this.excludeFromTotalScoreChangedSubscription.unsubscribe();
-  }
-}
+export class EditComponentExcludeFromTotalScoreComponent extends EditComponentFieldComponent {}
diff --git a/src/app/authoring-tool/edit-component-field.component.ts b/src/app/authoring-tool/edit-component-field.component.ts
new file mode 100644
index 0000000000..30b2d68f84
--- /dev/null
+++ b/src/app/authoring-tool/edit-component-field.component.ts
@@ -0,0 +1,26 @@
+import { Directive, Input } from '@angular/core';
+import { Subject, Subscription } from 'rxjs';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import { TeacherProjectService } from '../../assets/wise5/services/teacherProjectService';
+
+@Directive()
+export abstract class EditComponentFieldComponent {
+  @Input()
+  authoringComponentContent: any;
+  inputChanged: Subject<string> = new Subject<string>();
+  inputChangedSubscription: Subscription;
+
+  constructor(private ProjectService: TeacherProjectService) {}
+
+  ngOnInit() {
+    this.inputChangedSubscription = this.inputChanged
+      .pipe(debounceTime(1000), distinctUntilChanged())
+      .subscribe(() => {
+        this.ProjectService.componentChanged();
+      });
+  }
+
+  ngOnDestroy() {
+    this.inputChangedSubscription.unsubscribe();
+  }
+}
diff --git a/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html b/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html
index f12507118f..4d18ba171c 100644
--- a/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html
+++ b/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html
@@ -3,5 +3,5 @@
   <input matInput
          type='number'
          [(ngModel)]='authoringComponentContent.maxScore'
-         (ngModelChange)='maxScoreChanged.next($event)'/>
+         (ngModelChange)='inputChanged.next($event)'/>
 </mat-form-field>
diff --git a/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.ts b/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.ts
index 7afdce1d9f..b74a8f29c6 100644
--- a/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.ts
+++ b/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.ts
@@ -1,29 +1,8 @@
-import { Component, Input } from '@angular/core';
-import { Subject, Subscription } from 'rxjs';
-import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
-import { TeacherProjectService } from '../../../assets/wise5/services/teacherProjectService';
+import { Component } from '@angular/core';
+import { EditComponentFieldComponent } from '../edit-component-field.component';
 
 @Component({
   selector: 'edit-component-max-score',
   templateUrl: 'edit-component-max-score.component.html'
 })
-export class EditComponentMaxScoreComponent {
-  @Input()
-  authoringComponentContent: any;
-  maxScoreChanged: Subject<string> = new Subject<string>();
-  maxScoreChangedSubscription: Subscription;
-
-  constructor(private ProjectService: TeacherProjectService) {}
-
-  ngOnInit() {
-    this.maxScoreChangedSubscription = this.maxScoreChanged
-      .pipe(debounceTime(1000), distinctUntilChanged())
-      .subscribe(() => {
-        this.ProjectService.componentChanged();
-      });
-  }
-
-  ngOnDestroy() {
-    this.maxScoreChangedSubscription.unsubscribe();
-  }
-}
+export class EditComponentMaxScoreComponent extends EditComponentFieldComponent {}
diff --git a/src/app/authoring-tool/edit-component-width/edit-component-width.component.html b/src/app/authoring-tool/edit-component-width/edit-component-width.component.html
index 6225f7a717..a6275e0e3d 100644
--- a/src/app/authoring-tool/edit-component-width/edit-component-width.component.html
+++ b/src/app/authoring-tool/edit-component-width/edit-component-width.component.html
@@ -3,5 +3,5 @@
   <input matInput
          type='number'
          [(ngModel)]='authoringComponentContent.componentWidth'
-         (ngModelChange)='widthChanged.next($event)'/>
+         (ngModelChange)='inputChanged.next($event)'/>
 </mat-form-field>
diff --git a/src/app/authoring-tool/edit-component-width/edit-component-width.component.ts b/src/app/authoring-tool/edit-component-width/edit-component-width.component.ts
index b02d40d85c..9a07c186f2 100644
--- a/src/app/authoring-tool/edit-component-width/edit-component-width.component.ts
+++ b/src/app/authoring-tool/edit-component-width/edit-component-width.component.ts
@@ -1,29 +1,8 @@
-import { Component, Input } from '@angular/core';
-import { Subject, Subscription } from 'rxjs';
-import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
-import { TeacherProjectService } from '../../../assets/wise5/services/teacherProjectService';
+import { Component } from '@angular/core';
+import { EditComponentFieldComponent } from '../edit-component-field.component';
 
 @Component({
   selector: 'edit-component-width',
   templateUrl: 'edit-component-width.component.html'
 })
-export class EditComponentWidthComponent {
-  @Input()
-  authoringComponentContent: any;
-  widthChanged: Subject<string> = new Subject<string>();
-  widthChangedSubscription: Subscription;
-
-  constructor(private ProjectService: TeacherProjectService) {}
-
-  ngOnInit() {
-    this.widthChangedSubscription = this.widthChanged
-      .pipe(debounceTime(1000), distinctUntilChanged())
-      .subscribe(() => {
-        this.ProjectService.componentChanged();
-      });
-  }
-
-  ngOnDestroy() {
-    this.widthChangedSubscription.unsubscribe();
-  }
-}
+export class EditComponentWidthComponent extends EditComponentFieldComponent {}