-
Notifications
You must be signed in to change notification settings - Fork 2.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Render decorator documentation #8409
Conversation
🪼 branch checks and previews
Install Gradio from this PR pip install https://gradio-builds.s3.amazonaws.com/29546025c5be082478a9e6bc554f5b736f49b949/gradio-4.31.5-py3-none-any.whl Install Gradio Python Client from this PR pip install "gradio-client @ git+https://github.com/gradio-app/gradio@29546025c5be082478a9e6bc554f5b736f49b949#subdirectory=client/python" Install Gradio JS Client from this PR npm install https://gradio-builds.s3.amazonaws.com/29546025c5be082478a9e6bc554f5b736f49b949/gradio-client-0.19.4.tgz |
🦄 change detectedThis Pull Request includes changes to the following packages.
With the following changelog entry.
Maintainers or the PR author can modify the PR title to modify this entry.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good from website side. Will create the docs page in the editable docs PR.
2. Add the input components to the `inputs=` argument of @gr.render, and create a corresponding argument in your function for each component. This function will automatically re-run on any change to a component. | ||
3. Add all components inside the function that you want to render based on the inputs. | ||
|
||
Now whenever the inputs change, the funciton re-runs, and replaces the components created from the previous funciton run with the latest run. Pretty straightforward! Let's add a little more complexity to this app: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
typo: funciton
|
||
Let's take a look at what's happening here: | ||
|
||
1) The state variable `text_count` is keeping track of the number of Textboxes to create. By increasing it via the Add button, we trigger re-renders as `text_count` is an input to the render decorator. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This second sentence is a hard to read. Maybe something like
By clicking on the Add button, we increase `text_count` which triggers the render decorator
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
i'll fix in website pr
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice - just noticed some typos
* changes * changes * add changeset * fix dependency loop and documentation group * add changeset * changes * fix numbered list * changes * changes --------- Co-authored-by: Ali Abid <[email protected]> Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: aliabd <[email protected]>
* fix css * add changeset * Add `--table-text-color` var to fix body text in `Examples` (#8364) * add --table-text-color var * add changeset * format * tweak * add changeset * fix * add changeset --------- Co-authored-by: gradio-pr-bot <[email protected]> * Include JS Client package in CI for PR testing (#8362) * add js client pkg action * test * Revert "test" This reverts commit 575bcfc. * tweaks (#8374) * chore: update docs.py (#8378) * chore: update docs.py Documention -> Documentation * add changeset * add changeset --------- Co-authored-by: gradio-pr-bot <[email protected]> * Fix encoding error (#8381) * Set orig_name in python client file uploads (#8371) * Add code * add changeset * URL case --------- Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: Hannah <[email protected]> * Include instructions on starting from someone else's custom component repository (#8386) * Add guide * add changeset * Fix link * add changeset * Add code --------- Co-authored-by: gradio-pr-bot <[email protected]> * Fix bug in reload mode equality check. Better equality conversion for state variables (#8385) * Add code * Add deep equality * add changeset * Add code * add changeset * Update gradio/utils.py Co-authored-by: Abubakar Abid <[email protected]> * Add code * Add code * add code --------- Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: Abubakar Abid <[email protected]> * Change z-index of status tracker (#8372) * change z-index of status tracker * add changeset --------- Co-authored-by: gradio-pr-bot <[email protected]> * Add CDN installation to JS docs (#8401) * add cdn copy * add changeset * tweak * tweak * add changeset * Update guides/08_gradio-clients-and-lite/02_getting-started-with-the-js-client.md Co-authored-by: Abubakar Abid <[email protected]> * remove version from cdn link * tweak * tweak --------- Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: Abubakar Abid <[email protected]> * Improve rendering (#8398) * changes * add changeset * changes * changes * changes * changes * changes * changes * changeas * changes * add changeset * changes * add changeset * changes * changes * changes * changes * changes * changes * changes * changes * add changeset * changes * cganges * changes * changes * changes * changes * add changeset * changes * chagnes * changes * changes * changes * changes * changes * js * remove console log * changes * changes * changes * changes * changes * changes * changes * changes * changes * add changeset * changes * chnages * changes * cnages * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * add changeset * changes * changes * changes * changes * changes * changes * changes * add changeset * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * changes * add changeset * Add `state.change` listener (#8297) * state changes * changes --------- Co-authored-by: Ali Abid <[email protected]> Co-authored-by: Abubakar Abid <[email protected]> * changes * changes * add changeset * changes * changes * changes * changes * changes * changes * updates * changes * add changeset * changes * changes * add changeset * fix * changes * changes * changes * changes * changes * changes * add changeset * changes --------- Co-authored-by: Ali Abid <[email protected]> Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: Abubakar Abid <[email protected]> * Render decorator documentation (#8409) * changes * changes * add changeset * fix dependency loop and documentation group * add changeset * changes * fix numbered list * changes * changes --------- Co-authored-by: Ali Abid <[email protected]> Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: aliabd <[email protected]> * Connect heartbeat if state created in render. Also fix config cleanup bug #8407 (#8408) * Add code * add changeset * add changeset * lint --------- Co-authored-by: gradio-pr-bot <[email protected]> * Model3D right-handed coordinate system (#8376) * changes (#8411) Co-authored-by: Ali Abid <[email protected]> * Editable Docs (#8403) * docs intro page and guides * python library docs and js client * reorg * changes * add better hovering * fix broken version routing * add redirects and remove duplicate pages * fix build issues * fix issues * formatting * add changeset * working templates for all components * add other pages * merge * merge * changes * changes * working from templates * changes * refactoring * changes * build working * formatting * importing meta globs * add uploading templates to ci * fixes * add changeset * remove fake version * fix * ignore * formatting * adding render page to docs * add changeset * formatting fix * typo --------- Co-authored-by: gradio-pr-bot <[email protected]> * chore: update versions (#8348) --------- Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: Hannah <[email protected]> Co-authored-by: Ikko Eltociear Ashimine <[email protected]> Co-authored-by: Xu Song <[email protected]> Co-authored-by: Freddy Boulton <[email protected]> Co-authored-by: Abubakar Abid <[email protected]> Co-authored-by: aliabid94 <[email protected]> Co-authored-by: Ali Abid <[email protected]> Co-authored-by: aliabd <[email protected]> Co-authored-by: Dylan Ebert <[email protected]> Co-authored-by: pngwn <[email protected]>
Added documentation for
@gr.render