Theme builder by aliabid94 · Pull Request #3664 · gradio-app/gradio

aliabid94 · 2023-03-28T10:16:20Z

Created automatic theme builder, launchable via

import gradio as gr
gr.themes.builder()

Decided to make it a local app instead of on our site or on spaces, because the app itself is heavy and would otherwise be slow.

In the process of building this, fixed / changed some UI elements:

Added support for dropdowns to allow custom text values
Added blur event listener to colorpicker

gradio-pr-bot · 2023-03-28T10:17:13Z

🎉 The demo notebooks match the run.py files! 🎉

gradio-pr-bot · 2023-03-28T10:19:19Z

All the demos for this PR have been deployed at https://huggingface.co/spaces/gradio-pr-deploys/pr-3664-all-demos

abidlabs · 2023-03-29T16:48:51Z

+
+
+if __name__ == "__main__":
+    demo.launch()


Suggestion:

Suggested change

demo.launch()

demo.launch(inline=False, inbrowser=True)

Well this actually isn't where it's launched really, it's launched from themes/__init__.py as:

def builder(*args, **kwargs): from gradio.themes.builder import demo demo.launch(*args, **kwargs)

So users can pass any launch args

abidlabs · 2023-03-29T17:04:08Z

We've now removed the "X" symbol from the single-select Dropdown, so it's very hard to know that the Dropdown is typeable. I would suggest we add the blinking line that indicates that you can type somewhere when you make a selection from the Dropdown. Here's how it currently looks like for me (I had to press the "delete" button so I could type here -- not intuitive at all):

abidlabs · 2023-03-29T17:13:44Z

It feels like there are too many fields here, which makes it unnecessarily difficult for people to upload their themes:

Why is theme name different from repo name? Let's just use the repo name for both, like we do in .push_to_hub(). I would also convert any spaces to underscores, etc. to ensure that the repo name is valid (right now it just errors out)
Imo we should remove description. Requires someone to come up with a description on the spot, which again, is an obstacle
It would be cool if the theme builder detected that you were logged in via the HF CLI and then didn't ask you for your HF token
Nit: the default version should be 0.0.1 to be consistent with the .push_to_hub() method
Maybe: replace this text "Instructions on making an HF account..." with "Find your HF token here" and link to https://huggingface.co/settings/tokens

Also, when I clicked "upload to hub", I wasn't sure if anything happend. Maybe when you click on the button, it should become disabled and the text should say, "uploading...". And then once it's uploaded, it can reset back. Should be pretty straightforward to do with .then().

abidlabs · 2023-03-29T17:19:10Z

@aliabid94 the Theme Builder is amazing! I have some suggestions above, but they are mostly small. Let's launch this!

freddyaboulton · 2023-03-29T18:27:46Z

This is really awesome @aliabid94 ! 🔥 🔥

Awesome app. I think it definitely makes creating themes 10x easier plus I learned something from reading the code.

Only bug I noticed is that the generated code is not reflecting changes to the font:

I think we should host on spaces though. If we find a bug or want to make a modification we'd have to ship a new release to pypi which doesn't sound ideal. Users can clone the space without a HF account and run it locally even if they don't have a HF account.

Co-authored-by: Abubakar Abid <abubakar@huggingface.co>

…into theme_builder_2

aliabid94 · 2023-03-29T21:35:09Z

Fixed all above requested changes, please rereview!

…into theme_builder_2

abidlabs

Just tried it out and the experience pushing the theme to the Hub was so smooth. Love it!! LGTM

freddyaboulton · 2023-03-29T22:36:02Z

Awesome PR @aliabid94 ! Thanks for making the changes.

I accidentally didn't include my HF token when pushing to the hub because I thought it was optional if you were already signed in via cli. The error didn't get reported to the UI and the "Uploading...." text got displayed forever and didn't change back. I think we should catch any exceptions that could happen, report them to the user, and then change the button back in that case!

freddyaboulton

Thanks for addressing all the feedback @aliabid94 !

This is very useful 🔥

* changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * Update CHANGELOG.md Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Update gradio/themes/builder.py Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co>

* update gallery styles * Set theme name from load (#3595) * Add name + test * Add theme names * CHANGELOG * Delete theme in interface * Trigger event when Slider number input is released (#3589) * Add event * Add unit test * CHANGELOG * Sets up the Python `gradio` client (#3300) * placeholder * changelog * added to readme * client * implement futures * utils * scripts * lint * reorg * scripts * serialization * cleanup * fns * serialize * cache * callbacks * updates * formatting * packaging * requirements * remove changelog * client * access token * formatting * deprecate * format backend * client replace * updates * moving from utils * remove code duplication * rm duplicates * simplify * galleryserializer * serializable * load serializers * fixing errors * errors * typing * tests * changelog * lint * fix lint * fixing files * formatting * type * fix type checking * changelog * changelog * Update client/python/gradio_client/client.py Co-authored-by: Lucain <lucainp@gmail.com> * formatting, tests * formatting, tests * gr.load * refactoring * refactoring' * formatting * formatting * tests * tests * fix tests * cleanup * added tests * adding scripts * formatting * address review comments * readme * serialize info * remove from changelog * version 0.0.2 released * lint * type fix * check * type issues * hf_token * update hf token * telemetry * docs, circle dependency * hf token * formatting * updates * sort * script * external * docs * formatting * fixes * scripts * requirements * fix tests * context * changes * formatting * fixes * format fix --------- Co-authored-by: Lucain <lucainp@gmail.com> * Translate "or" for i18n (#3599) * Translate or for i18n * CHANGELOG * Fixes Blocks exit issue (#3600) * fix * changelog * blocks * formatting * Use gradio-api-server for telemetry (#3488) * analytics * changelog * remove interface analytics * ip * remove import * format * theme name * theme analytics * format * changelog * fixes * format * remove unused param --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Simplify tests (#3608) * simplify tests * imports * imports * formatting * removed cometml typing * simplify * changelog * fix wc error in dev mode (#3572) Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * A few small fixes to docs / demos (#3611) * fixes * remove binaries * doc * changelog * typing * run on windows * cancels * added clarifications * Add docs for HF Json saver (#3604) * Add docs for flagging * Fix params * CHANGELOG --------- Co-authored-by: freddyaboulton <alfonsoboulton@gmail.com> * ensure css loads before mounting app (#3573) * ensure css loads before mounting app * changelog * fix tests * change? * changelog * fix issue with missing version (#3632) Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com> * Fixes chatbot autoscroll + Textbox lines > 20 issue (#3637) * fixes * changelog * Update gradio/components.py Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Update CHANGELOG.md * Update CHANGELOG.md --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix embedded demos (#3638) Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Add Windows CI (#3628) * Add Windows CI * Update changelog * fix * Skip one test on Windows * Preserve virtualenv path * Skip another test on Windows * Make conditional flaky * Requested changes * consistent os * cleanup * fix test for windows * remove unnecessary check * lint * lint --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * move files (#3605) * move files * commit the rest of the files * fix lockfile * fix workflow * fix type errors * fix tests * only run ci when certain files change * run correct test command in ci * version * fix pypi script --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Support empty lists being used in `gr.Dataframe` (#3646) * Support empty lists being used in `gr.Dataframe` * Update changelog * Add empty dataframe test --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix windows flake (#3650) * fix windows flake * format backend --------- Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com> * Raise errror if event queued but queue is not enabled (#3640) * Raise Error * CHANGELOG * Add progress tracking validate_queue_settings * Update gradio/blocks.py Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix test --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Copy everything in website Dockerfile, fix build issues (#3659) * dockerfile * copy everything from repo * correct dir * changelog * Correct the documentation of `gr.File` component (#3660) This closes #3658. Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Nit in ValueError (#3669) * Nit in ValueError * CHANGELOG --------- Co-authored-by: freddyaboulton <alfonsoboulton@gmail.com> * Load upstream theme (#3641) * theme loading * upstream theme * version * format themes * fixes * tests * one more test * fix test * address review * Add job for python client ci (#3674) * Add job + lint * Fix path * Fix path * Fix path * Checkout * Add test requirements * Fix syntax * Fix test * Lint * Fix deps + README * Move dependency * Hide dropdown if in single-select mode (#3678) * Hide dropdown if in single-select mode * Update changelog --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix default parameters value and gr.Progress in same function (#3671) * Fix default parameters value and gr.Progress in same function * Update changelog * Fix tests * Format * Expand tests for other types of special function arguments * Augment SelectData tests --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * warning * changelog * ghangelog * changelog * object fit optional * Add status for Python Client Jobs (#3645) * Add status + unit test (flaky) for now * Install client * Fix tests * Lint backend + tests * Add non-queue test * Fix name * Use lock instead * Add simplify implementation + fix tests * Restore changes to scripts * Fix README typo * Fix CI * Add two concurrent test * Fix broken spaces in docs (#3698) * fix examples in sentence_builder * fix sklearn error in titanic demo * regenerate notebooks * changelgo * Add download button for video (#3581) * Add download buttom * Add missing imports * CHANGELOG * Update CHANGELOG.md * Trigger CI * Fix visibility * Try to fix ci * Fix deps * download button change * Lint --------- Co-authored-by: Dawood <dawoodkhan82@gmail.com> Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix outdated sharing your app guide (#3699) * fix embed this space screenshot * fix use via api * changelog --------- Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com> * Add orig_name field to video outputs (#3700) * Add orig_name to video * Fix test * CHANGELOG * Lint * Theme builder (#3664) * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * Update CHANGELOG.md Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Update gradio/themes/builder.py Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * fix dropdowns, release 3.24 (#3713) * changes * changes * Update version.txt * New Version Docs (#3715) * [create-pull-request] automated change * fix changelog --------- Co-authored-by: abidlabs <abidlabs@users.noreply.github.com> Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix chatbot newline issue (#3717) * changes * changes * changes * changelog --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * New Version Docs (#3720) * [create-pull-request] automated change * Trigger Build --------- Co-authored-by: aliabd <aliabd@users.noreply.github.com> Co-authored-by: aliabd <ali.si3luwa@gmail.com> * Fix Serializer Mapping (#3722) * Fix mapping and test * Bump gradio version * Revert gradio version bump * Fix some bugs related to Python client (#3721) * client format * docs * formatting * fix tests * fixed bug * api endpoint changes * fix tests * fix tests * formatting * Add support for sessions [python client] (#3731) * client * add state and tests * remove session param * node support for js client (#3692) * bundle js client + gen types * changeset * changeset * fix bugs * fix deps * fix deps * format * fix ci * fix types * Support IPv6 addresses for --server-name (#3695) * Support IPv6 addresses for --server-name * Update changelog now that I have a PR number. --------- Co-authored-by: freddyaboulton <alfonsoboulton@gmail.com> * Increase timeout for analytics request + remove exception print (#3647) * increase timeout * merge * Add changelog --------- Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com> * Switch linting to Ruff (#3710) * Sort requirements.in * Switch flake8 + isort to ruff * Apply ruff import order fixes * Fix ruff complaints in demo/ * Fix ruff complaints in test/ * Use `x is not y`, not `not x is y` * Remove unused listdir from website generator * Clean up duplicate dict keys * Add changelog entry * Clean up unused imports (except in gradio/__init__.py) * add space --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Fix missing docstrings (new PR) (#3740) * Move documentation for _js into docstring, not a stray comment * Add missing argument docstrings (and remove non-existent ones) * Add changelog entry * updated docstrings * changelog * contributors * changelog * formatting * removed _js --------- Co-authored-by: Aarni Koskela <akx@iki.fi> * import (#3742) * Import Literal from typing extensions in client (#3741) * Fix typing extensions * Import typing_extensions --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Access http token for ws connection (#3735) * Access unsecure token * CHANGELOG --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * Add root_url to serializers in gradio_client (#3736) * Add root_url to serializers * Add url fix * Respect fn parameter * Fix docstring * Add other test * Pass to method * CI tweaks (#3752) * Adds a pypi release action for the gradio python client (#3743) * release action * fixes * name * Update version.txt * Update version.txt * update * fixes * version * rename * action * fix token * custom dir * fixes * change password * revert back to token * scripts * remove twine * Get Intermediate Results from Python Client (#3694) * Add status + unit test (flaky) for now * Install client * Fix tests * Lint backend + tests * Add non-queue test * Fix name * Use lock instead * Add simplify implementation + fix tests * Restore changes to scripts * Fix README typo * Fix CI * Add intermediate results to python client * Type check * Typecheck again * Catch exception: * Thinking * Dont read generator from config * add no queue test * Remove unused method * Fix types * Remove breakpoint * Fix code * Fix test * Fix tests * Unpack list * Add docstring --------- Co-authored-by: Abubakar Abid <abubakar@huggingface.co> * changes (#3760) * Make Client Jobs Iterable (#3762) * Add iterator * Break if done * Add test for early termination * changelog * notebooks --------- Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com> Co-authored-by: Abubakar Abid <abubakar@huggingface.co> Co-authored-by: Lucain <lucainp@gmail.com> Co-authored-by: pngwn <hello@pngwn.io> Co-authored-by: Omar Sanseviero <osanseviero@gmail.com> Co-authored-by: Ali Abdalla <ali.si3luwa@gmail.com> Co-authored-by: space-nuko <24979496+space-nuko@users.noreply.github.com> Co-authored-by: Luo Peng <luopeng.he@gmail.com> Co-authored-by: aliabid94 <aabid94@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: abidlabs <abidlabs@users.noreply.github.com> Co-authored-by: aliabd <aliabd@users.noreply.github.com> Co-authored-by: Dan Sully <dan+github@sully.org> Co-authored-by: Aarni Koskela <akx@iki.fi>

TaceDelacam · 2023-04-22T19:33:51Z

Hello! Forgive me if this isn't the correct place to ask this. I'm still trying to learn to navigate github. I got the builder running yesterday and managed to tinker enough to create a fun theme to use but after poking around with it in my UI I'd like to go back and make some changes to spacing and color and whatnot and update it on my HF.
Is there any way to load an already created theme from HF into the builder again or am I stuck having to edit things manually in the json? The only things in the dropdown menu for themes to work from are the base ones. The builder is such a smooth process and makes it much easier for me to see what I'm changing than the strings of letters and numbers in the code. 😅

abidlabs · 2023-04-23T23:39:59Z

Hi @tacediak currently, you cannot load an existing theme into the theme builder -- you can only create new ones from the existing built-in themes. Agreed that this would be a handy feature but probably not one we'll release in the near future. We welcome any PRs to this effect.

aliabid94 added 12 commits March 24, 2023 06:38

changes

b368dfe

changes

3f93aa8

changes

44081f7

Merge remote-tracking branch 'origin' into theme_builder

761d73a

changes

85b37c5

changes

16e25d1

changes

57f0850

changes

4602244

changes

bb8ce68

changes

7122125

changes

7bee238

changes

9fe397d

changes

fca3c1d

abidlabs marked this pull request as ready for review March 29, 2023 15:46

abidlabs reviewed Mar 29, 2023

View reviewed changes

Comment thread CHANGELOG.md

Merge branch 'main' into theme_builder_2

d19c95d

abidlabs reviewed Mar 29, 2023

View reviewed changes

Comment thread gradio/themes/builder.py Outdated

aliabid94 and others added 6 commits March 29, 2023 11:36

changes

1607ea4

Update CHANGELOG.md

c34b8e4

Co-authored-by: Abubakar Abid <abubakar@huggingface.co>

Update gradio/themes/builder.py

7c9fb53

Co-authored-by: Abubakar Abid <abubakar@huggingface.co>

changes

e281f6f

Merge branch 'theme_builder_2' of https://github.com/gradio-app/gradio …

08bbd9a

…into theme_builder_2

changes

dfa441a

aliabid94 and others added 5 commits March 29, 2023 14:36

changes

738cb98

Merge branch 'main' into theme_builder_2

19a1997

Merge branch 'main' into theme_builder_2

f0347a8

Merge remote-tracking branch 'origin' into theme_builder_2

346cdc6

Merge branch 'theme_builder_2' of https://github.com/gradio-app/gradio …

b8ec0fa

…into theme_builder_2

abidlabs approved these changes Mar 29, 2023

View reviewed changes

changes

bb15770

space-nuko mentioned this pull request Mar 30, 2023

Can't type to search gr.Dropdown if an element is selected #3701

Closed

1 task

aliabid94 added 8 commits March 30, 2023 00:16

changes

4aa28ad

changes

b4f21b1

changes

91c1a78

changes

7da0abc

changes

cda1535

changes

5b5b0db

changes

5e44adb

changes

2c4bb3f

freddyaboulton approved these changes Mar 30, 2023

View reviewed changes

aliabid94 merged commit 09aedce into main Mar 30, 2023

aliabid94 deleted the theme_builder_2 branch March 30, 2023 18:20

deepkyu mentioned this pull request Apr 15, 2023

theme builder example doesn't work for 3.25.0 or later #3864

Closed

1 task

Conversation

aliabid94 commented Mar 28, 2023

Uh oh!

gradio-pr-bot commented Mar 28, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

gradio-pr-bot commented Mar 28, 2023

Uh oh!

Uh oh!

abidlabs Mar 29, 2023

Choose a reason for hiding this comment

Uh oh!

aliabid94 Mar 29, 2023

Choose a reason for hiding this comment

Uh oh!

Uh oh!

abidlabs commented Mar 29, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

abidlabs commented Mar 29, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

abidlabs commented Mar 29, 2023

Uh oh!

freddyaboulton commented Mar 29, 2023

Uh oh!

aliabid94 commented Mar 29, 2023

Uh oh!

abidlabs left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

freddyaboulton commented Mar 29, 2023

Uh oh!

freddyaboulton left a comment

Choose a reason for hiding this comment

Uh oh!

TaceDelacam commented Apr 22, 2023

Uh oh!

abidlabs commented Apr 23, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

gradio-pr-bot commented Mar 28, 2023 •

edited

Loading

abidlabs commented Mar 29, 2023 •

edited

Loading

abidlabs commented Mar 29, 2023 •

edited

Loading

abidlabs left a comment •

edited

Loading

abidlabs commented Apr 23, 2023 •

edited

Loading