aliabid94 HF staff commited on
Commit
09a6f26
1 Parent(s): 3acb2d9

Upload folder using huggingface_hub

Browse files
.gitignore ADDED
@@ -0,0 +1,9 @@
 
 
 
 
 
 
 
 
 
 
1
+ .eggs/
2
+ dist/
3
+ *.pyc
4
+ __pycache__/
5
+ *.py[cod]
6
+ *$py.class
7
+ __tmp/*
8
+ *.pyi
9
+ node_modules
README.md CHANGED
@@ -1,17 +1,134 @@
1
 
2
- ---
3
- tags: [gradio-custom-component,gradio-template-Column,Modal, Popup]
4
- title: gradio_modal V0.0.3
5
- colorFrom: red
6
- colorTo: gray
7
- sdk: docker
8
- pinned: false
9
- license: apache-2.0
10
- ---
11
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
12
 
13
- # Name: gradio_modal
14
 
15
- Description: A popup modal component
16
 
17
- Install with: pip install gradio_modal
 
1
 
2
+ # `gradio_modal`
3
+ <a href="https://pypi.org/project/gradio_modal/" target="_blank"><img alt="PyPI - Version" src="https://img.shields.io/pypi/v/gradio_modal"></a>
 
 
 
 
 
 
 
4
 
5
+ A popup modal component
6
+
7
+ ## Installation
8
+
9
+ ```bash
10
+ pip install gradio_modal
11
+ ```
12
+
13
+ ## Usage
14
+
15
+ ```python
16
+ import gradio as gr
17
+ from gradio_modal import Modal
18
+
19
+ with gr.Blocks() as demo:
20
+ with gr.Tab("Tab 1"):
21
+ text_1 = gr.Textbox(label="Input 1")
22
+ text_2 = gr.Textbox(label="Input 2")
23
+ text_1.submit(lambda x:x, text_1, text_2)
24
+ show_btn = gr.Button("Show Modal")
25
+ show_btn2 = gr.Button("Show Modal 2")
26
+ gr.Examples(
27
+ [["Text 1", "Text 2"], ["Text 3", "Text 4"]],
28
+ inputs=[text_1, text_2],
29
+ )
30
+ with gr.Tab("Tab 2"):
31
+ gr.Markdown("This is tab 2")
32
+ with Modal(visible=False) as modal:
33
+ for i in range(5):
34
+ gr.Markdown("Hello world!")
35
+ with Modal(visible=False) as modal2:
36
+ for i in range(100):
37
+ gr.Markdown("Hello world!")
38
+ show_btn.click(lambda: Modal(visible=True), None, modal)
39
+ show_btn2.click(lambda: Modal(visible=True), None, modal2)
40
+
41
+ if __name__ == "__main__":
42
+ demo.launch()
43
+
44
+ ```
45
+
46
+ ## `Modal`
47
+
48
+ ### Initialization
49
+
50
+ <table>
51
+ <thead>
52
+ <tr>
53
+ <th align="left">name</th>
54
+ <th align="left" style="width: 25%;">type</th>
55
+ <th align="left">default</th>
56
+ <th align="left">description</th>
57
+ </tr>
58
+ </thead>
59
+ <tbody>
60
+ <tr>
61
+ <td align="left"><code>visible</code></td>
62
+ <td align="left" style="width: 25%;">
63
+
64
+ ```python
65
+ bool
66
+ ```
67
+
68
+ </td>
69
+ <td align="left"><code>False</code></td>
70
+ <td align="left">If False, modal will be hidden.</td>
71
+ </tr>
72
+
73
+ <tr>
74
+ <td align="left"><code>elem_id</code></td>
75
+ <td align="left" style="width: 25%;">
76
+
77
+ ```python
78
+ str | None
79
+ ```
80
+
81
+ </td>
82
+ <td align="left"><code>None</code></td>
83
+ <td align="left">An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
84
+ </tr>
85
+
86
+ <tr>
87
+ <td align="left"><code>elem_classes</code></td>
88
+ <td align="left" style="width: 25%;">
89
+
90
+ ```python
91
+ list[str] | str | None
92
+ ```
93
+
94
+ </td>
95
+ <td align="left"><code>None</code></td>
96
+ <td align="left">An optional string or list of strings that are assigned as the class of this component in the HTML DOM. Can be used for targeting CSS styles.</td>
97
+ </tr>
98
+
99
+ <tr>
100
+ <td align="left"><code>allow_user_close</code></td>
101
+ <td align="left" style="width: 25%;">
102
+
103
+ ```python
104
+ bool
105
+ ```
106
+
107
+ </td>
108
+ <td align="left"><code>True</code></td>
109
+ <td align="left">If True, user can close the modal (by clicking outside, clicking the X, or the escape key).</td>
110
+ </tr>
111
+
112
+ <tr>
113
+ <td align="left"><code>render</code></td>
114
+ <td align="left" style="width: 25%;">
115
+
116
+ ```python
117
+ bool
118
+ ```
119
+
120
+ </td>
121
+ <td align="left"><code>True</code></td>
122
+ <td align="left">If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.</td>
123
+ </tr>
124
+ </tbody></table>
125
+
126
+
127
+ ### Events
128
+
129
+ | name | description |
130
+ |:-----|:------------|
131
+ | `blur` | This listener is triggered when the Modal is unfocused/blurred. |
132
 
 
133
 
 
134
 
 
src/backend/gradio_modal/templates/component/index.js CHANGED
The diff for this file is too large to render. See raw diff
 
src/backend/gradio_modal/templates/component/style.css CHANGED
The diff for this file is too large to render. See raw diff
 
src/frontend/package-lock.json CHANGED
The diff for this file is too large to render. See raw diff
 
src/frontend/package.json CHANGED
@@ -9,14 +9,20 @@
9
  "private": false,
10
  "main": "./Index.svelte",
11
  "exports": {
12
- ".": "./Index.svelte",
 
 
13
  "./package.json": "./package.json"
14
  },
15
  "dependencies": {
16
- "@gradio/atoms": "0.4.1",
17
- "@gradio/icons": "0.3.2",
18
- "@gradio/statustracker": "0.4.3",
19
- "@gradio/utils": "0.2.0",
20
- "@gradio/column": "0.1.0"
 
 
 
 
21
  }
22
- }
 
9
  "private": false,
10
  "main": "./Index.svelte",
11
  "exports": {
12
+ ".": {
13
+ "gradio": "./Index.svelte"
14
+ },
15
  "./package.json": "./package.json"
16
  },
17
  "dependencies": {
18
+ "@gradio/markdown": "0.10.0",
19
+ "@gradio/atoms": "0.9.0",
20
+ "@gradio/column": "0.2.0",
21
+ "@gradio/icons": "0.8.0",
22
+ "@gradio/statustracker": "0.8.1",
23
+ "@gradio/utils": "0.7.0"
24
+ },
25
+ "devDependencies": {
26
+ "@gradio/preview": "^0.12.0"
27
  }
28
+ }
src/frontend/pnpm-lock.yaml CHANGED
The diff for this file is too large to render. See raw diff
 
src/pyproject.toml CHANGED
@@ -8,7 +8,7 @@ build-backend = "hatchling.build"
8
 
9
  [project]
10
  name = "gradio_modal"
11
- version = "0.0.3"
12
  description = "A popup modal component"
13
  readme = "README.md"
14
  license = "MIT"
@@ -16,7 +16,7 @@ requires-python = ">=3.8"
16
  authors = [{ name = "YOUR NAME", email = "[email protected]" }]
17
  keywords = ["gradio-custom-component", "gradio-template-Column", "Modal, Popup"]
18
  # Add dependencies here
19
- dependencies = ["gradio>=4.0,<5.0"]
20
  classifiers = [
21
  'Development Status :: 3 - Alpha',
22
  'License :: OSI Approved :: Apache Software License',
 
8
 
9
  [project]
10
  name = "gradio_modal"
11
+ version = "0.0.4"
12
  description = "A popup modal component"
13
  readme = "README.md"
14
  license = "MIT"
 
16
  authors = [{ name = "YOUR NAME", email = "[email protected]" }]
17
  keywords = ["gradio-custom-component", "gradio-template-Column", "Modal, Popup"]
18
  # Add dependencies here
19
+ dependencies = ["gradio>=4.0,<6.0"]
20
  classifiers = [
21
  'Development Status :: 3 - Alpha',
22
  'License :: OSI Approved :: Apache Software License',