Improved plot rendering

[aliabid94]

Improved plot rendering. Main changes:

• Native plots did not fit block. Resizing only "stretched" canvas (distorting text as well), did not actually repaint the plot. Now native plots fit block and repaint to fit on resize.
• Plot uses theme values for styling (font, spacing, colors, etc.) so plots actually look native.
• Dev reload mode did not work with plots, fixed (by removing svelte-vega dependency).
• Cleaned up frontend code for plots.

BEFORE:

AFTER:

[gradio-pr-bot]

🪼 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/271c4e87938f35a1ec686bb51dde812e5106cd57/gradio-4.36.1-py3-none-any.whl

Install Gradio Python Client from this PR

pip install "gradio-client @ git+https://github.com/gradio-app/gradio@271c4e87938f35a1ec686bb51dde812e5106cd57#subdirectory=client/python"

Install Gradio JS Client from this PR

npm install https://gradio-builds.s3.amazonaws.com/271c4e87938f35a1ec686bb51dde812e5106cd57/gradio-client-1.1.1.tgz

[gradio-pr-bot]

🦄 change detected

This Pull Request includes changes to the following packages.

Package	Version
@gradio/plot	patch
gradio	patch

With the following changelog entry.

Improved plot rendering to thematically match
highlight:Expect visual changes in gr.Plot, gr.BarPlot, gr.LinePlot, gr.ScatterPlot, including changes to color and width sizing.

⚠️ The changeset file for this pull request has been modified manually, so the changeset generation bot has been disabled. To go back into automatic mode, delete the changeset file.

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.

[abidlabs]

Great work @aliabid94! Does this close any of these issues:

• gr.Plot is rendered smaller in a hidden gr.Tab #6850
• LinePlot text color #5180
• Add preset color schemes for gradio plots #2780

[abidlabs]

Backend changes look good. Tagged @pngwn to review the frontend changes when he's back. Agreed UI looks much nicer this way. This is a visual breaking change, so we should make sure

• to mention this in the release notes (we can add a highlight to this changelog)
• We should ensure that that users can get the previous behavior (a fixed width) if they want. The obvious way would be to use the width parameter, but that parameter seems to have no effect. Note that the height parameter is indeed working for me.

Side note, but I'm getting a bunch of deprecation warnings when running native_plots demo:

/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/utils/deprecation.py:65: AltairDeprecationWarning: 'selection' is deprecated.
   Use 'selection_point()' or 'selection_interval()' instead; these functions also include more helpful docstrings.
  warnings.warn(message, AltairDeprecationWarning, stacklevel=1)
/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/vegalite/v5/api.py:469: AltairDeprecationWarning: The types 'single' and 'multi' are now
        combined and should be specified using "selection_point()".
  warnings.warn(
/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/utils/deprecation.py:65: AltairDeprecationWarning: 'add_selection' is deprecated. Use 'add_params' instead.
  warnings.warn(message, AltairDeprecationWarning, stacklevel=1)

[pngwn]

Frontend looks good to me apart from my one comment