Merge pull request #479 from Textualize/render-style

Add style param to Widget render method

sandbox/align.py

@@ -1,4 +1,4 @@
-from rich.text import Text
+from rich.style import Style
 
 from textual.app import App, ComposeResult
 from textual.widget import Widget
@@ -6,7 +6,7 @@ from textual.widgets import Static
 
 
 class Thing(Widget):
-    def render(self):
+    def render(self, style: Style):
         return "Hello, 3434 World.\n[b]Lorem impsum."
 
 

sandbox/basic.py

@@ -1,4 +1,5 @@
 from rich.console import RenderableType
+from rich.style import Style
 from rich.syntax import Syntax
 from rich.text import Text
 
@@ -50,12 +51,12 @@ lorem = Text.from_markup(
 
 
 class TweetHeader(Widget):
-    def render(self) -> RenderableType:
+    def render(self, style: Style) -> RenderableType:
         return Text("Lorem Impsum", justify="center")
 
 
 class TweetBody(Widget):
-    def render(self) -> Text:
+    def render(self, style: Style) -> Text:
         return lorem
 
 
@@ -64,22 +65,22 @@ class Tweet(Widget):
 
 
 class OptionItem(Widget):
-    def render(self) -> Text:
+    def render(self, style: Style) -> Text:
         return Text("Option")
 
 
 class Error(Widget):
-    def render(self) -> Text:
+    def render(self, style: Style) -> Text:
         return Text("This is an error message", justify="center")
 
 
 class Warning(Widget):
-    def render(self) -> Text:
+    def render(self, style: Style) -> Text:
         return Text("This is a warning message", justify="center")
 
 
 class Success(Widget):
-    def render(self) -> Text:
+    def render(self, style: Style) -> Text:
         return Text("This is a success message", justify="center")
 
 

sandbox/buttons.css

@@ -0,0 +1,8 @@
+#foo {
+    text-style: underline;
+    background: rebeccapurple;
+}
+
+#foo:hover {
+    background: greenyellow;
+}

sandbox/buttons.py

@@ -18,7 +18,7 @@ class ButtonsApp(App[str]):
         self.exit(event.button.id)
 
 
-app = ButtonsApp(log_path="textual.log", log_verbosity=2)
+app = ButtonsApp(log_path="textual.log", css_path="buttons.css", log_verbosity=2)
 
 if __name__ == "__main__":
     result = app.run()

sandbox/dev_sandbox.py

@@ -1,12 +1,13 @@
 from rich.console import RenderableType
 from rich.panel import Panel
+from rich.style import Style
 
 from textual.app import App
 from textual.widget import Widget
 
 
 class PanelWidget(Widget):
-    def render(self) -> RenderableType:
+    def render(self, style: Style) -> RenderableType:
         return Panel("hello world!", title="Title")
 
 

sandbox/tabs.py

@@ -3,6 +3,7 @@ from dataclasses import dataclass
 from rich.console import RenderableType
 from rich.padding import Padding
 from rich.rule import Rule
+from rich.style import Style
 
 from textual import events
 from textual.app import App
@@ -11,7 +12,7 @@ from textual.widgets.tabs import Tabs, Tab
 
 
 class Hr(Widget):
-    def render(self) -> RenderableType:
+    def render(self, style: Style) -> RenderableType:
         return Rule()
 
 
@@ -22,7 +23,7 @@ class Info(Widget):
         super().__init__()
         self.text = text
 
-    def render(self) -> RenderableType:
+    def render(self, style: Style) -> RenderableType:
         return Padding(f"{self.text}", pad=(0, 1))
 
 
@@ -144,4 +145,5 @@ class BasicApp(App):
             self.mount(example.widget)
 
 
-BasicApp.run(css_path="tabs.scss", watch_css=True, log_path="textual.log")
+app = BasicApp(css_path="tabs.scss", watch_css=True, log_path="textual.log")
+app.run()

sandbox/uber.css

@@ -7,12 +7,18 @@ App.-show-focus *:focus {
   background: green;
   overflow: hidden auto;
   border: heavy white;
+  text-style: underline;
 }
 
 #uber1:focus-within {
   background: darkslateblue;
 }
 
+#child2 {
+  text-style: underline;
+  background: red;
+}
+
 .list-item {
   height: 20;
   color: #12a0;

sandbox/uber.py

@@ -25,7 +25,6 @@ class BasicApp(App):
         first_child = Placeholder(id="child1", classes="list-item")
         uber1 = Widget(
             first_child,
-            Placeholder(id="child1", classes="list-item"),
             Placeholder(id="child2", classes="list-item"),
             Placeholder(id="child3", classes="list-item"),
             Placeholder(classes="list-item"),
@@ -33,6 +32,7 @@ class BasicApp(App):
             Placeholder(classes="list-item"),
         )
         self.mount(uber1=uber1)
+        uber1.focus()
         self.first_child = first_child
         self.uber = uber1
 
@@ -50,9 +50,8 @@ class BasicApp(App):
 
     def action_print(self):
         print(
-            "Printed using builtin [b blue]print[/] function:",
-            self.screen.tree,
-            sep=" - ",
+            "Focused widget is:",
+            self.focused,
         )
         self.app.set_focus(None)