Fix eslint misconfiguration and corresponding errors

netbox/project-static/src/select/api.ts

@@ -711,7 +711,7 @@ class APISelect {
    * @param id DOM ID of the other element.
    */
   private updatePathValues(id: string): void {
-    let key = id.replaceAll(/^id_/gi, '');
+    const key = id.replaceAll(/^id_/gi, '');
     const element = getElement<HTMLSelectElement>(`id_${key}`);
     if (element !== null) {
       // If this element's URL contains Django template tags ({{), replace the template tag
@@ -982,15 +982,16 @@ class APISelect {
         'button',
         { type: 'button' },
         ['btn', 'btn-sm', 'btn-ghost-dark'],
-        [createElement('i', {}, ['mdi', 'mdi-reload'])],
+        [createElement('i', null, ['mdi', 'mdi-reload'])],
       );
       refreshButton.addEventListener('click', () => this.loadData());
+      refreshButton.type = 'button';
       this.slim.slim.search.container.appendChild(refreshButton);
     }
   }
 }
 
-export function initApiSelect() {
+export function initApiSelect(): void {
   for (const select of getElements<HTMLSelectElement>('.netbox-api-select')) {
     new APISelect(select);
   }

netbox/project-static/src/select/color.ts

@@ -11,6 +11,30 @@ function canChangeColor(option: Option | HTMLOptionElement): boolean {
   return typeof option.value === 'string' && option.value !== '';
 }
 
+/**
+ * Style the container element based on the selected option value.
+ */
+function styleContainer(
+  instance: InstanceType<typeof SlimSelect>,
+  option: Option | HTMLOptionElement,
+): void {
+  if (instance.slim.singleSelected !== null) {
+    if (canChangeColor(option)) {
+      // Get the background color from the selected option's value.
+      const bg = `#${option.value}`;
+      // Determine an accessible foreground color based on the background color.
+      const fg = readableColor(bg);
+
+      // Set the container's style attributes.
+      instance.slim.singleSelected.container.style.backgroundColor = bg;
+      instance.slim.singleSelected.container.style.color = fg;
+    } else {
+      // If the color cannot be set (i.e., the placeholder), remove any inline styles.
+      instance.slim.singleSelected.container.removeAttribute('style');
+    }
+  }
+}
+
 /**
  * Initialize color selection widget. Dynamically change the style of the select container to match
  * the selected option.
@@ -40,7 +64,7 @@ export function initColorSelect(): void {
     // Style the select container to match any pre-selectd options.
     for (const option of instance.data.data) {
       if ('selected' in option && option.selected) {
-        styleContainer(option);
+        styleContainer(instance, option);
         break;
       }
     }
@@ -50,25 +74,7 @@ export function initColorSelect(): void {
       instance.slim.container.classList.remove(className);
     }
 
-    function styleContainer(option: Option | HTMLOptionElement): void {
-      if (instance.slim.singleSelected !== null) {
-        if (canChangeColor(option)) {
-          // Get the background color from the selected option's value.
-          const bg = `#${option.value}`;
-          // Determine an accessible foreground color based on the background color.
-          const fg = readableColor(bg);
-
-          // Set the container's style attributes.
-          instance.slim.singleSelected.container.style.backgroundColor = bg;
-          instance.slim.singleSelected.container.style.color = fg;
-        } else {
-          // If the color cannot be set (i.e., the placeholder), remove any inline styles.
-          instance.slim.singleSelected.container.removeAttribute('style');
-        }
-      }
-    }
-
     // Change the SlimSelect container's style based on the selected option.
-    instance.onChange = styleContainer;
+    instance.onChange = option => styleContainer(instance, option);
   }
 }

netbox/project-static/src/select/index.ts

@@ -2,7 +2,7 @@ import { initApiSelect } from './api';
 import { initColorSelect } from './color';
 import { initStaticSelect } from './static';
 
-export function initSelect() {
+export function initSelect(): void {
   for (const func of [initApiSelect, initColorSelect, initStaticSelect]) {
     func();
   }

netbox/project-static/src/select/static.ts

@@ -1,7 +1,7 @@
 import SlimSelect from 'slim-select';
 import { getElements } from '../util';
 
-export function initStaticSelect() {
+export function initStaticSelect(): void {
   for (const select of getElements<HTMLSelectElement>('.netbox-static-select')) {
     if (select !== null) {
       const label = document.querySelector(`label[for=${select.id}]`) as HTMLLabelElement;