Fixed expanded sections not collapsing on first click

material/base.html

@@ -217,7 +217,7 @@
       </script>
     {% endblock %}
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/bundle.52a6371e.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.da29d79a.min.js' | url }}"></script>
       {% for path in config["extra_javascript"] %}
         <script src="{{ path | url }}"></script>
       {% endfor %}

src/assets/javascripts/patches/indeterminate/index.ts

@@ -20,7 +20,14 @@
  * IN THE SOFTWARE.
  */
 
-import { Observable } from "rxjs"
+import { Observable, fromEvent, of } from "rxjs"
+import {
+  mapTo,
+  mergeMap,
+  switchMap,
+  takeWhile,
+  tap
+} from "rxjs/operators"
 
 import { getElements } from "~/browser"
 
@@ -50,13 +57,24 @@ interface PatchOptions {
 export function patchIndeterminate(
   { document$ }: PatchOptions
 ): void {
-  document$.subscribe(() => {
-    for (const el of getElements<HTMLInputElement>(
+  document$
+    .pipe(
+      switchMap(() => of(...getElements<HTMLInputElement>(
         "[data-md-state=indeterminate]"
-    )) {
-      el.setAttribute("data-md-state", "")
+      ))),
+      tap(el => {
         el.indeterminate = true
         el.checked = false
-    }
+      }),
+      mergeMap(el => fromEvent(el, "change")
+        .pipe(
+          takeWhile(() => el.hasAttribute("data-md-state")),
+          mapTo(el)
+        )
+      )
+    )
+      .subscribe(el => {
+        el.removeAttribute("data-md-state")
+        el.checked = false
       })
 }