Icons don't show on buttons

germandb commented 5 months ago

Description

When adding an icon to a button, the icon is not rendered.

I checked your code and found that the error is caused by this pice of code

In Font Awesome 5, the “fa” prefix has been deprecated, and the new default style is “fas”, which stands for solid icons.

If I manually change the class the icon is rendered correctly

Reproduce

Create a widget button with an icon: btn = w.Button(icon ='camera')
Diplay that button: display(btn)
See a rectangular image

Expected behavior

Show the specified icon in the button

Context

ipywidgets version 8.1.1
Operating System and version: Windows 11
Browser and version: Edge

If using JupyterLab

JupyterLab version: IPython : 8.22.2 ipykernel : 6.29.2 ipywidgets : 8.1.1 jupyter_client : 8.6.0 jupyter_core : 5.7.1 jupyter_server : 2.7.3 jupyterlab : 4.1.4 nbclient : 0.8.0 nbconvert : 7.16.2 nbformat : 5.9.2 notebook : 7.1.1 qtconsole : not installed traitlets : 5.14.1
Installed Labextensions
```
jupyterlab-execute-time v3.1.2 enabled OK (python, jupyterlab_execute_time)
    jupyter-cytoscape v1.3.3 enabled OK
    @jupyter-server/resource-usage v1.0.2 enabled OK (python, jupyter-resource-usage)
    @jupyter-lsp/jupyterlab-lsp v5.1.0 enabled OK (python, jupyterlab-lsp)
    @jupyterlab/mathjax3-extension v4.3.0 enabled  X (python, jupyterlab-mathjax3)
```

/opt/conda/share/jupyter/labextensions jupyterlab_pygments v0.2.2 enabled X (python, jupyterlab_pygments) orion-custom-theme v0.1.0 enabled OK (python, orion_custom_theme) ploomber-extension v0.1.0 enabled OK (python, ploomber_extension) ipyaggrid v0.5.1 enabled OK (python, ipyaggrid) jupyterlab-plotly v5.18.0 enabled X @jupyter-notebook/lab-extension v7.1.1 enabled OK @jupyterlab-orion/orion-comm v0.1.0 enabled OK (python, jupyterlab_orion_comm) @jupyter-widgets/jupyterlab-manager v5.0.9 enabled OK (python, jupyterlab_widgets)

The following extensions are outdated: @jupyterlab/mathjax3-extension jupyterlab_pygments jupyterlab-plotly

Consider checking if an update is available for these packages.

Disabled extensions: @jupyterlab/apputils-extension:announcements @jupyterlab/completer-extension:base-service @jupyterlab/fileeditor-extension:language-server @jupyterlab/lsp-extension:settings @jupyterlab/notebook-extension:language-server

dpmendes commented 5 months ago

I have the exact same problem.

germandb commented 4 months ago

@maartenbreddels and @jasongrout Sorry for mentioning you, but I will have a release late this month that updates our env to JupyterNotebook 7, and this error is blocking us; I can make the PR if you want. The only change needed is one line of code.

jasongrout commented 4 months ago

I think this makes sense, but deferring to @maartenbreddels who is doing more of the releases these days.

Are you proposing adding both prefixes, for backwards compatibility, or changing the prefix?

maartenbreddels commented 4 months ago

@mariobuikhuizen will take a look at this

mariobuikhuizen commented 4 months ago

I can't reproduce this issue using the versions provided (except for the orion extensions, I can't find those) on Windows or MacOS.

germandb commented 4 months ago

Hi @mariobuikhuizen, you were right. The Orion extension implemented a theme that overwrites the font and makes the code fail. The change was that the font used was FontAwesome and not Font Awesome 5 Free. Thanks for looking at this; the documentation on the web of Font Awesome 5 makes me think that the fa class was no longer supported, but looking at the code, they use .fa .fas .far. so they are retrocompatible.

jupyter-widgets / ipywidgets