2023-01-01 18:08:40 +08:00
|
|
|
import gradio as gr
|
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class FormComponent:
|
|
|
|
def get_expected_parent(self):
|
|
|
|
return gr.components.Form
|
2023-01-01 18:08:40 +08:00
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
gr.Dropdown.get_expected_parent = FormComponent.get_expected_parent
|
2023-01-01 18:08:40 +08:00
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class ToolButton(FormComponent, gr.Button):
|
|
|
|
"""Small button with single emoji as text, fits inside gradio forms"""
|
2023-01-21 13:36:07 +08:00
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
def __init__(self, *args, **kwargs):
|
|
|
|
classes = kwargs.pop("elem_classes", [])
|
|
|
|
super().__init__(*args, elem_classes=["tool", *classes], **kwargs)
|
2023-01-21 13:36:07 +08:00
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "button"
|
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class FormRow(FormComponent, gr.Row):
|
2023-01-01 18:08:40 +08:00
|
|
|
"""Same as gr.Row but fits inside gradio forms"""
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "row"
|
2023-01-03 14:04:29 +08:00
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class FormColumn(FormComponent, gr.Column):
|
|
|
|
"""Same as gr.Column but fits inside gradio forms"""
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "column"
|
|
|
|
|
|
|
|
|
|
|
|
class FormGroup(FormComponent, gr.Group):
|
2023-08-04 12:50:17 +08:00
|
|
|
"""Same as gr.Group but fits inside gradio forms"""
|
2023-01-03 14:04:29 +08:00
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "group"
|
2023-01-07 14:56:37 +08:00
|
|
|
|
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class FormHTML(FormComponent, gr.HTML):
|
2023-01-07 14:56:37 +08:00
|
|
|
"""Same as gr.HTML but fits inside gradio forms"""
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "html"
|
|
|
|
|
2023-01-11 04:47:02 +08:00
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class FormColorPicker(FormComponent, gr.ColorPicker):
|
2023-01-11 04:47:02 +08:00
|
|
|
"""Same as gr.ColorPicker but fits inside gradio forms"""
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "colorpicker"
|
2023-01-22 20:38:39 +08:00
|
|
|
|
2023-01-27 04:29:27 +08:00
|
|
|
|
2023-03-20 21:09:36 +08:00
|
|
|
class DropdownMulti(FormComponent, gr.Dropdown):
|
2023-01-27 04:29:27 +08:00
|
|
|
"""Same as gr.Dropdown but always multiselect"""
|
|
|
|
def __init__(self, **kwargs):
|
|
|
|
super().__init__(multiselect=True, **kwargs)
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "dropdown"
|
2023-04-29 17:52:09 +08:00
|
|
|
|
|
|
|
|
|
|
|
class DropdownEditable(FormComponent, gr.Dropdown):
|
|
|
|
"""Same as gr.Dropdown but allows editing value"""
|
|
|
|
def __init__(self, **kwargs):
|
|
|
|
super().__init__(allow_custom_value=True, **kwargs)
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "dropdown"
|
|
|
|
|
2023-08-10 16:20:46 +08:00
|
|
|
|
|
|
|
class InputAccordion(gr.Checkbox):
|
2023-08-10 18:02:50 +08:00
|
|
|
"""A gr.Accordion that can be used as an input - returns True if open, False if closed.
|
|
|
|
|
|
|
|
Actaully just a hidden checkbox, but creates an accordion that follows and is followed by the state of the checkbox.
|
|
|
|
"""
|
|
|
|
|
2023-08-10 16:20:46 +08:00
|
|
|
global_index = 0
|
|
|
|
|
|
|
|
def __init__(self, value, **kwargs):
|
|
|
|
self.accordion_id = kwargs.get('elem_id')
|
|
|
|
if self.accordion_id is None:
|
2023-08-10 20:32:54 +08:00
|
|
|
self.accordion_id = f"input-accordion-{InputAccordion.global_index}"
|
|
|
|
InputAccordion.global_index += 1
|
2023-08-10 16:20:46 +08:00
|
|
|
|
|
|
|
kwargs['elem_id'] = self.accordion_id + "-checkbox"
|
|
|
|
kwargs['visible'] = False
|
|
|
|
super().__init__(value, **kwargs)
|
|
|
|
|
|
|
|
self.change(fn=None, _js='function(checked){ inputAccordionChecked("' + self.accordion_id + '", checked); }', inputs=[self])
|
|
|
|
|
|
|
|
self.accordion = gr.Accordion(kwargs.get('label', 'Accordion'), open=value, elem_id=self.accordion_id, elem_classes=['input-accordion'])
|
|
|
|
|
|
|
|
def extra(self):
|
2023-08-10 18:02:50 +08:00
|
|
|
"""Allows you to put something into the label of the accordion.
|
|
|
|
|
|
|
|
Use it like this:
|
|
|
|
|
|
|
|
```
|
|
|
|
with InputAccordion(False, label="Accordion") as acc:
|
|
|
|
with acc.extra():
|
|
|
|
FormHTML(value="hello", min_width=0)
|
|
|
|
|
|
|
|
...
|
|
|
|
```
|
|
|
|
"""
|
|
|
|
|
2023-08-10 16:20:46 +08:00
|
|
|
return gr.Column(elem_id=self.accordion_id + '-extra', elem_classes='input-accordion-extra', min_width=0)
|
|
|
|
|
|
|
|
def __enter__(self):
|
|
|
|
self.accordion.__enter__()
|
|
|
|
return self
|
|
|
|
|
|
|
|
def __exit__(self, exc_type, exc_val, exc_tb):
|
|
|
|
self.accordion.__exit__(exc_type, exc_val, exc_tb)
|
|
|
|
|
|
|
|
def get_block_name(self):
|
|
|
|
return "checkbox"
|
|
|
|
|