Upload with huggingface_hub

README.md

@@ -1,12 +1,12 @@
+
 ---
-title: Blocks Js Methods
-emoji: 🐢
-colorFrom: gray
-colorTo: red
+title: blocks_js_methods 
+emoji: 🔥
+colorFrom: indigo
+colorTo: indigo
 sdk: gradio
 sdk_version: 3.3.1
+
 app_file: app.py
 pinned: false
 ---
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -0,0 +1,28 @@
+import gradio as gr
+
+blocks = gr.Blocks()
+
+with blocks as demo:
+    subject = gr.Textbox(placeholder="subject")
+    verb = gr.Radio(["ate", "loved", "hated"])
+    object = gr.Textbox(placeholder="object")
+
+    with gr.Row():
+        btn = gr.Button("Create sentence.")
+        reverse_btn = gr.Button("Reverse sentence.")
+        foo_bar_btn = gr.Button("Foo bar.")
+    
+    def sentence_maker(w1, w2, w3):
+        return f"{w1} {w2} {w3}"
+
+    output1 = gr.Textbox(label="output 1")
+    output2 = gr.Textbox(label="verb")
+    output3 = gr.Textbox(label="verb reversed")
+
+    btn.click(sentence_maker, [subject, verb, object], output1)
+    reverse_btn.click(None, [subject, verb, object], output2, _js="(s, v, o) => o + ' ' + v + ' ' + s")
+    verb.change(lambda x: x, verb, output3, _js="(x) => [...x].reverse().join('')")
+    foo_bar_btn.click(None, [], subject, _js="(x) => x + ' foo'")
+
+if __name__ == "__main__":
+    demo.launch()