v0.0.9 fix demo and readme

README.md

@@ -6,7 +6,7 @@ tags:
 - textbox
 - editing
 - color
-title: gradio_highlightedtextbox v0.0.8
+title: gradio_highlightedtextbox v0.0.9
 colorFrom: indigo
 colorTo: green
 sdk: docker

app.py

@@ -111,6 +111,11 @@ _docs = {
                     "default": "False",
                     "description": "If True, includes a copy button to copy the text in the textbox. Only applies if show_label is True.",
                 },
+                "show_remove_tags_button": {
+                    "type": "bool",
+                    "default": "False",
+                    "description": "If True, includes a remove tags button to remove all highlights from the text.",
+                },
             },
             "postprocess": {
                 "y": {
@@ -158,6 +163,11 @@ _docs = {
                 "default": None,
                 "description": "This listener is triggered when the HighlightedTextbox is unfocused/blurred.",
             },
+            "clear": {
+                "type": None,
+                "default": None,
+                "description": "This listener is triggered when the HighlightedTextbox is cleared from highlights using the remove_tags button.",
+            },
         },
     },
     "__meta__": {
@@ -203,7 +213,7 @@ def show_info(
     )
 
 
-initial_text = "It is not something to be ashamed of: it is no different from the <d>personal fears</d> and <tm>dislikes</tm> of other things that <t>manny peopl</t> have."
+initial_text = "It is not something to be ashamed of: it is no different from the <a>personal fears</a> and <b>dislikes</b> of other things that <c>manny peopl</c> have."
 
 with gr.Blocks(
     css=abs_path,
@@ -218,8 +228,8 @@ with gr.Blocks(
         gr.Markdown("### Parameters to control the highlighted textbox:")
         with gr.Row():
             tag_id = gr.Dropdown(
-                choices=["Typo", "Terminology", "Disfluency"],
-                value=["Typo", "Terminology", "Disfluency"],
+                choices=["Error A", "Error B", "Error C"],
+                value=["Error A", "Error B", "Error C"],
                 multiselect=True,
                 allow_custom_value=True,
                 label="Tag ID",
@@ -227,8 +237,8 @@ with gr.Blocks(
                 info="Insert one or more tag IDs to use in the highlighted textbox.",
             )
             tag_open = gr.Dropdown(
-                choices=["<t>", "<tm>", "<d>"],
-                value=["<t>", "<tm>", "<d>"],
+                choices=["<a>", "<b>", "<c>"],
+                value=["<a>", "<b>", "<c>"],
                 multiselect=True,
                 allow_custom_value=True,
                 label="Tag open",
@@ -236,8 +246,8 @@ with gr.Blocks(
                 info="Insert one or more tags to mark the beginning of a highlighted section.",
             )
             tag_close = gr.Dropdown(
-                choices=["</t>", "</tm>", "</d>"],
-                value=["</t>", "</tm>", "</d>"],
+                choices=["</a>", "</b>", "</c>"],
+                value=["</a>", "</b>", "</c>"],
                 multiselect=True,
                 allow_custom_value=True,
                 label="Tag close",
@@ -246,14 +256,14 @@ with gr.Blocks(
             )
         gr.Markdown(
             """
-### Example:
+    ### Example:
 
-The following text is tagged using the parameters above to mark spans that will be highlighted.
+    The following text is tagged using the parameters above to mark spans that will be highlighted.
 
-Both the tagged text and the highlighted text are editable, so you can see how the changes in one affect the other.
+    Both the tagged text and the highlighted text are editable, so you can see how the changes in one affect the other.
 
-Highlights will disappear if the highlighted text is edited. Modals will appear upon focus, change, and blur events on the highlighted text.
-"""
+    Highlights will disappear if the highlighted text is edited. Modals will appear upon focus, change, and blur events on the highlighted text.
+    """
         )
         with gr.Row():
             tagged = gr.Textbox(
@@ -274,6 +284,8 @@ Highlights will disappear if the highlighted text is edited. Modals will appear
                 show_label=True,
                 legend_label="Legend:",
                 show_legend_label=True,
+                show_remove_tags_button=True,
+                show_copy_button=False,
             )
 
         # Functions
@@ -293,14 +305,14 @@ Highlights will disappear if the highlighted text is edited. Modals will appear
             inputs=[high, tag_id, tag_open, tag_close, gr.State("Focus")],
             outputs=None,
         )
-        high.change(
+        high.blur(
             fn=show_info,
-            inputs=[high, tag_id, tag_open, tag_close, gr.State("Change")],
+            inputs=[high, tag_id, tag_open, tag_close, gr.State("Blur")],
             outputs=None,
         )
-        high.blur(
+        high.clear(
             fn=show_info,
-            inputs=[high, tag_id, tag_open, tag_close, gr.State("Blur")],
+            inputs=[high, tag_id, tag_open, tag_close, gr.State("Remove tags")],
             outputs=None,
         )
     with gr.Tab("Docs"):