Merge pull request #5776 from sponsfreixes/feature/first_child

Add support for `first-child` and `last-child` pseudo-classes

Author: willmcgugan

CHANGELOG.md

@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 ### Fixed
 
 - Fixed `OptionList` causing excessive redrawing https://github.com/Textualize/textual/pull/5766
+- Added `:first-child` and `:last-child` pseudo classes https://github.com/Textualize/textual/pull/5776
 - Log messages could be written to stdout when there was no app, which could happen when using run_async or threads. Now they will be suppressed, unless the env var `TEXTUAL_DEBUG` is set https://github.com/Textualize/textual/pull/5782
 
 ### Added

docs/guide/CSS.md

@@ -343,10 +343,12 @@ Here are some other pseudo classes:
 - `:disabled` Matches widgets which are in a disabled state.
 - `:enabled` Matches widgets which are in an enabled state.
 - `:even` Matches a widget at an evenly numbered position within its siblings.
+- `:first-child` Matches a widget that is the first amongst its siblings.
 - `:first-of-type` Matches a widget that is the first of its type amongst its siblings.
 - `:focus-within` Matches widgets with a focused child widget.
 - `:focus` Matches widgets which have input focus.
 - `:inline` Matches widgets when the app is running in inline mode.
+- `:last-child` Matches a widget that is the last amongst its siblings.
 - `:last-of-type` Matches a widget that is the last of its type amongst its siblings.
 - `:light` Matches widgets in light themes (where `App.theme.dark == False`).
 - `:odd` Matches a widget at an oddly numbered position within its siblings.

src/textual/css/constants.py

@@ -76,6 +76,8 @@
     "nocolor",
     "first-of-type",
     "last-of-type",
+    "first-child",
+    "last-child",
     "odd",
     "even",
 }

src/textual/css/stylesheet.py

@@ -459,6 +459,8 @@ def _check_rule(
     _EXCLUDE_PSEUDO_CLASSES_FROM_CACHE: Final[set[str]] = {
         "first-of-type",
         "last-of-type",
+        "first-child",
+        "last-child",
         "odd",
         "even",
         "focus-within",
@@ -503,7 +505,7 @@ def apply(
         node._has_hover_style = "hover" in all_pseudo_classes
         node._has_focus_within = "focus-within" in all_pseudo_classes
         node._has_order_style = not all_pseudo_classes.isdisjoint(
-            {"first-of-type", "last-of-type"}
+            {"first-of-type", "last-of-type", "first-child", "last-child"}
         )
         node._has_odd_or_even = (
             "odd" in all_pseudo_classes or "even" in all_pseudo_classes

src/textual/dom.py

@@ -224,7 +224,7 @@ def __init__(
         self._has_hover_style: bool = False
         self._has_focus_within: bool = False
         self._has_order_style: bool = False
-        """The node has an ordered dependent pseudo-style (`:odd`, `:even`, `:first-of-type`, `:last-of-type`)"""
+        """The node has an ordered dependent pseudo-style (`:odd`, `:even`, `:first-of-type`, `:last-of-type`, `:first-child`, `:last-child`)"""
         self._has_odd_or_even: bool = False
         """The node has the pseudo class `odd` or `even`."""
         self._reactive_connect: (

src/textual/widget.py

@@ -389,6 +389,8 @@ class Widget(DOMNode):
         "nocolor": lambda widget: widget.app.no_color,
         "first-of-type": lambda widget: widget.first_of_type,
         "last-of-type": lambda widget: widget.last_of_type,
+        "first-child": lambda widget: widget.first_child,
+        "last-child": lambda widget: widget.last_child,
         "odd": lambda widget: widget.is_odd,
         "even": lambda widget: widget.is_even,
     }  # type: ignore[assignment]
@@ -500,6 +502,10 @@ def __init__(
         """Used to cache :first-of-type pseudoclass state."""
         self._last_of_type: tuple[int, bool] = (-1, False)
         """Used to cache :last-of-type pseudoclass state."""
+        self._first_child: tuple[int, bool] = (-1, False)
+        """Used to cache :first-child pseudoclass state."""
+        self._last_child: tuple[int, bool] = (-1, False)
+        """Used to cache :last-child pseudoclass state."""
         self._odd: tuple[int, bool] = (-1, False)
         """Used to cache :odd pseudoclass state."""
         self._last_scroll_time = monotonic()
@@ -852,6 +858,34 @@ def last_of_type(self) -> bool:
                 return self._last_of_type[1]
         return False
 
+    @property
+    def first_child(self) -> bool:
+        """Is this the first widget in its siblings?"""
+        parent = self.parent
+        if parent is None:
+            return True
+        # This pseudo class only changes when the parent's nodes._updates changes
+        if parent._nodes._updates == self._first_child[0]:
+            return self._first_child[1]
+        for node in parent._nodes:
+            self._first_child = (parent._nodes._updates, node is self)
+            return self._first_child[1]
+        return False
+
+    @property
+    def last_child(self) -> bool:
+        """Is this the last widget in its siblings?"""
+        parent = self.parent
+        if parent is None:
+            return True
+        # This pseudo class only changes when the parent's nodes._updates changes
+        if parent._nodes._updates == self._last_child[0]:
+            return self._last_child[1]
+        for node in reversed(parent._nodes):
+            self._last_child = (parent._nodes._updates, node is self)
+            return self._last_child[1]
+        return False
+
     @property
     def is_odd(self) -> bool:
         """Is this widget at an oddly numbered position within its siblings?"""
@@ -1304,7 +1338,7 @@ def update_styles(children: list[DOMNode]) -> None:
             """Update order related CSS"""
             if before is not None or after is not None:
                 # If the new children aren't at the end.
-                # we need to update both odd/even and first-of-type/last-of-type
+                # we need to update both odd/even, first-of-type/last-of-type and first-child/last-child
                 for child in children:
                     if child._has_order_style or child._has_odd_or_even:
                         child._update_styles()