diff --git a/app/views/checkout/_details.html.haml b/app/views/checkout/_details.html.haml
index c3518ed760..b837e52812 100644
--- a/app/views/checkout/_details.html.haml
+++ b/app/views/checkout/_details.html.haml
@@ -69,7 +69,7 @@
             = f.check_box :save_bill_address
             = f.label :save_bill_address, t(:checkout_default_bill_address)
 
-    %div.checkout-substep{ "data-controller": "toggle shippingmethod" }
+    %div.checkout-substep{ "data-controller": "toggle-control shippingmethod" }
       - selected_shipping_method = @order.shipping_method&.id || params[:shipping_method_id]
       %div.checkout-title
         = t("checkout.step1.shipping_info.title")
@@ -87,7 +87,7 @@
               checked: ship_method_is_selected,
               name: "shipping_method_id",
               "data-requireAddress": shipping_method.require_ship_address,
-              "data-action": "toggle#toggle shippingmethod#selectShippingMethod",
+              "data-action": "toggle-control#toggleDisplay shippingmethod#selectShippingMethod",
               "data-toggle-show": shipping_method.require_ship_address
             = shipping_method_form.label shipping_method.id, shipping_method.name, {for: "shipping_method_" + shipping_method.id.to_s }
             %em.fees= payment_or_shipping_price(shipping_method, @order)
@@ -104,7 +104,7 @@
 
       = f.error_message_on :shipping_method, standalone: true
 
-      %div.checkout-input{ "data-toggle-target": "content", style: "display: #{display_ship_address ? 'block' : 'none'}" }
+      %div.checkout-input{ "data-toggle-control-target": "content", style: "display: #{display_ship_address ? 'block' : 'none'}" }
         = f.check_box :ship_address_same_as_billing, { id: "ship_address_same_as_billing", name: "ship_address_same_as_billing", "data-action": "shippingmethod#showHideShippingAddress", "data-shippingmethod-target": "shippingAddressCheckbox", checked: shipping_and_billing_match?(@order) }, 1, nil
         = f.label :ship_address_same_as_billing, t(:checkout_address_same), { for: "ship_address_same_as_billing" }
 
@@ -142,7 +142,7 @@
               = ship_address.select :state_id, states_for_country(ship_address_country), { selected: @order.ship_address&.state_id }, { "data-dependent-select-target": "select" }
 
       - if spree_current_user
-        %div.checkout-input{ "data-toggle-target": "content", style: "display: #{display_ship_address ? 'block' : 'none'}" }
+        %div.checkout-input{ "data-toggle-control-target": "content", style: "display: #{display_ship_address ? 'block' : 'none'}" }
           = f.check_box :save_ship_address
           = f.label :save_ship_address, t(:checkout_default_ship_address)
 
diff --git a/app/webpacker/controllers/toggle_control_controller.js b/app/webpacker/controllers/toggle_control_controller.js
index 81828d3514..d1e4a4692c 100644
--- a/app/webpacker/controllers/toggle_control_controller.js
+++ b/app/webpacker/controllers/toggle_control_controller.js
@@ -1,7 +1,7 @@
 import { Controller } from "stimulus";
 
 export default class extends Controller {
-  static targets = ["control"];
+  static targets = ["control", "content"];
 
   disableIfPresent(event) {
     const input = event.currentTarget;
@@ -25,7 +25,13 @@ export default class extends Controller {
       target.disabled = !enable;
     });
   }
-  //todo: can a new method toggleDisplay replace ToggleController?
+
+  toggleDisplay(event) {
+    const input = event.currentTarget;
+    this.contentTargets.forEach((t) => {
+      t.style.display = input.dataset.toggleShow === "true" ? "block" : "none";
+    });
+  }
   //todo: can toggleDisplay with optional chevron-target replace RemoteToggleController?
 
   // private
diff --git a/app/webpacker/controllers/toggle_controller.js b/app/webpacker/controllers/toggle_controller.js
deleted file mode 100644
index de87ad095d..0000000000
--- a/app/webpacker/controllers/toggle_controller.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Controller } from "stimulus";
-
-export default class extends Controller {
-  static targets = ["content"];
-
-  toggle(event) {
-    const input = event.currentTarget;
-    this.contentTargets.forEach((t) => {
-      t.style.display = input.dataset.toggleShow === "true" ? "block" : "none";
-    });
-  }
-}
diff --git a/spec/javascripts/stimulus/toggle_control_controller_test.js b/spec/javascripts/stimulus/toggle_control_controller_test.js
index 6de74b1a54..40a63f947a 100644
--- a/spec/javascripts/stimulus/toggle_control_controller_test.js
+++ b/spec/javascripts/stimulus/toggle_control_controller_test.js
@@ -88,4 +88,24 @@ describe("ToggleControlController", () => {
       });
     });
   });
+  describe("#toggleDisplay", () => {
+    beforeEach(() => {
+      document.body.innerHTML = `<div data-controller="toggle-control">
+        <span id="button" data-action="click->toggle-control#toggleDisplay" data-toggle-show="true" />
+        <div id="content" data-toggle-control-target="content" >
+          content
+        </div>
+      </div>`;
+    });
+
+    it("toggles the content", () => {
+      const button = document.getElementById("button");
+      const content = document.getElementById("content");
+      expect(content.style.display).toBe("");
+
+      button.click();
+
+      expect(content.style.display).toBe("block");
+    });
+  });
 });
diff --git a/spec/javascripts/stimulus/toggle_controller_test.js b/spec/javascripts/stimulus/toggle_controller_test.js
deleted file mode 100644
index c60669d1b8..0000000000
--- a/spec/javascripts/stimulus/toggle_controller_test.js
+++ /dev/null
@@ -1,34 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-import { Application } from "stimulus";
-import toggle_controller from "../../../app/webpacker/controllers/toggle_controller";
-
-describe("ToggleController", () => {
-  beforeAll(() => {
-    const application = Application.start();
-    application.register("toggle", toggle_controller);
-  });
-
-  describe("#toggle", () => {
-    beforeEach(() => {
-      document.body.innerHTML = `<div data-controller="toggle">
-        <span id="button" data-action="click->toggle#toggle" data-toggle-show="true" />
-        <div id="content" data-toggle-target="content" >
-          content
-        </div>
-      </div>`;
-    });
-
-    it("toggle the content", () => {
-      const button = document.getElementById("button");
-      const content = document.getElementById("content");
-      expect(content.style.display).toBe("");
-
-      button.click();
-
-      expect(content.style.display).toBe("block");
-    });
-  });
-});