Upload folder using huggingface_hub

README.md

@@ -1,12 +1,12 @@
+
 ---
-title: Component Props
-emoji: 😻
-colorFrom: purple
-colorTo: red
+title: component_props 
+emoji: 🔥
+colorFrom: indigo
+colorTo: indigo
 sdk: gradio
-sdk_version: 5.49.1
-app_file: app.py
+sdk_version: 6.0.0
+app_file: run.py
 pinned: false
+hf_oauth: true
 ---
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

run.ipynb

@@ -0,0 +1 @@
+{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: component_props"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["# Downloading files from the demo repo\n", "import os\n", "!wget -q https://github.com/gradio-app/gradio/raw/main/demo/component_props/cheetah.jpg"]}, {"cell_type": "code", "execution_count": null, "id": "44380577570523278879349135829904343037", "metadata": {}, "outputs": [], "source": ["import gradio as gr\n", "from gradio.media import get_image\n", "\n", "with gr.Blocks() as demo:\n", "    a = gr.Number(value=5, minimum=0, maximum=10, label=\"Input A\", info=\"Enter a number between 0 and 10\")\n", "    output_a = gr.JSON(label=\"Output\", elem_id=\"output\")\n", "    with gr.Row():\n", "        show_value_btn = gr.Button(\"Show Value\")\n", "        double_btn = gr.Button(\"Double Value and Maximum\")\n", "        reset_btn = gr.Button(\"Reset\")\n", "\n", "    def process_with_props(x: gr.Number):\n", "        return {\n", "            \"value\": x.value,\n", "            \"maximum\": x.maximum,\n", "            \"minimum\": x.minimum,\n", "        }\n", "    show_value_btn.click(process_with_props, a, output_a)\n", "\n", "    def double_value_and_max(x: gr.Number):\n", "        x.maximum *= 2  # type: ignore\n", "        x.value = (x.value or 0) * 2\n", "        x.info = f\"Enter a number between 0 and {x.maximum}\"\n", "        return x\n", "\n", "    double_btn.click(double_value_and_max, a, a).then(\n", "        process_with_props, a, output_a\n", "    )\n", "\n", "    def reset(x: gr.Number):\n", "        x.maximum = 10\n", "        x.value = 5\n", "        x.info = \"Enter a number between 0 and 10\"\n", "        return x\n", "\n", "    reset_btn.click(reset, a, a).then(\n", "        process_with_props, a, output_a\n", "    )\n", "\n", "    # Image component demo\n", "    gr.Markdown(\"## Image Component Props\")\n", "    b = gr.Image(value=get_image(\"cheetah.jpg\"), label=\"Input Image\", width=300, height=300, type=\"filepath\")\n", "    output_b = gr.JSON(label=\"Image Props Output\", elem_id=\"image-output\")\n", "    with gr.Row():\n", "        show_image_props_btn = gr.Button(\"Show Image Props\")\n", "        change_image_size_btn = gr.Button(\"Change Image Size\")\n", "        reset_image_btn = gr.Button(\"Reset Image\")\n", "\n", "    def show_image_props(x: gr.Image):\n", "        return {\n", "            \"value\": x.value if x.value is None else str(x.value),\n", "            \"width\": x.width,\n", "            \"height\": x.height,\n", "            \"type\": x.type,\n", "        }\n", "    show_image_props_btn.click(show_image_props, b, output_b)\n", "\n", "    def change_image_size(x: gr.Image):\n", "        x.width = 400\n", "        x.height = 400\n", "        return x\n", "\n", "    change_image_size_btn.click(change_image_size, b, b).then(\n", "        show_image_props, b, output_b\n", "    )\n", "\n", "    def reset_image(x: gr.Image):\n", "        x.width = 300\n", "        x.height = 300\n", "        x.value = get_image(\"cheetah.jpg\")\n", "        return x\n", "\n", "    reset_image_btn.click(reset_image, b, b).then(\n", "        show_image_props, b, output_b\n", "    )\n", "\n", "\n", "if __name__ == \"__main__\":\n", "    demo.launch()\n"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}

run.py

@@ -0,0 +1,79 @@
+import gradio as gr
+from gradio.media import get_image
+
+with gr.Blocks() as demo:
+    a = gr.Number(value=5, minimum=0, maximum=10, label="Input A", info="Enter a number between 0 and 10")
+    output_a = gr.JSON(label="Output", elem_id="output")
+    with gr.Row():
+        show_value_btn = gr.Button("Show Value")
+        double_btn = gr.Button("Double Value and Maximum")
+        reset_btn = gr.Button("Reset")
+
+    def process_with_props(x: gr.Number):
+        return {
+            "value": x.value,
+            "maximum": x.maximum,
+            "minimum": x.minimum,
+        }
+    show_value_btn.click(process_with_props, a, output_a)
+
+    def double_value_and_max(x: gr.Number):
+        x.maximum *= 2  # type: ignore
+        x.value = (x.value or 0) * 2
+        x.info = f"Enter a number between 0 and {x.maximum}"
+        return x
+
+    double_btn.click(double_value_and_max, a, a).then(
+        process_with_props, a, output_a
+    )
+
+    def reset(x: gr.Number):
+        x.maximum = 10
+        x.value = 5
+        x.info = "Enter a number between 0 and 10"
+        return x
+
+    reset_btn.click(reset, a, a).then(
+        process_with_props, a, output_a
+    )
+
+    # Image component demo
+    gr.Markdown("## Image Component Props")
+    b = gr.Image(value=get_image("cheetah.jpg"), label="Input Image", width=300, height=300, type="filepath")
+    output_b = gr.JSON(label="Image Props Output", elem_id="image-output")
+    with gr.Row():
+        show_image_props_btn = gr.Button("Show Image Props")
+        change_image_size_btn = gr.Button("Change Image Size")
+        reset_image_btn = gr.Button("Reset Image")
+
+    def show_image_props(x: gr.Image):
+        return {
+            "value": x.value if x.value is None else str(x.value),
+            "width": x.width,
+            "height": x.height,
+            "type": x.type,
+        }
+    show_image_props_btn.click(show_image_props, b, output_b)
+
+    def change_image_size(x: gr.Image):
+        x.width = 400
+        x.height = 400
+        return x
+
+    change_image_size_btn.click(change_image_size, b, b).then(
+        show_image_props, b, output_b
+    )
+
+    def reset_image(x: gr.Image):
+        x.width = 300
+        x.height = 300
+        x.value = get_image("cheetah.jpg")
+        return x
+
+    reset_image_btn.click(reset_image, b, b).then(
+        show_image_props, b, output_b
+    )
+
+
+if __name__ == "__main__":
+    demo.launch()