DEV Community

fadingNA
fadingNA

Posted on • Edited on

Document API Update on Graddio

Overview

  • Hey everyone! This last week, I had the chance to dive into the world of gradio and contribute to improving its documentation. It was a fun experience, so I thought I'd share what I learned and how it all went down.

    GitHub logo gradio-app / gradio

    Build and share delightful machine learning apps, all in Python. 🌟 Star to support our work!

    English | δΈ­ζ–‡

    Gradio: Build Machine Learning Web Apps β€” in Python

    Gradio is an open-source Python package that allows you to quickly build a demo or web application for your machine learning model, API, or any arbitrary Python function. You can then share a link to your demo or web application in just a few seconds using Gradio's built-in sharing features. No JavaScript, CSS, or web hosting experience needed!

    It just takes a few lines of Python to create your own demo, so let's get started πŸ’«

    Installation

    Prerequisite: Gradio 5 requires Python 3.10 or higher

    We recommend installing Gradio using pip, which is included by default in Python. Run this in your terminal or command prompt:

    pip install --upgrade gradio
    Enter fullscreen mode Exit fullscreen mode

    Tip

    It is best to install Gradio in a virtual environment. Detailed installation instructions for all…

Issue

Buttons of type 'huggingface' appear Black #9787

Describe the bug

When not in darkmode, 'huggingface buttons appear black with white text. When in darkmode they appear white. This is in contrary to the documentation. And in contrary to how they worked in gradio 5.1.0.

Have you searched existing issues? πŸ”Ž

  • [X] I have searched and found no existing issues

Reproduction

import numpy as np
import gradio as gr

with gr.Blocks() as demo:
    text_button = gr.Button("I Am a Button", variant='huggingface')


if __name__ == "__main__":
    demo.launch()
Enter fullscreen mode Exit fullscreen mode

Screenshot

image

Logs

No response

System Info

gradio 5.3.0
Enter fullscreen mode Exit fullscreen mode

Severity

I can work around it

  • It all started when a new issue popped up in the Gradio repository someone noticed that the 'huggingface' variant of the button component was showing up with a black background and white text when not in dark mode. This was different from how the documentation described it and even how it looked in Gradio 5.1.0. You can see the original issue

Pull Request

update docstring for the the "variant" parameter in `gr.Button` #9806

Description

Align parameter document of button api reference

🎯 PRs Should Target Issues

Closes: #9787

Tests

All tests pass.

  • I submitted a pull request (PR) that aimed to update the API documentation to reflect the correct behavior of the 'huggingface' variant in the button component. Unlike some of my previous contributions, this PR was focused solely on documentation adjustments, helping align user expectations with the UI's actual behavior. This experience gave me a deeper understanding of how even seemingly minor documentation updates can be valuable in open source, as they clarify functionality for all users.

  • An interesting takeaway from this PR was observing how the maintainers efficiently utilized it to improve the API documentation without opening a new PR for each small update. This approach helped avoid clutter in the repository and minimized PR overlap, especially for minor but essential updates.

What I learned

  • Communication is Key - The conversation between the contributor and the maintainers was open and clear, which made it easy to understand what needed to be fixed. It’s a reminder of how valuable it is to reach out and ask questions.

Overview

  • From this last pull request I have done, taught me something about the best practice to do CI pipeline approval, even document api change we have to use maintainer approved it, so the repository become more secure. Overall, this contribution has deepened my understanding of documentation's role in open-source projects and reinforced the importance of clear communication and robust CI processes.

Top comments (0)