Rename Checkbox to Switch

A new form of Checkbox will be arriving in Textual soon, working in
conjunction with a RadioButton. What was called Checkbox is perhaps a wee
bit heavyweight in terms of visual design, but is a style of widget that
should remain.

With this in mind we're renaming the current Checkbox to Switch. In all
other respects its workings remains the same, only the name has changed.

Things for people to watch out for:

- Imports will need to be updated.
- Queries will need to be updated; special attention will need to be paid to
  any queries that are string-based.
- CSS will need to be changed if any Checkbox styling is happening, or if
  any Checkbox component styles are being used.

See #1725 as the initial motivation and #1746 as the issue for this
particular change.

docs/api/checkbox.md

@@ -1 +0,0 @@
-::: textual.widgets.Checkbox

docs/api/switch.md

@@ -0,0 +1 @@
+::: textual.widgets.Switch

docs/examples/widgets/switch.css

@@ -7,7 +7,7 @@ Screen {
     width: auto;
 }
 
-Checkbox {
+Switch {
     height: auto;
     width: auto;
 }
@@ -22,7 +22,7 @@ Checkbox {
     background: darkslategrey;
 }
 
-#custom-design > .checkbox--switch {
+#custom-design > .switch--switch {
     color: dodgerblue;
     background: darkslateblue;
 }

docs/examples/widgets/switch.py

@@ -1,35 +1,35 @@
 from textual.app import App, ComposeResult
 from textual.containers import Horizontal
-from textual.widgets import Checkbox, Static
+from textual.widgets import Switch, Static
 
 
-class CheckboxApp(App):
+class SwitchApp(App):
     def compose(self) -> ComposeResult:
-        yield Static("[b]Example checkboxes\n", classes="label")
+        yield Static("[b]Example switches\n", classes="label")
         yield Horizontal(
             Static("off:     ", classes="label"),
-            Checkbox(animate=False),
+            Switch(animate=False),
             classes="container",
         )
         yield Horizontal(
             Static("on:      ", classes="label"),
-            Checkbox(value=True),
+            Switch(value=True),
             classes="container",
         )
 
-        focused_checkbox = Checkbox()
-        focused_checkbox.focus()
+        focused_switch = Switch()
+        focused_switch.focus()
         yield Horizontal(
-            Static("focused: ", classes="label"), focused_checkbox, classes="container"
+            Static("focused: ", classes="label"), focused_switch, classes="container"
         )
 
         yield Horizontal(
             Static("custom:  ", classes="label"),
-            Checkbox(id="custom-design"),
+            Switch(id="custom-design"),
             classes="container",
         )
 
 
-app = CheckboxApp(css_path="checkbox.css")
+app = SwitchApp(css_path="switch.css")
 if __name__ == "__main__":
     app.run()

docs/roadmap.md

@@ -40,7 +40,7 @@ Widgets are key to making user-friendly interfaces. The builtin widgets should c
 - [x] Buttons
     * [x] Error / warning variants
 - [ ] Color picker
-- [x] Checkbox
+- [ ] Checkbox
 - [ ] Content switcher
 - [x] DataTable
     * [x] Cell select
@@ -70,6 +70,7 @@ Widgets are key to making user-friendly interfaces. The builtin widgets should c
     * [ ] Style variants (solid, thin etc)
 - [ ] Radio boxes
 - [ ] Spark-lines
+- [X] Switch
 - [ ] Tabs
 - [ ] TextArea (multi-line input)
     * [ ] Basic controls

docs/widgets/checkbox.md

@@ -1,63 +0,0 @@
-# Checkbox
-
-A simple checkbox widget which stores a boolean value.
-
-- [x] Focusable
-- [ ] Container
-
-## Example
-
-The example below shows checkboxes in various states.
-
-=== "Output"
-
-    ```{.textual path="docs/examples/widgets/checkbox.py"}
-    ```
-
-=== "checkbox.py"
-
-    ```python
-    --8<-- "docs/examples/widgets/checkbox.py"
-    ```
-
-=== "checkbox.css"
-
-    ```sass
-    --8<-- "docs/examples/widgets/checkbox.css"
-    ```
-
-## Reactive Attributes
-
-| Name    | Type   | Default | Description                        |
-| ------- | ------ | ------- | ---------------------------------- |
-| `value` | `bool` | `False` | The default value of the checkbox. |
-
-## Bindings
-
-The checkbox widget defines directly the following bindings:
-
-::: textual.widgets.Checkbox.BINDINGS
-    options:
-      show_root_heading: false
-      show_root_toc_entry: false
-
-## Component Classes
-
-The checkbox widget provides the following component classes:
-
-::: textual.widgets.Checkbox.COMPONENT_CLASSES
-    options:
-      show_root_heading: false
-      show_root_toc_entry: false
-
-## Messages
-
-### ::: textual.widgets.Checkbox.Changed
-
-## Additional Notes
-
-- To remove the spacing around a checkbox, set `border: none;` and `padding: 0;`.
-
-## See Also
-
-- [Checkbox](../api/checkbox.md) code reference

docs/widgets/switch.md

@@ -0,0 +1,63 @@
+# Switch
+
+A simple switch widget which stores a boolean value.
+
+- [x] Focusable
+- [ ] Container
+
+## Example
+
+The example below shows switches in various states.
+
+=== "Output"
+
+    ```{.textual path="docs/examples/widgets/switch.py"}
+    ```
+
+=== "switch.py"
+
+    ```python
+    --8<-- "docs/examples/widgets/switch.py"
+    ```
+
+=== "switch.css"
+
+    ```sass
+    --8<-- "docs/examples/widgets/switch.css"
+    ```
+
+## Reactive Attributes
+
+| Name    | Type   | Default | Description                      |
+|---------|--------|---------|----------------------------------|
+| `value` | `bool` | `False` | The default value of the switch. |
+
+## Bindings
+
+The switch widget defines directly the following bindings:
+
+::: textual.widgets.Switch.BINDINGS
+    options:
+      show_root_heading: false
+      show_root_toc_entry: false
+
+## Component Classes
+
+The switch widget provides the following component classes:
+
+::: textual.widgets.Switch.COMPONENT_CLASSES
+    options:
+      show_root_heading: false
+      show_root_toc_entry: false
+
+## Messages
+
+### ::: textual.widgets.Switch.Changed
+
+## Additional Notes
+
+- To remove the spacing around a `Switch`, set `border: none;` and `padding: 0;`.
+
+## See Also
+
+- [Switch](../api/switch.md) code reference