Skip to content
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

Merged
merged 12 commits into from
May 29, 2024
Merged

Render decorator documentation #8409

merged 12 commits into from
May 29, 2024

Conversation

aliabid94
Copy link
Collaborator

Added documentation for @gr.render

@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented May 29, 2024

🪼 branch checks and previews

Name Status URL
Spaces ready! Spaces preview
Website ready! Website preview
Storybook ready! Storybook preview
🦄 Changes detected! Details

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

@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented May 29, 2024

🦄 change detected

This Pull Request includes changes to the following packages.

Package Version
@gradio/statustracker minor
gradio minor
gradio_client minor
  • Maintainers can select this checkbox to manually select packages to update.

With the following changelog entry.

Render decorator documentation

Maintainers or the PR author can modify the PR title to modify this entry.

Something isn't right?

  • Maintainers can change the version label to modify the version bump.
  • If the bot has failed to detect any changes, or if this pull request needs to update multiple packages to different versions or requires a more comprehensive changelog entry, maintainers can update the changelog file directly.

Copy link
Collaborator

@aliabd aliabd left a 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.

@aliabid94 aliabid94 merged commit 8028c33 into main May 29, 2024
8 checks passed
@aliabid94 aliabid94 deleted the render_dics branch May 29, 2024 21:13
@pngwn pngwn mentioned this pull request May 29, 2024
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:
Copy link
Collaborator

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.
Copy link
Collaborator

@freddyaboulton freddyaboulton May 29, 2024

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

Copy link
Collaborator

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

Copy link
Collaborator

@freddyaboulton freddyaboulton left a 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

dawoodkhan82 pushed a commit that referenced this pull request May 29, 2024
* 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]>
dawoodkhan82 added a commit that referenced this pull request Jun 3, 2024
* 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]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants