Merge branch 'develop' into feature

netbox/project-static/src/forms/elements.ts

@@ -35,11 +35,6 @@ function handleFormSubmit(event: Event, form: HTMLFormElement): void {
   for (const element of form.querySelectorAll<FormControls>('*[name]')) {
     if (!element.validity.valid) {
       invalids.add(element.name);
-
-      // If the field is invalid, but contains the .is-valid class, remove it.
-      if (element.classList.contains('is-valid')) {
-        element.classList.remove('is-valid');
-      }
       // If the field is invalid, but doesn't contain the .is-invalid class, add it.
       if (!element.classList.contains('is-invalid')) {
         element.classList.add('is-invalid');
@@ -49,10 +44,6 @@ function handleFormSubmit(event: Event, form: HTMLFormElement): void {
       if (element.classList.contains('is-invalid')) {
         element.classList.remove('is-invalid');
       }
-      // If the field is valid, but doesn't contain the .is-valid class, add it.
-      if (!element.classList.contains('is-valid')) {
-        element.classList.add('is-valid');
-      }
     }
   }
 

netbox/project-static/src/htmx.ts

@@ -0,0 +1,23 @@
+import { getElements, isTruthy } from './util';
+import { initButtons } from './buttons';
+
+function initDepedencies(): void {
+  for (const init of [initButtons]) {
+    init();
+  }
+}
+
+/**
+ * Hook into HTMX's event system to reinitialize specific native event listeners when HTMX swaps
+ * elements.
+ */
+export function initHtmx(): void {
+  for (const element of getElements('[hx-target]')) {
+    const targetSelector = element.getAttribute('hx-target');
+    if (isTruthy(targetSelector)) {
+      for (const target of getElements(targetSelector)) {
+        target.addEventListener('htmx:afterSettle', initDepedencies);
+      }
+    }
+  }
+}

netbox/project-static/src/netbox.ts

@@ -12,6 +12,7 @@ import { initInterfaceTable } from './tables';
 import { initSideNav } from './sidenav';
 import { initRackElevation } from './racks';
 import { initLinks } from './links';
+import { initHtmx } from './htmx';
 
 function initDocument(): void {
   for (const init of [
@@ -29,6 +30,7 @@ function initDocument(): void {
     initSideNav,
     initRackElevation,
     initLinks,
+    initHtmx,
   ]) {
     init();
   }

netbox/project-static/styles/netbox.scss

@@ -965,6 +965,19 @@ div.card-overlay {
   max-width: unset;
 }
 
+/* Rendered Markdown */
+.rendered-markdown table {
+  width: 100%;
+}
+.rendered-markdown th {
+  border-bottom: 2px solid #dddddd;
+  padding: 8px;
+}
+.rendered-markdown td {
+  border-top: 1px solid #dddddd;
+  padding: 8px;
+}
+
 // Preformatted text blocks
 td pre {
   margin-bottom: 0