Upload folder using huggingface_hub

.gitignore

@@ -0,0 +1,9 @@
+.eggs/
+dist/
+*.pyc
+__pycache__/
+*.py[cod]
+*$py.class
+__tmp/*
+*.pyi
+node_modules

README.md

@@ -1,17 +1,249 @@
 
----
-tags: [gradio-custom-component,gradio-template-Fallback]
-title: gradio_model4dgs V0.0.3
-colorFrom: pink
-colorTo: gray
-sdk: docker
-pinned: false
-license: apache-2.0
----
+# `gradio_model4dgs`
+<a href="https://pypi.org/project/gradio_model4dgs/" target="_blank"><img alt="PyPI - Version" src="https://img.shields.io/pypi/v/gradio_model4dgs"></a>  
 
+Python library for easily interacting with trained machine learning models
 
-# Name: gradio_model4dgs
+## Installation
 
-Description: Python library for easily interacting with trained machine learning models
+```bash
+pip install gradio_model4dgs
+```
 
-Install with: pip install gradio_model4dgs
+## Usage
+
+```python
+import gradio as gr
+from gradio_model4dgs import Model4DGS
+import os
+
+image_dir = os.path.join(os.path.dirname(__file__), "assets")
+
+if os.path.exists(image_dir) and os.path.isdir(image_dir) and os.listdir(image_dir):
+    examples = [os.path.join(image_dir, file) for file in os.listdir(image_dir)]
+else:
+    examples = [os.path.join(os.path.dirname(__file__), example) for example in Model4DGS().example_inputs()]
+
+with gr.Blocks() as demo:
+    with gr.Row():
+        Model4DGS(value=examples, label="4D Model")
+
+if __name__ == "__main__":
+    demo.launch(share=True)
+```
+
+## `Model4DGS`
+
+### 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>value</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+str | Callable | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">path to (.splat) file to show in model4DGS viewer. If callable, the function will be called whenever the app loads to set the initial value of the component.</td>
+</tr>
+
+<tr>
+<td align="left"><code>height</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+int | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">height of the model4DGS component, in pixels.</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">None</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">None</td>
+</tr>
+
+<tr>
+<td align="left"><code>every</code></td>
+<td align="left" style="width: 25%;">
+
+```python
+float | None
+```
+
+</td>
+<td align="left"><code>None</code></td>
+<td align="left">None</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">None</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">None</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">None</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">None</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">None</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">None</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">None</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">None</td>
+</tr>
+</tbody></table>
+
+
+### Events
+
+| name | description |
+|:-----|:------------|
+| `change` | Triggered when the value of the Model4DGS changes either because of user input (e.g. a user types in a textbox) OR because of a function update (e.g. an image receives a value from the output of an event trigger). See `.input()` for a listener that is only triggered by user input. |
+| `upload` | This listener is triggered when the user uploads a file into the Model4DGS. |
+| `edit` | This listener is triggered when the user edits the Model4DGS (e.g. image) using the built-in editor. |
+| `clear` | This listener is triggered when the user clears the Model4DGS using the X button for the component. |
+
+
+
+### 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.
+- **As input:** Should return, the output data received by the component from the user's function in the backend.
+
+ ```python
+ def predict(
+     value: List[str] | None
+ ) -> List[str] | str | None:
+     return value
+ ```
+ 

src/backend/gradio_model4dgs/templates/example/index.js

@@ -1,11 +1,11 @@
 const {
-  SvelteComponent: f,
-  append: u,
-  attr: d,
+  SvelteComponent: u,
+  append: d,
+  attr: _,
   detach: g,
   element: o,
-  init: v,
-  insert: r,
+  init: r,
+  insert: v,
   noop: c,
   safe_not_equal: y,
   set_data: m,
@@ -19,7 +19,7 @@ function w(a) {
       e = o("div"), n = b(
         /*value*/
         a[0]
-      ), d(e, "class", "svelte-1gecy8w"), i(
+      ), _(e, "class", "svelte-1gecy8w"), i(
         e,
         "table",
         /*type*/
@@ -37,7 +37,7 @@ function w(a) {
       );
     },
     m(t, l) {
-      r(t, e, l), u(e, n);
+      v(t, e, l), d(e, n);
     },
     p(t, [l]) {
       l & /*value*/
@@ -73,16 +73,16 @@ function w(a) {
   };
 }
 function h(a, e, n) {
-  let { value: t } = e, { type: l } = e, { selected: _ = !1 } = e;
+  let { value: t } = e, { type: l } = e, { selected: f = !1 } = e;
   return a.$$set = (s) => {
-    "value" in s && n(0, t = s.value), "type" in s && n(1, l = s.type), "selected" in s && n(2, _ = s.selected);
-  }, [t, l, _];
+    "value" in s && n(0, t = s.value), "type" in s && n(1, l = s.type), "selected" in s && n(2, f = s.selected);
+  }, [t, l, f];
 }
-class E extends f {
+class q extends u {
   constructor(e) {
-    super(), v(this, e, h, w, y, { value: 0, type: 1, selected: 2 });
+    super(), r(this, e, h, w, y, { value: 0, type: 1, selected: 2 });
   }
 }
 export {
-  E as default
+  q as default
 };

src/frontend/package.json

@@ -17,7 +17,10 @@
     "@gradio/client": "0.10.1",
     "@gradio/statustracker": "0.4.4",
     "@gradio/utils": "0.2.1",
-    "@mkkellogg/gaussian-splats-3d": "^0.2.3",
+    "@mkkellogg/gaussian-splats-3d": "^0.4.1",
     "three": "^0.162.0"
+  },
+  "devDependencies": {
+    "@gradio/preview": "^0.9.0"
   }
 }