Add checkbox component

BLAST-ImpactX · Feb 25, 2025 · 2c1e42a · 2c1e42a
1 parent d21b7f7
commit 2c1e42a
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 6 deletions.
diff --git a/src/python/impactx/dashboard/Input/components/input.py b/src/python/impactx/dashboard/Input/components/input.py
@@ -6,6 +6,7 @@
 
 server, state, ctrl = setup_server()
 
+
 class InputComponents:
     """
     Class contains staticmethod to create
@@ -90,3 +91,28 @@ def text_field(
                     **kwargs,
                 )
             html.Span(TooltipDefaults.TOOLTIP.get(v_model_name))
+
+    @staticmethod
+    def checkbox(
+        label: str, v_model_name: Optional[str] = None, **kwargs
+    ) -> vuetify.VCheckbox:
+        """
+        Creates a Vuetify VCheckbox component with the following default components:
+        - dense: set to 'true' to minimize space usage.
+
+        :param label: Display label
+        """
+        if v_model_name is None:
+            v_model_name = label.lower().replace(" ", "_")
+
+        with vuetify.VTooltip(**TooltipDefaults.TOOLTIP_STYLE):
+            with vuetify.Template(v_slot_activator="{ on, attrs }"):
+                vuetify.VCheckbox(
+                    label=label,
+                    v_model=(v_model_name,),
+                    dense=True,
+                    v_on="on",
+                    v_bind="attrs",
+                    **kwargs,
+                )
+            html.Span(TooltipDefaults.TOOLTIP.get(v_model_name))
diff --git a/src/python/impactx/dashboard/Input/inputParameters/inputMain.py b/src/python/impactx/dashboard/Input/inputParameters/inputMain.py
@@ -34,16 +34,12 @@ def card_content(self):
             with vuetify.VCardText(**self.CARD_TEXT_OVERFLOW):
                 with vuetify.VRow(**self.ROW_STYLE):
                     with vuetify.VCol(cols="auto"):
-                        vuetify.VCheckbox(
+                        InputComponents.checkbox(
                             label="Space Charge",
-                            v_model=("space_charge", False),
-                            dense=True,
                         )
                     with vuetify.VCol(cols="auto"):
-                        vuetify.VCheckbox(
+                        InputComponents.checkbox(
                             label="CSR",
-                            v_model=("csr", False),
-                            dense=True,
                         )
                 with vuetify.VRow(**self.ROW_STYLE):
                     with vuetify.VCol(cols=6):