Spaces:
Running
Running
# `gradio_hubquicksearch` | |
<img alt="Static Badge" src="https://img.shields.io/badge/version%20-%200.0.1%20-%20orange"> | |
Quick search HF Hub repos or users | |
## Installation | |
```bash | |
pip install gradio_hubquicksearch | |
``` | |
## Usage | |
```python | |
import gradio as gr | |
from gradio_hubquicksearch import HubQuicksearch | |
example = HubQuicksearch().example_value() | |
demo = gr.Interface( | |
lambda x:x, | |
HubQuicksearch(label="repo id from the hub"), # interactive version of your component | |
HubQuicksearch(), # static version of your component | |
# examples=[[example]], # uncomment this line to view the "example version" of your component | |
) | |
if __name__ == "__main__": | |
demo.launch() | |
``` | |
## `HubQuicksearch` | |
### 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">default text to provide in textbox. 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>placeholder</code></td> | |
<td align="left" style="width: 25%;"> | |
```python | |
str | None | |
``` | |
</td> | |
<td align="left"><code>None</code></td> | |
<td align="left">placeholder hint to provide behind textbox.</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">component name in interface.</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">If `value` is a callable, run the function 'every' number of seconds while the client connection is open. Has no effect otherwise. The event can be accessed (e.g. to cancel it) via this component's .load_event attribute.</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">if True, will display label.</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">relative size compared to adjacent Components. For example if Components A and B are in a Row, and A has scale=2, and B has scale=1, A will be twice as wide as B. Should be an integer. scale applies in Rows, and to top-level Components in Blocks where fill_height=True.</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">minimum pixel width, will wrap if not sufficient screen space to satisfy this value. If a certain scale value results in this Component being narrower than min_width, the min_width parameter will be respected first.</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">if True, will be rendered as an editable textbox; if False, editing will be disabled. If not provided, this is inferred based on whether the component is used as an input or output.</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">If False, component will be hidden.</td> | |
</tr> | |
<tr> | |
<td align="left"><code>rtl</code></td> | |
<td align="left" style="width: 25%;"> | |
```python | |
bool | |
``` | |
</td> | |
<td align="left"><code>False</code></td> | |
<td align="left">If True and `type` is "text", sets the direction of the text to right-to-left (cursor appears on the left of the text). Default is False, which renders cursor on the right.</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">An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles.</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">An optional list of strings that are assigned as the classes of this component in the HTML DOM. Can be used for targeting CSS styles.</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">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> | |
</tr> | |
</tbody></table> | |
### Events | |
| name | description | | |
|:-----|:------------| | |
| `change` | Triggered when the value of the HubQuicksearch 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. | | |
| `input` | This listener is triggered when the user changes the value of the HubQuicksearch. | | |
| `submit` | This listener is triggered when the user presses the Enter key while the HubQuicksearch is focused. | | |
### 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, passes text value as a {str} into the function. | |
- **As input:** Should return, expects a {str} returned from function and sets textarea value to it. | |
```python | |
def predict( | |
value: str | None | |
) -> str | None: | |
return value | |
``` | |