Upload folder using huggingface_hub

README.md

@@ -1,12 +1,8 @@
+
 # `gradio_log`
 <a href="https://pypi.org/project/gradio_log/" target="_blank"><img alt="PyPI - Version" src="https://img.shields.io/pypi/v/gradio_log"></a>  
 
-A Log component of Gradio which can easily continuously print any log file content into the user interface.
-
-> Credit: [Featurize 算力平台](https://featurize.cn)
-
-![static](./assets/static.png)
-![dynamic](./assets/dynamic.gif)
+A Log component for Gradio which can easily show some log file in the interface.
 
 ## Installation
 
@@ -17,16 +13,830 @@ pip install gradio_log
 ## Usage
 
 ```python
+import logging
+from pathlib import Path
+
 import gradio as gr
 from gradio_log import Log
 
-log_file = "/path/to/your/log_file.txt"
+
+class CustomFormatter(logging.Formatter):
+
+    green = "\x1b[32;20m"
+    blue = "\x1b[34;20m"
+    yellow = "\x1b[33;20m"
+    red = "\x1b[31;20m"
+    bold_red = "\x1b[31;1m"
+    reset = "\x1b[0m"
+    format = "%(asctime)s - %(levelname)s - %(message)s (%(filename)s:%(lineno)d)"
+
+    FORMATS = {
+        logging.DEBUG: blue + format + reset,
+        logging.INFO: green + format + reset,
+        logging.WARNING: yellow + format + reset,
+        logging.ERROR: red + format + reset,
+        logging.CRITICAL: bold_red + format + reset,
+    }
+
+    def format(self, record):
+        log_fmt = self.FORMATS.get(record.levelno)
+        formatter = logging.Formatter(log_fmt)
+        return formatter.format(record)
+
+
+formatter = CustomFormatter()
+
+log_file = "/tmp/gradio_log.txt"
+Path(log_file).touch()
+
+ch = logging.FileHandler(log_file)
+ch.setLevel(logging.DEBUG)
+ch.setFormatter(formatter)
+
+logger = logging.getLogger("gradio_log")
+logger.setLevel(logging.DEBUG)
+for handler in logger.handlers:
+    logger.removeHandler(handler)
+logger.addHandler(ch)
+
+
+logger.info("The logs will be displayed in here.")
+
+
+def create_log_handler(level):
+    def l(text):
+        getattr(logger, level)(text)
+
+    return l
+
 
 with gr.Blocks() as demo:
-    Log(log_file, dark=True, xterm_font_size=12)
+    text = gr.Textbox(label="Enter text to write to log file")
+    with gr.Row():
+        for l in ["debug", "info", "warning", "error", "critical"]:
+            button = gr.Button(f"log as {l}")
+            button.click(fn=create_log_handler(l), inputs=text)
+    Log(log_file, dark=True)
+
 
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(ssr_mode=True)
+
+```
+
+## `Log`
+
+### Initialization
+
+<table>
+<thead>
+<tr>
+<th align="left">name</th>
+<th align="left" style="width: 25%;">type</th>
+<th align="left">default</th>
+<th align="left">description</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td align="left"><code>log_file</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">the log file path to read from.</td>
+</tr>
+
+<tr>
+<td align="left"><code>tail</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int
+```
+
+</td>
+<td align="left"><code>100</code></td>
+<td align="left">from the end of the file, the number of lines to start read from.</td>
+</tr>
+
+<tr>
+<td align="left"><code>dark</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">if True, will render the component in dark mode.</td>
+</tr>
+
+<tr>
+<td align="left"><code>height</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | int | None
+```
+
+</td>
+<td align="left"><code>240</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_allow_proposed_api</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_allow_transparency</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_alt_click_moves_cursor</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_convert_eol</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_blink</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_inactive_style</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+"outline" | "block" | "bar" | "underline" | "none"
+```
+
+</td>
+<td align="left"><code>"outline"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_style</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+"block" | "underline" | "bar"
+```
+
+</td>
+<td align="left"><code>"block"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_custom_glyphs</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_disable_stdin</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_document_override</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[typing.Any][typing.Any, None]
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_draw_bold_text_in_bright_colors</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_fast_scroll_modifier</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal["none", "alt", "ctrl", "shift"]
+]["none" | "alt" | "ctrl" | "shift", None]
+```
+
+</td>
+<td align="left"><code>"alt"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_fast_scroll_sensitivity</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_family</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[str][str, None]
+```
+
+</td>
+<td align="left"><code>"courier-new, courier, monospace"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_size</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>15</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_weight</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "normal",
+        "bold",
+        "100",
+        "200",
+        "300",
+        "400",
+        "500",
+        "600",
+        "700",
+        "800",
+        "900",
+    ]
+][
+    "normal"
+    | "bold"
+    | "100"
+    | "200"
+    | "300"
+    | "400"
+    | "500"
+    | "600"
+    | "700"
+    | "800"
+    | "900",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"normal"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_weight_bold</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "normal",
+        "bold",
+        "100",
+        "200",
+        "300",
+        "400",
+        "500",
+        "600",
+        "700",
+        "800",
+        "900",
+    ]
+][
+    "normal"
+    | "bold"
+    | "100"
+    | "200"
+    | "300"
+    | "400"
+    | "500"
+    | "600"
+    | "700"
+    | "800"
+    | "900",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"bold"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_ignore_bracketed_paste_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_letter_spacing</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[float][float, None]
 ```
 
-After launched, try to add some new logs into the log file, and you will see the new logs are printed in the user interface.
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_line_height</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[float][float, None]
+```
+
+</td>
+<td align="left"><code>1.0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_log_level</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "trace", "debug", "info", "warn", "error", "off"
+    ]
+][
+    "trace" | "debug" | "info" | "warn" | "error" | "off",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"info"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_mac_option_click_forces_selection</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_mac_option_is_meta</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_minimum_contrast_ratio</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_overview_ruler_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_rescale_overlapping_glyphs</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_screen_reader_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scroll_on_user_input</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scroll_sensitivity</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scrollback</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1000</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_smooth_scroll_duration</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_tab_stop_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>8</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_windows_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>label</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">The label for this component. Appears above the component and is also used as the header if there are a table of examples for this component. If None and used in a `gr.Interface`, the label will be the name of the parameter this component is assigned to.</td>
+</tr>
+
+<tr>
+<td align="left"><code>info</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">additional component description.</td>
+</tr>
+
+<tr>
+<td align="left"><code>every</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+float
+```
+
+</td>
+<td align="left"><code>0.5</code></td>
+<td align="left">New log pulling interval.</td>
+</tr>
+
+<tr>
+<td align="left"><code>show_label</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">if True, will display label.</td>
+</tr>
+
+<tr>
+<td align="left"><code>container</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If True, will place the component in a container - providing some extra padding around the border.</td>
+</tr>
+
+<tr>
+<td align="left"><code>scale</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">relative size compared to adjacent Components. For example if Components A and B are in a Row, and A has scale=2, and B has scale=1, A will be twice as wide as B. Should be an integer. scale applies in Rows, and to top-level Components in Blocks where fill_height=True.</td>
+</tr>
+
+<tr>
+<td align="left"><code>min_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int
+```
+
+</td>
+<td align="left"><code>160</code></td>
+<td align="left">minimum pixel width, will wrap if not sufficient screen space to satisfy this value. If a certain scale value results in this Component being narrower than min_width, the min_width parameter will be respected first.</td>
+</tr>
+
+<tr>
+<td align="left"><code>interactive</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">if True, will be rendered as an editable textbox; if False, editing will be disabled. If not provided, this is inferred based on whether the component is used as an input or output.</td>
+</tr>
+
+<tr>
+<td align="left"><code>visible</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If False, component will be hidden.</td>
+</tr>
+
+<tr>
+<td align="left"><code>elem_id</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
+</tr>
+
+<tr>
+<td align="left"><code>elem_classes</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+list[str] | str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">An optional list of strings that are assigned as the classes of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
+</tr>
+
+<tr>
+<td align="left"><code>render</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.</td>
+</tr>
+</tbody></table>
+
+
+### Events
+
+| name | description |
+|:-----|:------------|
+| `load` | This listener is triggered when the Log initially loads in the browser. |
+
+
+
+### User function
+
+The impact on the users predict function varies depending on whether the component is used as an input or output for an event (or both).
+
+- When used as an Input, the component only impacts the input signature of the user function.
+- When used as an output, the component only impacts the return signature of the user function.
+
+The code snippet below is accurate in cases where the component is used as both an input and an output.
+
+- **As output:** Is passed, the preprocessed input data sent to the user's function in the backend.
+
+
+ ```python
+ def predict(
+     value: typing.Any
+ ) -> Unknown:
+     return value
+ ```
+ 

src/README.md

@@ -1,12 +1,8 @@
+
 # `gradio_log`
 <a href="https://pypi.org/project/gradio_log/" target="_blank"><img alt="PyPI - Version" src="https://img.shields.io/pypi/v/gradio_log"></a>  
 
-A Log component of Gradio which can easily continuously print any log file content into the user interface.
-
-> Credit: [Featurize 算力平台](https://featurize.cn)
-
-![static](./assets/static.png)
-![dynamic](./assets/dynamic.gif)
+A Log component for Gradio which can easily show some log file in the interface.
 
 ## Installation
 
@@ -17,16 +13,830 @@ pip install gradio_log
 ## Usage
 
 ```python
+import logging
+from pathlib import Path
+
 import gradio as gr
 from gradio_log import Log
 
-log_file = "/path/to/your/log_file.txt"
+
+class CustomFormatter(logging.Formatter):
+
+    green = "\x1b[32;20m"
+    blue = "\x1b[34;20m"
+    yellow = "\x1b[33;20m"
+    red = "\x1b[31;20m"
+    bold_red = "\x1b[31;1m"
+    reset = "\x1b[0m"
+    format = "%(asctime)s - %(levelname)s - %(message)s (%(filename)s:%(lineno)d)"
+
+    FORMATS = {
+        logging.DEBUG: blue + format + reset,
+        logging.INFO: green + format + reset,
+        logging.WARNING: yellow + format + reset,
+        logging.ERROR: red + format + reset,
+        logging.CRITICAL: bold_red + format + reset,
+    }
+
+    def format(self, record):
+        log_fmt = self.FORMATS.get(record.levelno)
+        formatter = logging.Formatter(log_fmt)
+        return formatter.format(record)
+
+
+formatter = CustomFormatter()
+
+log_file = "/tmp/gradio_log.txt"
+Path(log_file).touch()
+
+ch = logging.FileHandler(log_file)
+ch.setLevel(logging.DEBUG)
+ch.setFormatter(formatter)
+
+logger = logging.getLogger("gradio_log")
+logger.setLevel(logging.DEBUG)
+for handler in logger.handlers:
+    logger.removeHandler(handler)
+logger.addHandler(ch)
+
+
+logger.info("The logs will be displayed in here.")
+
+
+def create_log_handler(level):
+    def l(text):
+        getattr(logger, level)(text)
+
+    return l
+
 
 with gr.Blocks() as demo:
-    Log(log_file, dark=True, xterm_font_size=12)
+    text = gr.Textbox(label="Enter text to write to log file")
+    with gr.Row():
+        for l in ["debug", "info", "warning", "error", "critical"]:
+            button = gr.Button(f"log as {l}")
+            button.click(fn=create_log_handler(l), inputs=text)
+    Log(log_file, dark=True)
+
 
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(ssr_mode=True)
+
+```
+
+## `Log`
+
+### Initialization
+
+<table>
+<thead>
+<tr>
+<th align="left">name</th>
+<th align="left" style="width: 25%;">type</th>
+<th align="left">default</th>
+<th align="left">description</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td align="left"><code>log_file</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">the log file path to read from.</td>
+</tr>
+
+<tr>
+<td align="left"><code>tail</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int
+```
+
+</td>
+<td align="left"><code>100</code></td>
+<td align="left">from the end of the file, the number of lines to start read from.</td>
+</tr>
+
+<tr>
+<td align="left"><code>dark</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">if True, will render the component in dark mode.</td>
+</tr>
+
+<tr>
+<td align="left"><code>height</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | int | None
+```
+
+</td>
+<td align="left"><code>240</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_allow_proposed_api</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_allow_transparency</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_alt_click_moves_cursor</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_convert_eol</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_blink</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_inactive_style</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+"outline" | "block" | "bar" | "underline" | "none"
+```
+
+</td>
+<td align="left"><code>"outline"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_style</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+"block" | "underline" | "bar"
+```
+
+</td>
+<td align="left"><code>"block"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_cursor_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_custom_glyphs</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_disable_stdin</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_document_override</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[typing.Any][typing.Any, None]
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_draw_bold_text_in_bright_colors</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_fast_scroll_modifier</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal["none", "alt", "ctrl", "shift"]
+]["none" | "alt" | "ctrl" | "shift", None]
+```
+
+</td>
+<td align="left"><code>"alt"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_fast_scroll_sensitivity</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_family</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[str][str, None]
+```
+
+</td>
+<td align="left"><code>"courier-new, courier, monospace"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_size</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>15</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_weight</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "normal",
+        "bold",
+        "100",
+        "200",
+        "300",
+        "400",
+        "500",
+        "600",
+        "700",
+        "800",
+        "900",
+    ]
+][
+    "normal"
+    | "bold"
+    | "100"
+    | "200"
+    | "300"
+    | "400"
+    | "500"
+    | "600"
+    | "700"
+    | "800"
+    | "900",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"normal"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_font_weight_bold</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "normal",
+        "bold",
+        "100",
+        "200",
+        "300",
+        "400",
+        "500",
+        "600",
+        "700",
+        "800",
+        "900",
+    ]
+][
+    "normal"
+    | "bold"
+    | "100"
+    | "200"
+    | "300"
+    | "400"
+    | "500"
+    | "600"
+    | "700"
+    | "800"
+    | "900",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"bold"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_ignore_bracketed_paste_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_letter_spacing</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[float][float, None]
 ```
 
-After launched, try to add some new logs into the log file, and you will see the new logs are printed in the user interface.
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_line_height</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[float][float, None]
+```
+
+</td>
+<td align="left"><code>1.0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_log_level</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[
+    typing.Literal[
+        "trace", "debug", "info", "warn", "error", "off"
+    ]
+][
+    "trace" | "debug" | "info" | "warn" | "error" | "off",
+    None,
+]
+```
+
+</td>
+<td align="left"><code>"info"</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_mac_option_click_forces_selection</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_mac_option_is_meta</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_minimum_contrast_ratio</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_overview_ruler_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_rescale_overlapping_glyphs</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_screen_reader_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scroll_on_user_input</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scroll_sensitivity</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_scrollback</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>1000</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_smooth_scroll_duration</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>0</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_tab_stop_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[int][int, None]
+```
+
+</td>
+<td align="left"><code>8</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>xterm_windows_mode</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+typing.Optional[bool][bool, None]
+```
+
+</td>
+<td align="left"><code>False</code></td>
+<td align="left">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>label</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">The label for this component. Appears above the component and is also used as the header if there are a table of examples for this component. If None and used in a `gr.Interface`, the label will be the name of the parameter this component is assigned to.</td>
+</tr>
+
+<tr>
+<td align="left"><code>info</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">additional component description.</td>
+</tr>
+
+<tr>
+<td align="left"><code>every</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+float
+```
+
+</td>
+<td align="left"><code>0.5</code></td>
+<td align="left">New log pulling interval.</td>
+</tr>
+
+<tr>
+<td align="left"><code>show_label</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">if True, will display label.</td>
+</tr>
+
+<tr>
+<td align="left"><code>container</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If True, will place the component in a container - providing some extra padding around the border.</td>
+</tr>
+
+<tr>
+<td align="left"><code>scale</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">relative size compared to adjacent Components. For example if Components A and B are in a Row, and A has scale=2, and B has scale=1, A will be twice as wide as B. Should be an integer. scale applies in Rows, and to top-level Components in Blocks where fill_height=True.</td>
+</tr>
+
+<tr>
+<td align="left"><code>min_width</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int
+```
+
+</td>
+<td align="left"><code>160</code></td>
+<td align="left">minimum pixel width, will wrap if not sufficient screen space to satisfy this value. If a certain scale value results in this Component being narrower than min_width, the min_width parameter will be respected first.</td>
+</tr>
+
+<tr>
+<td align="left"><code>interactive</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">if True, will be rendered as an editable textbox; if False, editing will be disabled. If not provided, this is inferred based on whether the component is used as an input or output.</td>
+</tr>
+
+<tr>
+<td align="left"><code>visible</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If False, component will be hidden.</td>
+</tr>
+
+<tr>
+<td align="left"><code>elem_id</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
+</tr>
+
+<tr>
+<td align="left"><code>elem_classes</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+list[str] | str | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">An optional list of strings that are assigned as the classes of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
+</tr>
+
+<tr>
+<td align="left"><code>render</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+bool
+```
+
+</td>
+<td align="left"><code>True</code></td>
+<td align="left">If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.</td>
+</tr>
+</tbody></table>
+
+
+### Events
+
+| name | description |
+|:-----|:------------|
+| `load` | This listener is triggered when the Log initially loads in the browser. |
+
+
+
+### User function
+
+The impact on the users predict function varies depending on whether the component is used as an input or output for an event (or both).
+
+- When used as an Input, the component only impacts the input signature of the user function.
+- When used as an output, the component only impacts the return signature of the user function.
+
+The code snippet below is accurate in cases where the component is used as both an input and an output.
+
+- **As output:** Is passed, the preprocessed input data sent to the user's function in the backend.
+
+
+ ```python
+ def predict(
+     value: typing.Any
+ ) -> Unknown:
+     return value
+ ```
+