docs(text area): fix syntax highlighting in examples

[TomJGooding]

Fixes #4094.

I do wonder if the docs should start with an example of a plain multi-line input now that is the default TextArea experience, but I'll leave that as an open question here (and out of scope for this PR).

This does slightly complicate the Extending TextArea example with the long __init__ method, but I think leaving this as a plain TextArea might cause some confusion.

[davep]

This does slightly complicate the Extending TextArea example with the long init method, but I think leaving this as a plain TextArea might cause some confusion.

I wonder if this actually shows a slight issue with TextArea.code_editor? It creates an instance of TextArea, when it might make more sense for it to create an instance of its class, so (ignore the trailing whitespace cleanup lines...) that change would simply be:

diff --git a/docs/examples/widgets/text_area_extended.py b/docs/examples/widgets/text_area_extended.py
index 8ac237db..26d29cea 100644
--- a/docs/examples/widgets/text_area_extended.py
+++ b/docs/examples/widgets/text_area_extended.py
@@ -15,7 +15,7 @@ class ExtendedTextArea(TextArea):
 
 class TextAreaKeyPressHook(App):
     def compose(self) -> ComposeResult:
-        yield ExtendedTextArea(language="python")
+        yield ExtendedTextArea.code_editor(language="python")
 
 
 app = TextAreaKeyPressHook()
diff --git a/src/textual/widgets/_text_area.py b/src/textual/widgets/_text_area.py
index 48e83502..7acecb8c 100644
--- a/src/textual/widgets/_text_area.py
+++ b/src/textual/widgets/_text_area.py
@@ -90,7 +90,7 @@ TextArea {
     height: 1fr;
     border: tall $background;
     padding: 0 1;
-    
+
     &:focus {
         border: tall $accent;
     }
@@ -139,9 +139,9 @@ TextArea:light .text-area--cursor {
     }
     """
     `TextArea` offers some component classes which can be used to style aspects of the widget.
-    
+
     Note that any attributes provided in the chosen `TextAreaTheme` will take priority here.
-    
+
     | Class | Description |
     | :- | :- |
     | `text-area--cursor` | Target the cursor. |
@@ -457,7 +457,7 @@ TextArea:light .text-area--cursor {
             classes: One or more Textual CSS compatible class names separated by spaces.
             disabled: True if the widget is disabled.
         """
-        return TextArea(
+        return cls(
             text,
             language=language,
             theme=theme,

Tagging @darrenburns for input.

[darrenburns]

Yeah, you're right @davep. Just a slip up on my part.

[TomJGooding]

Ah, good catch @davep. I won't be able to update until later this evening as away from my desk, but feel free to take this over if urgent (I have allow edits by maintainers checked).

[davep]

I'll let @darrenburns and/or @willmcgugan give the final thumbs up, but this looks good to me.