Add first stimulus controllers to display elements

1. Introduce a stimulus toggle_controller

 - controller: { "data-controller": "toggle" }
 - action: { "data-action": "toggle#toggle" }
 - show or not: { "data-toggle-show":  true || false  }
- targets: { "data-toggle-target": "content", style: "display: none" }
Display payment method price

2. States are populated via a new dependant_select_controller by stimulus.
Usage:

 - controller : { "data-controller": "dependant-select", "data-dependant-select-options-value": [ [1: ["option", "for", "1"], [2: ["option", "for", "2"] ] }
 - target (on the populating target):  { "data-dependant-select-target": "select" }
 - source and action (on the input that leads the dependant select): {"data-dependant-select-target": "source", "data-action": "dependant-select#handleSelectChange"}
Some improvements on readability

3. Populate ShippingMethod description thanks to "shippingmethod_controller"


+
 - Add countries and states

app/webpacker/controllers/shippingmethod_controller.js

@@ -0,0 +1,24 @@
+import { Controller } from "stimulus";
+export default class extends Controller {
+  static targets = [
+    "shippingMethodDescription",
+    "shippingMethodDescriptionContent",
+  ];
+  connect() {
+    // Hide shippingMethodDescription by default
+    this.shippingMethodDescriptionTarget.style.display = "none";
+  }
+  selectShippingMethod(event) {
+    const input = event.target;
+    if (input.tagName === "INPUT") {
+      if (input.dataset.description.length > 0) {
+        this.shippingMethodDescriptionTarget.style.display = "block";
+        this.shippingMethodDescriptionContentTarget.innerText =
+          input.dataset.description;
+      } else {
+        this.shippingMethodDescriptionTarget.style.display = "none";
+        this.shippingMethodDescriptionContentTarget.innerText = null;
+      }
+    }
+  }
+}