chore: run lint autofix

Author: SkySails

example/gauge/.eslintrc.js

@@ -8,4 +8,4 @@ module.exports = {
     ecmaFeatures: { jsx: true },
     jsxPragma: "FSComponent",
   },
-}
+};

example/gauge/Components/Dropdown.tsx

@@ -1,13 +1,13 @@
-import { ComponentProps, DisplayComponent, FSComponent, Subject, VNode } from "@microsoft/msfs-sdk"
-import "./Dropdown.css"
+import { ComponentProps, DisplayComponent, FSComponent, Subject, VNode } from "@microsoft/msfs-sdk";
+import "./Dropdown.css";
 
 export class Dropdown extends DisplayComponent<ComponentProps> {
-  private readonly dropdownButtonRef = FSComponent.createRef<HTMLDivElement>()
-  private readonly dropdownMenuRef = FSComponent.createRef<HTMLUListElement>()
+  private readonly dropdownButtonRef = FSComponent.createRef<HTMLDivElement>();
+  private readonly dropdownMenuRef = FSComponent.createRef<HTMLUListElement>();
 
-  private readonly dropdownButtonText = Subject.create<string>("Select an item")
+  private readonly dropdownButtonText = Subject.create<string>("Select an item");
 
-  private navigationDataFormat: null | string = null
+  private navigationDataFormat: null | string = null;
 
   public render(): VNode {
     return (
@@ -17,50 +17,50 @@ export class Dropdown extends DisplayComponent<ComponentProps> {
         </div>
         <ul ref={this.dropdownMenuRef} class="dropdown-menu" />
       </div>
-    )
+    );
   }
 
   public onAfterRender(node: VNode): void {
-    super.onAfterRender(node)
+    super.onAfterRender(node);
 
-    const dropdownButton = this.dropdownButtonRef.instance
-    const dropdownMenu = this.dropdownMenuRef.instance
+    const dropdownButton = this.dropdownButtonRef.instance;
+    const dropdownMenu = this.dropdownMenuRef.instance;
 
     dropdownButton.addEventListener("click", function () {
-      dropdownMenu.style.display = dropdownMenu.style.display === "block" ? "none" : "block"
-    })
+      dropdownMenu.style.display = dropdownMenu.style.display === "block" ? "none" : "block";
+    });
 
     // Close the dropdown when clicking outside of it
-    document.addEventListener("click", this.onDropdownItemClick.bind(this))
+    document.addEventListener("click", this.onDropdownItemClick.bind(this));
   }
 
   public onDropdownItemClick(event: Event): void {
-    const dropdownButton = this.dropdownButtonRef.instance
-    const dropdownMenu = this.dropdownMenuRef.instance
+    const dropdownButton = this.dropdownButtonRef.instance;
+    const dropdownMenu = this.dropdownMenuRef.instance;
 
-    const target = event.target as HTMLElement
+    const target = event.target as HTMLElement;
     if (!target) {
-      return
+      return;
     }
     if (!dropdownMenu.contains(target) && !dropdownButton.contains(target)) {
-      dropdownMenu.style.display = "none"
+      dropdownMenu.style.display = "none";
     } else if (dropdownMenu.contains(target)) {
-      this.dropdownButtonText.set(target.textContent as string)
-      const navigationDataFormat = target.dataset.navigationDataFormat
+      this.dropdownButtonText.set(target.textContent!);
+      const navigationDataFormat = target.dataset.navigationDataFormat;
       if (navigationDataFormat) {
-        this.navigationDataFormat = navigationDataFormat
+        this.navigationDataFormat = navigationDataFormat;
       }
     }
   }
 
   public addDropdownItem(text: string, format: string): void {
-    const dropdownItem = document.createElement("li")
-    dropdownItem.textContent = text
-    dropdownItem.dataset.navigationDataFormat = format
-    this.dropdownMenuRef.instance.appendChild(dropdownItem)
+    const dropdownItem = document.createElement("li");
+    dropdownItem.textContent = text;
+    dropdownItem.dataset.navigationDataFormat = format;
+    this.dropdownMenuRef.instance.appendChild(dropdownItem);
   }
 
   public getNavigationDataFormat(): string | null {
-    return this.navigationDataFormat
+    return this.navigationDataFormat;
   }
 }

example/gauge/Components/Input.tsx

@@ -6,82 +6,82 @@ import {
   SubscribableUtils,
   UUID,
   VNode,
-} from "@microsoft/msfs-sdk"
-import { InterfaceNavbarItemV2 } from "./Utils"
+} from "@microsoft/msfs-sdk";
+import { InterfaceNavbarItemV2 } from "./Utils";
 
 interface InputProps extends ComponentProps {
-  value: Subscribable<string>
-  setValue: (value: string) => void
-  default?: Subscribable<string> | string
-  class?: string | Subscribable<string>
-  textarea?: boolean
+  value: Subscribable<string>;
+  setValue: (value: string) => void;
+  default?: Subscribable<string> | string;
+  class?: string | Subscribable<string>;
+  textarea?: boolean;
 }
 
 export class Input extends DisplayComponent<InputProps> {
-  private readonly inputId = UUID.GenerateUuid()
-  private readonly inputRef = FSComponent.createRef<HTMLInputElement>()
+  private readonly inputId = UUID.GenerateUuid();
+  private readonly inputRef = FSComponent.createRef<HTMLInputElement>();
 
   onAfterRender(node: VNode): void {
-    super.onAfterRender(node)
+    super.onAfterRender(node);
 
-    this.props.value.map(val => (this.inputRef.instance.value = val))
+    this.props.value.map(val => (this.inputRef.instance.value = val));
     SubscribableUtils.toSubscribable(this.props.default ?? "", true).map(val => {
-      this.inputRef.instance.placeholder = val
-    })
+      this.inputRef.instance.placeholder = val;
+    });
 
-    this.inputRef.instance.addEventListener("input", () => this.props.setValue(this.inputRef.instance.value ?? ""))
+    this.inputRef.instance.addEventListener("input", () => this.props.setValue(this.inputRef.instance.value ?? ""));
 
-    this.inputRef.instance.onfocus = this.onInputFocus
-    this.inputRef.instance.onblur = this.onInputBlur
+    this.inputRef.instance.onfocus = this.onInputFocus;
+    this.inputRef.instance.onblur = this.onInputBlur;
   }
 
   private getInputProps() {
-    return { value: this.props.value, class: this.props.class }
+    return { value: this.props.value, class: this.props.class };
   }
 
   /**
    * Method to handle when input focus is set
    * @param e The focus event.
    */
   private onInputFocus = (e: FocusEvent): void => {
-    e.preventDefault()
+    e.preventDefault();
 
-    Coherent.trigger("FOCUS_INPUT_FIELD", this.inputId, "", "", this.inputRef.instance.value, false)
-    Coherent.on("mousePressOutsideView", () => this.inputRef.instance.blur())
-  }
+    Coherent.trigger("FOCUS_INPUT_FIELD", this.inputId, "", "", this.inputRef.instance.value, false);
+    Coherent.on("mousePressOutsideView", () => this.inputRef.instance.blur());
+  };
 
   /**
    * Method to handle on input blur
    */
   private onInputBlur = (): void => {
-    Coherent.trigger("UNFOCUS_INPUT_FIELD", "")
-    Coherent.off("mousePressOutsideView")
-  }
+    Coherent.trigger("UNFOCUS_INPUT_FIELD", "");
+    Coherent.off("mousePressOutsideView");
+  };
 
   render() {
     if (this.props.textarea)
       return (
         <textarea style="width:350px;height:100px;" ref={this.inputRef} {...this.getInputProps()}>
           {this.props.value}
         </textarea>
-      )
-    return <input ref={this.inputRef} {...this.getInputProps()} />
+      );
+    return <input ref={this.inputRef} {...this.getInputProps()} />;
   }
 }
 
 interface CheckboxProps extends ComponentProps {
-  value: Subscribable<string>
-  setValue: (value: string) => void
-  default?: Subscribable<string> | string
-  class?: string
+  value: Subscribable<string>;
+  setValue: (value: string) => void;
+  default?: Subscribable<string> | string;
+  class?: string;
 }
 
 export class Checkbox extends DisplayComponent<CheckboxProps> {
-  private readonly isActive = this.props.value.map(val => (val == "true" ? true : false))
+  private readonly isActive = this.props.value.map(val => (val == "true" ? true : false));
 
   private onClick = () => {
-    this.props.setValue(this.isActive.get() ? "false" : "true")
-  }
+    this.props.setValue(this.isActive.get() ? "false" : "true");
+  };
 
   render(): VNode {
     return (
@@ -96,6 +96,6 @@ export class Checkbox extends DisplayComponent<CheckboxProps> {
       >
         <span class="text-4xl">{this.isActive.map(val => (val ? "✔" : "X"))}</span>
       </InterfaceNavbarItemV2>
-    )
+    );
   }
 }

example/gauge/Components/List.tsx

@@ -14,31 +14,31 @@ import {
   SubscribableArray,
   SubscribableArrayEventType,
   VNode,
-} from "@microsoft/msfs-sdk"
+} from "@microsoft/msfs-sdk";
 
 /** The properties for the List component. */
 interface ListProps extends ComponentProps {
   /**
    * The data for this list.
    * @type {any[]}
    */
-  data: SubscribableArray<any>
+  data: SubscribableArray<any>;
 
   /** A function defining how to render each list item. */
-  renderItem: (data: any, index: number) => VNode
+  renderItem: (data: any, index: number) => VNode;
 
   /** CSS class(es) to add to the root of the list component. */
-  class?: string
+  class?: string;
 }
 
 /** The List component. */
 export class List extends DisplayComponent<ListProps> {
-  private readonly _listContainer = FSComponent.createRef<HTMLElement>()
+  private readonly _listContainer = FSComponent.createRef<HTMLElement>();
 
   /** @inheritdoc */
   public onAfterRender(): void {
-    this.renderList()
-    this.props.data.sub(this.onDataChanged.bind(this))
+    this.renderList();
+    this.props.data.sub(this.onDataChanged.bind(this));
   }
 
   /**
@@ -51,30 +51,30 @@ export class List extends DisplayComponent<ListProps> {
     switch (type) {
       case SubscribableArrayEventType.Added:
         {
-          const el = this._listContainer.instance.children.item(index)
+          const el = this._listContainer.instance.children.item(index);
           if (Array.isArray(item)) {
             for (let i = 0; i < item.length; i++) {
-              this.addDomNode(item[i], index + i, el)
+              this.addDomNode(item[i], index + i, el);
             }
           } else {
-            this.addDomNode(item, index, el)
+            this.addDomNode(item, index, el);
           }
         }
-        break
+        break;
       case SubscribableArrayEventType.Removed:
         {
           if (Array.isArray(item)) {
             for (let i = 0; i < item.length; i++) {
-              this.removeDomNode(index)
+              this.removeDomNode(index);
             }
           } else {
-            this.removeDomNode(index)
+            this.removeDomNode(index);
           }
         }
-        break
+        break;
       case SubscribableArrayEventType.Cleared:
-        this._listContainer.instance.innerHTML = ""
-        break
+        this._listContainer.instance.innerHTML = "";
+        break;
     }
   }
 
@@ -83,8 +83,8 @@ export class List extends DisplayComponent<ListProps> {
    * @param index The index to remove.
    */
   private removeDomNode(index: number): void {
-    const child = this._listContainer.instance.childNodes.item(index)
-    this._listContainer.instance.removeChild(child)
+    const child = this._listContainer.instance.childNodes.item(index);
+    this._listContainer.instance.removeChild(child);
   }
 
   /**
@@ -94,12 +94,12 @@ export class List extends DisplayComponent<ListProps> {
    * @param el The element to add to.
    */
   private addDomNode(item: any, index: number, el: Element | null): void {
-    const node = this.renderListItem(item, index)
+    const node = this.renderListItem(item, index);
     if (el !== null) {
-      node && el && FSComponent.renderBefore(node, el as any)
+      node && el && FSComponent.renderBefore(node, el as any);
     } else {
-      el = this._listContainer.instance
-      node && el && FSComponent.render(node, el as any)
+      el = this._listContainer.instance;
+      node && el && FSComponent.render(node, el as any);
     }
   }
 
@@ -111,25 +111,25 @@ export class List extends DisplayComponent<ListProps> {
    * @throws error when the resulting vnode is not a scrollable control
    */
   private renderListItem(dataItem: any, index: number): VNode {
-    return this.props.renderItem(dataItem, index)
+    return this.props.renderItem(dataItem, index);
   }
   /** Renders the list of data items. */
   private renderList(): void {
     // clear all items
-    this._listContainer.instance.textContent = ""
+    this._listContainer.instance.textContent = "";
 
     // render items
-    const dataLen = this.props.data.length
+    const dataLen = this.props.data.length;
     for (let i = 0; i < dataLen; i++) {
-      const vnode = this.renderListItem(this.props.data.get(i), i)
+      const vnode = this.renderListItem(this.props.data.get(i), i);
       if (vnode !== undefined) {
-        FSComponent.render(vnode, this._listContainer.instance)
+        FSComponent.render(vnode, this._listContainer.instance);
       }
     }
   }
 
   /** @inheritdoc */
   render(): VNode {
-    return <div class={this.props.class ?? ""} ref={this._listContainer}></div>
+    return <div class={this.props.class ?? ""} ref={this._listContainer}></div>;
   }
 }