eslint fixes

src/accordion/accordion-item.component.ts

@@ -48,7 +48,7 @@ import {
 			display: list-item;
 		}
 	`],
-	changeDetection: ChangeDetectionStrategy.OnPush	 
+	changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AccordionItem {
 	static accordionItemCount = 0;

src/breadcrumb/breadcrumb-item.component.ts

@@ -29,7 +29,7 @@ import { Router } from "@angular/router";
 			<ng-container *ngTemplateOutlet="content" />
 		}
 	`,
-	changeDetection: ChangeDetectionStrategy.OnPush	 
+	changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class BreadcrumbItemComponent {
 	@Input() set href(v: string) {

src/breadcrumb/breadcrumb.component.ts

@@ -123,7 +123,7 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
 			}
 		</nav>
 	`,
-	changeDetection: ChangeDetectionStrategy.OnPush	 
+	changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class Breadcrumb implements AfterContentInit {
 	@ContentChildren(BreadcrumbItemComponent) children: QueryList<BreadcrumbItemComponent>;

src/checkbox/checkbox-exported-tests.ts

@@ -33,10 +33,10 @@ class CheckboxExportedTests extends ComponentTests {
 							afterClickState
 						});
 					}),
-					runComparison: results => {
-					// eslint-disable-next-line no-unused-expressions
+				runComparison: results => {
+					// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 					expect(results.initialState).to.be.false;
-					// eslint-disable-next-line no-unused-expressions
+					// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 					expect(results.afterClickState).to.be.true;
 				}
 			}

src/checkbox/stories/reactive-form.component.ts

@@ -34,6 +34,7 @@ export class ReactiveFormsStory implements OnInit {
 	toggleDisable() {
 		const checkbox = this.formGroup.get("checkbox");
 		if (checkbox != null) {
+			// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 			checkbox.disabled ? checkbox.enable() : checkbox.disable();
 		}
 	}

src/code-snippet/code-snippet.component.ts

@@ -67,7 +67,12 @@ export enum SnippetType {
 					}
 				}
 				@if (!skeleton) {
-					<pre #codeContent (scroll)="(display === 'multi' ? handleScroll() : null)"><code #code><ng-container *ngTemplateOutlet="codeTemplate" /></code></pre>
+					<pre
+						#codeContent
+						(scroll)="(display === 'multi' ? handleScroll() : null)"
+					>
+						<code #code><ng-container *ngTemplateOutlet="codeTemplate" /></code>
+					</pre>
 				}
 			</div>
 			@if (hasLeft) {
@@ -85,7 +90,12 @@ export enum SnippetType {
 					(click)="toggleSnippetExpansion()"
 					type="button">
 					<span class="cds--snippet-btn--text">{{expanded ? translations.SHOW_LESS : translations.SHOW_MORE}}</span>
-					<svg cdsIcon="chevron--down" size="16" class="cds--icon-chevron--down" [attr.aria-label]="translations.SHOW_MORE_ICON"></svg>
+					<svg
+						cdsIcon="chevron--down"
+						size="16"
+						class="cds--icon-chevron--down"
+						[attr.aria-label]="translations.SHOW_MORE_ICON"
+					></svg>
 				</button>
 			}
 		}

src/common/tab.service.ts

@@ -1,7 +1,7 @@
-export let tabbableSelector = "a[href], area[href], input:not([disabled]):not([tabindex=\'-1\']), " +
-		"button:not([disabled]):not([tabindex=\'-1\']),select:not([disabled]):not([tabindex=\'-1\']), " +
-		"textarea:not([disabled]):not([tabindex=\'-1\']), " +
-		"iframe, object, embed, *[tabindex]:not([tabindex=\'-1\']), *[contenteditable=true]";
+export let tabbableSelector = "a[href], area[href], input:not([disabled]):not([tabindex='-1']), " +
+		"button:not([disabled]):not([tabindex='-1']),select:not([disabled]):not([tabindex='-1']), " +
+		"textarea:not([disabled]):not([tabindex='-1']), " +
+		"iframe, object, embed, *[tabindex]:not([tabindex='-1']), *[contenteditable=true]";
 
 export let tabbableSelectorIgnoreTabIndex = "a[href], area[href], input:not([disabled]), " +
 		"button:not([disabled]),select:not([disabled]), " +

src/contained-list/contained-list.component.spec.ts

@@ -115,7 +115,8 @@ describe("ContainedList", () => {
 			const wrapperFixture: ComponentFixture<WrapperComponent> = TestBed.createComponent(WrapperComponent);
 			wrapperFixture.detectChanges();
 
-			const actionElementRef = wrapperFixture.nativeElement.querySelector(".cds--contained-list .cds--contained-list__action ibm-icon-button");
+			const actionElementRef = wrapperFixture.nativeElement
+				.querySelector(".cds--contained-list .cds--contained-list__action ibm-icon-button");
 			expect(actionElementRef).toBeTruthy();
 		});
 	});
@@ -141,7 +142,8 @@ describe("ContainedList", () => {
 			const wrapperFixture: ComponentFixture<WrapperComponent> = TestBed.createComponent(WrapperComponent);
 			wrapperFixture.detectChanges();
 
-			const iconElement = wrapperFixture.debugElement.query(By.css(".cds--contained-list-item:nth-child(3) svg[ng-reflect-ibm-icon='apple']"));
+			const iconElement = wrapperFixture.debugElement
+				.query(By.css(".cds--contained-list-item:nth-child(3) svg[ng-reflect-ibm-icon='apple']"));
 			expect(iconElement).toBeTruthy();
 		});
 

src/contained-list/contained-list.stories.ts

@@ -82,7 +82,12 @@ const usageExamplesTemplate = () => ({
 		</ng-template>
 		<ng-template #overflowMenu let-item>
 			<ibm-tooltip class="cds--icon-tooltip" description="Options" align="left">
-				<ibm-overflow-menu [flip]="true" [customTrigger]="customTrigger" triggerClass="cds--toolbar-action" [offset]="{ x: 0, y: 0 }">
+				<ibm-overflow-menu
+					[flip]="true"
+					[customTrigger]="customTrigger"
+					triggerClass="cds--toolbar-action"
+					[offset]="{ x: 0, y: 0 }"
+				>
 					<ibm-overflow-menu-option>View details</ibm-overflow-menu-option>
 					<ibm-overflow-menu-option>Edit</ibm-overflow-menu-option>
 					<ibm-overflow-menu-option [divider]="true" type="danger">Remove</ibm-overflow-menu-option>

src/context-menu/context-menu.component.ts

@@ -75,7 +75,7 @@ export class ContextMenuComponent implements OnChanges {
 		const menuItems: HTMLElement[] = (
 			Array.from(list.querySelectorAll(".cds--menu-item")) as HTMLElement[])
 			.filter(menuItem => !subMenus.some(subMenu => subMenu.contains(menuItem))
-		);
+			);
 		const currentIndex = menuItems.findIndex(menuItem => parseInt(menuItem.getAttribute("tabindex"), 10) === 0);
 		const currentMenuItem = menuItems[currentIndex];
 

src/datepicker/carbon-flatpickr-month-select.ts

@@ -48,6 +48,7 @@ export const carbonFlatpickrMonthSelectPlugin = fp => {
 			0,
 			fp.monthElements.length,
 			...fp.monthElements.map(() => {
+				// eslint-disable-next-line no-underscore-dangle
 				const monthElement = fp._createElement(
 					"span",
 					config.classFlatpickrCurrentMonth

src/datepicker/datepicker.component.ts

@@ -643,7 +643,7 @@ export class DatePicker implements
 				singleDate = this.flatpickrInstance.parseDate(this.flatpickrInstance.selectedDates[0], this.dateFormat);
 				singleDate = this.flatpickrInstance.formatDate(singleDate, this.dateFormat);
 			// if date is not a string we can assume it's a Date and we should format
-			} else if (!!this.flatpickrInstance.selectedDates[0]) {
+			} else if (this.flatpickrInstance.selectedDates[0]) {
 				singleDate = this.flatpickrInstance.formatDate(this.flatpickrInstance.selectedDates[0], this.dateFormat);
 			}
 
@@ -655,7 +655,7 @@ export class DatePicker implements
 					rangeDate = this.flatpickrInstance.parseDate(this.flatpickrInstance.selectedDates[1].toString(), this.dateFormat);
 					rangeDate = this.flatpickrInstance.formatDate(rangeDate, this.dateFormat);
 				// if date is not a string we can assume it's a Date and we should format
-				} else if (!!this.flatpickrInstance.selectedDates[1]) {
+				} else if (this.flatpickrInstance.selectedDates[1]) {
 					rangeDate = this.flatpickrInstance.formatDate(this.flatpickrInstance.selectedDates[1], this.dateFormat);
 				}
 				setTimeout(() => {

src/dialog/dialog.component.ts

@@ -137,7 +137,7 @@ export class Dialog implements OnInit, AfterViewInit, OnDestroy {
 						});
 					}
 				}
-			);
+				);
 		}
 
 		this.placeDialog();

src/dialog/overflow-menu/overflow-menu-option.component.ts

@@ -109,7 +109,7 @@ export class OverflowMenuOption implements AfterViewInit {
 	@Input() set target(value: Target) {
 		if (!Object.values(Target).includes(value)) {
 			console.warn(
-`\`target\` must have one of the following values: ${Object.values(Target).join(", ")}.
+				`\`target\` must have one of the following values: ${Object.values(Target).join(", ")}.
 Please use the \`Target\` enum exported by carbon-components-angular`);
 			return;
 		}

src/dialog/overflow-menu/overflow-menu.stories.ts

@@ -18,7 +18,7 @@ export default {
 		})
 	],
 	args: {
-			placement: "bottom"
+		placement: "bottom"
 	},
 	argTypes: {
 		code: {
@@ -87,10 +87,18 @@ const LinkTemplate = (args) => ({
 				<cds-overflow-menu-option href="https://www.ibm.com" (selected)="selected($event)" (click)="click($event)">
 					An example option that is really long to show what should be done to handle long text
 				</cds-overflow-menu-option>
-				<cds-overflow-menu-option href="https://www.ibm.com" target="_blank" (selected)="selected($event)">Option 2</cds-overflow-menu-option>
+				<cds-overflow-menu-option
+					href="https://www.ibm.com"
+					target="_blank"
+					(selected)="selected($event)"
+				>Option 2</cds-overflow-menu-option>
 				<cds-overflow-menu-option href="https://www.ibm.com" (selected)="selected($event)">Option 3</cds-overflow-menu-option>
 				<cds-overflow-menu-option href="https://www.ibm.com" (selected)="selected($event)">Option 4</cds-overflow-menu-option>
-				<cds-overflow-menu-option href="https://www.ibm.com" disabled="true" (selected)="selected($event)">Disabled</cds-overflow-menu-option>
+				<cds-overflow-menu-option
+					href="https://www.ibm.com"
+					disabled="true"
+					(selected)="selected($event)"
+				>Disabled</cds-overflow-menu-option>
 				<cds-overflow-menu-option href="https://www.ibm.com" type="danger" (selected)="selected($event)">
 					Danger option
 				</cds-overflow-menu-option>

src/dropdown/list/dropdown-list.component.spec.ts

@@ -12,8 +12,8 @@ import { I18nModule } from "../../i18n/index";
 })
 class DropdownListTest {
 	items = [
-		<ListItem>{content: "one", selected: false},
-		<ListItem>{content: "two", selected: false}
+		({content: "one", selected: false} as ListItem),
+		({content: "two", selected: false} as ListItem)
 	];
 	selected: ListItem;
 	onSelect(ev) {
@@ -26,8 +26,8 @@ class DropdownListTest {
 })
 class MultiTest {
 	items = [
-		<ListItem>{content: "one", selected: false},
-		<ListItem>{content: "two", selected: false}
+		({content: "one", selected: false} as ListItem),
+		({content: "two", selected: false} as ListItem)
 	];
 	selected: ListItem[];
 	onSelect(ev) {
@@ -71,9 +71,9 @@ describe("Dropdown list", () => {
 
 	it("should disable a list-item", () => {
 		wrapper.items = [
-			<ListItem>{content: "one", selected: false},
-			<ListItem>{content: "two", selected: false, disabled: false},
-			<ListItem>{content: "three", selected: false, disabled: true}
+			({content: "one", selected: false} as ListItem),
+			({content: "two", selected: false, disabled: false} as ListItem),
+			({content: "three", selected: false, disabled: true} as ListItem)
 		];
 		fixture.detectChanges();
 		const disabledEls = fixture.debugElement.queryAll(By.css(".cds--list-box__menu-item[disabled]"));
@@ -126,9 +126,9 @@ describe("Dropdown multi list", () => {
 
 	it("should disable a list-item and its checkbox", () => {
 		wrapper.items = [
-			<ListItem>{content: "one", selected: false},
-			<ListItem>{content: "two", selected: false, disabled: false},
-			<ListItem>{content: "three", selected: false, disabled: true}
+			({content: "one", selected: false} as ListItem),
+			({content: "two", selected: false, disabled: false} as ListItem),
+			({content: "three", selected: false, disabled: true} as ListItem)
 		];
 		fixture.detectChanges();
 		const disabledEls = fixture.debugElement.queryAll(By.css(".cds--list-box__menu-item[disabled]"));

src/file-uploader/file-uploader.component.spec.ts

@@ -74,7 +74,7 @@ describe("FileUploader", () => {
 	it("should only accept .txt files", () => {
 		fixture = TestBed.createComponent(FileUploaderTest);
 		fixture.detectChanges();
-		element = fixture.debugElement.query(By.css("cds-file-uploader"));
+		element = fixture.debugElement.query(By.css("cds-file-uploader"));
 		expect(element.nativeElement.querySelector(".cds--file-input").getAttribute("accept")).toEqual(".txt");
 	});
 

src/i18n/i18n.service.ts

@@ -135,7 +135,7 @@ export class Overridable {
 /**
  * An object of strings, should follow the same format as src/i18n/en.json
  */
-export type TranslationStrings = { [key: string]: string };
+export interface TranslationStrings { [key: string]: string }
 
 
 /**

src/index.stories.ts

@@ -112,7 +112,7 @@ import { IconModule } from "./icon/icon.module";
 			</div>
 		</section>
 	`,
-	/* eslint-disable max-len */
+
 	styles: [`
 		.overview-page__banner {
 			height: 100vh;

src/input/label.component.ts

@@ -211,7 +211,7 @@ export class Label implements AfterContentInit, AfterViewInit {
 	@ContentChild(TextInput, { static: false }) textInput: TextInput;
 
 	@ContentChild(PasswordInput, { static: false })
-	passwordInput: PasswordInput;
+		passwordInput: PasswordInput;
 
 	@HostBinding("class.cds--form-item") get labelClass() {
 		return this.type === undefined;

src/layer/layer.directive.ts

@@ -59,6 +59,7 @@ export class LayerDirective implements AfterContentInit {
 					if (layer === this) {
 						return;
 					}
+					// eslint-disable-next-line no-underscore-dangle
 					layer.layer = typeof layer._passedLevel === "number" ? layer._passedLevel : this.layer + 1;
 				});
 			}

src/modal/modal.component.ts

@@ -41,7 +41,13 @@ import { BaseModalService } from "./base-modal.service";
 					<cds-modal-header (closeSelect)="closeModal()">Header text</cds-modal-header>
 						<section class="modal-body">
 							<h1>Sample modal works.</h1>
-							<button class="btn--icon-link" nPopover="Hello there" title="Popover title" placement="right" appendInline="true">
+							<button
+ 								class="btn--icon-link"
+ 								nPopover="Hello there"
+ 								title="Popover title"
+ 								placement="right"
+ 								appendInline="true"
+ 							>
 								<svg cdsIcon="info" size="sm"></svg>
 							</button>
 							{{modalText}}
@@ -134,7 +140,8 @@ export class Modal implements AfterViewInit, OnChanges, OnDestroy {
 	@Input() hasScrollingContent: boolean = null;
 
 	/**
-	 * Emits event when click occurs within `n-overlay` element. This is to track click events occurring outside bounds of the `Modal` object.
+	 * Emits event when click occurs within `n-overlay` element.
+	 * This is to track click events occurring outside bounds of the `Modal` object.
 	 */
 	@Output() overlaySelected = new EventEmitter();
 	/**

src/notification/actionable-notification.component.ts

@@ -92,10 +92,14 @@ export class ActionableNotification extends BaseNotification {
 	@HostBinding("class.cds--actionable-notification--toast") get toastVariant() { return this.notificationObj.variant === "toast"; }
 	@HostBinding("class.cds--actionable-notification--error") get isError() { return this.notificationObj.type === "error"; }
 	@HostBinding("class.cds--actionable-notification--info") get isInfo() { return this.notificationObj.type === "info"; }
-	@HostBinding("class.cds--actionable-notification--info-square") get isInfoSquare() { return this.notificationObj.type === "info-square"; }
+	@HostBinding("class.cds--actionable-notification--info-square") get isInfoSquare() {
+		return this.notificationObj.type === "info-square";
+	}
 	@HostBinding("class.cds--actionable-notification--success") get isSuccess() { return this.notificationObj.type === "success"; }
 	@HostBinding("class.cds--actionable-notification--warning") get isWarning() { return this.notificationObj.type === "warning"; }
-	@HostBinding("class.cds--actionable-notification--warning-alt") get isWarningAlt() { return this.notificationObj.type === "warning-alt"; }
+	@HostBinding("class.cds--actionable-notification--warning-alt") get isWarningAlt() {
+		return this.notificationObj.type === "warning-alt";
+	}
 	@HostBinding("class.cds--actionable-notification--low-contrast") get isLowContrast() { return this.notificationObj.lowContrast; }
 	@HostBinding("class.cds--actionable-notification--hide-close-button") get isCloseHidden() { return !this._notificationObj.showClose; }
 

src/number-input/number.component.ts

@@ -456,7 +456,7 @@ export class NumberComponent implements ControlValueAccessor {
 	}
 
 	handleFocus(event: FocusEvent) {
-		if ("type" in event.target && (<HTMLInputElement>event.target).type === "button") {
+		if ("type" in event.target && (event.target as HTMLInputElement).type === "button") {
 			this._isFocused = false;
 		} else {
 			this._isFocused = event.type === "focus";

src/pagination/pagination-nav/pagination-nav.component.ts

@@ -67,7 +67,7 @@ export interface PaginationNavTranslations {
 					<cds-pagination-nav-item
 						page="1"
 						(click)="currentPage = 1"
-						[isActive]="currentPage == 1">
+						[isActive]="currentPage === 1">
 					</cds-pagination-nav-item>
 				}
 				@if (frontCuts) {
@@ -81,7 +81,7 @@ export interface PaginationNavTranslations {
 					<cds-pagination-nav-item
 						[page]="page"
 						(click)="currentPage = page"
-						[isActive]="currentPage == page">
+						[isActive]="currentPage === page">
 					</cds-pagination-nav-item>
 				}
 				@if (backCuts) {
@@ -95,7 +95,7 @@ export interface PaginationNavTranslations {
 					<cds-pagination-nav-item
 						[page]="totalNumbersArray.length"
 						(click)="currentPage = totalNumbersArray.length"
-						[isActive]="currentPage == totalNumbersArray.length">
+						[isActive]="currentPage === totalNumbersArray.length">
 					</cds-pagination-nav-item>
 				}
 				<li class="cds--pagination-nav__list-item">

src/pagination/pagination.component.ts

@@ -51,8 +51,9 @@ export interface PaginationTranslations {
  */
 @Component({
 	selector: "cds-pagination, ibm-pagination",
-	template: `
-		<div
+	template:
+		/* eslint-disable max-len */
+		`<div
 			class="cds--pagination"
 			[ngClass]="{
 				'cds--skeleton': skeleton
@@ -210,8 +211,8 @@ export interface PaginationTranslations {
 					</div>
 				</div>
 			}
-		</div>
-	`
+		</div>`
+	/* eslint-enable max-len */
 })
 export class Pagination {
 	static paginationCounter = 0;