html table

app.py

@@ -40,8 +40,40 @@ def search_kbli(text: str):
 
     results = response.data if response.data else []
 
-    return {"embedding": embedding, "results": results}
-    
+        html = """
+    <style>
+        .kbli-item {
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            padding: 10px;
+            margin-bottom: 8px;
+            transition: background 0.2s ease;
+        }
+        .kbli-item:hover {
+            background: #f9fafb;
+        }
+        .kbli-title {
+            font-weight: 600;
+            margin: 0;
+        }
+        .kbli-desc {
+            font-size: 13px;
+            color: #4b5563;
+            margin-top: 4px;
+        }
+    </style>
+    <div>
+    """
+    for r in results:
+        html += f"""
+        <div class="kbli-item">
+            <p class="kbli-title">{r['kode']} – {r['judul']}</p>
+            <p class="kbli-desc">{r['deskripsi']}</p>
+        </div>
+        """
+    html += "</div>"
+    return html
+
 # Gradio Interface
 # `fn` adalah fungsi yang akan dieksekusi
 # `inputs` adalah jenis input (dalam hal ini, sebuah teks)
@@ -64,7 +96,7 @@ with gr.Blocks() as demo:
 
     with gr.Tab("Search KBLI"):
         inp2 = gr.Textbox(label="Masukkan teks")
-        out2 = gr.JSON(label="Hasil KBLI (Embedding + Match)")
+        out2 = gr.HTML(label="Hasil KBLI")
         inp2.submit(search_kbli, inp2, out2, api_name="search_kbli")
 
         with gr.Row():