fix bugs. introduce new ones.

html/extra-networks-tree-button.html

 <span data-filterable-item-text hidden>{search_terms}</span>
-<button class="action-list-content action-list-content-file"
+<button class="tree-list-content {subclass}"
+    expanded="false"
     type="button"
-    onclick="extraNetworksTreeOnClick(event, '{tabname}', '{tab_id}');"
+    onclick="extraNetworksTreeOnClick(event, '{tabname}', '{tab_id}');{onclick_extra}"
 >
-    <span class="action-list-item-visual action-list-item-visual--leading">🗎</span>
-    <span class="action-list-item-label action-list-item-label--truncate">{name}</span>
-    <span class="action-list-item-action action-list-item-action--trailing">
-        <div class="button-row">{copy_path_button}{metadata_button}{edit_button}</div>
+    <span class='tree-list-item-action tree-list-item-action--leading'>
+        {action_list_item_action_leading}
+    </span>
+    <span class="tree-list-item-visual tree-list-item-visual--leading">
+        {action_list_item_visual_leading}
+    </span>
+    <span class="tree-list-item-label tree-list-item-label--truncate">
+        {action_list_item_label}
+    </span>
+    <span class="tree-list-item-visual tree-list-item-visual--trailing">
+        {action_list_item_visual_trailing}
+    </span>
+    <span class="tree-list-item-action tree-list-item-action--trailing">
+        {action_list_item_action_trailing}
     </span>
 </button>
\ No newline at end of file

javascript/extraNetworks.js

@@ -267,7 +267,7 @@ function extraNetworksTreeProcessFileClick(event, btn, tabname, tab_id) {
      * Processes `onclick` events when user clicks on files in tree.
      *
      * @param event     The generated event.
-     * @param btn       The clicked `action-list-item` button.
+     * @param btn       The clicked `tree-list-item` button.
      * @param tabname   The name of the active tab in the sd webui. Ex: txt2img, img2img, etc.
      * @param tab_id    The id of the active extraNetworks tab. Ex: lora, checkpoints, etc.
      */
@@ -288,7 +288,7 @@ function extraNetworksTreeProcessDirectoryClick(event, btn, tabname, tab_id) {
      * chevron is clicked: Directory is expanded or collapsed. Selected state unchanged.
      *
      * @param event     The generated event.
-     * @param btn       The clicked `action-list-item` button.
+     * @param btn       The clicked `tree-list-item` button.
      * @param tabname   The name of the active tab in the sd webui. Ex: txt2img, img2img, etc.
      * @param tab_id    The id of the active extraNetworks tab. Ex: lora, checkpoints, etc.
      */
@@ -310,7 +310,7 @@ function extraNetworksTreeProcessDirectoryClick(event, btn, tabname, tab_id) {
 
     function _remove_selected_from_all() {
         // Removes the `selected` attribute from all buttons.
-        var sels = document.querySelectorAll("button.action-list-content");
+        var sels = document.querySelectorAll("button.tree-list-content");
         [...sels].forEach(el => {
             el.removeAttribute("selected");
         });
@@ -331,7 +331,7 @@ function extraNetworksTreeProcessDirectoryClick(event, btn, tabname, tab_id) {
 
 
     // If user clicks on the chevron, then we do not select the folder.
-    if (true_targ.matches(".action-list-item-action--leading, .action-list-item-action-chevron")) {
+    if (true_targ.matches(".tree-list-item-action--leading, .tree-list-item-action-chevron")) {
         _expand_or_collapse(ul, btn);
     } else {
         // User clicked anywhere else on the button.
@@ -356,7 +356,7 @@ function extraNetworksTreeProcessDirectoryClick(event, btn, tabname, tab_id) {
 
 function extraNetworksTreeOnClick(event, tabname, tab_id) {
     /**
-     * Handles `onclick` events for buttons within an `extra-network-tree .action-list--tree`.
+     * Handles `onclick` events for buttons within an `extra-network-tree .tree-list--tree`.
      *
      * Determines whether the clicked button in the tree is for a file entry or a directory
      * then calls the appropriate function.