How to upgrade widget-ts-cookiecutter for jupyterlab 4?

JupyterLab
1

Hello,
I am trying to follow the tutorial “Building a Custom Widget - Email widget”, which uses
GitHub - jupyter-widgets/widget-ts-cookiecutter: A highly opinionated cookiecutter template for ipywidget extensions. or GitHub - jupyter-widgets/widget-cookiecutter: A cookiecutter template for creating a custom Jupyter widget project..
Can somebody explain what is required to upgrade those cookiecutters for use with jupyterlab 4? There are no replies on the issues of the repos.
Or any other suggestion, how to get started with a project based on ipywidgets?

Thank you very much
Sahid

2
  1. an devlopment env for jupyterlab
git clone https://github.com/<your-github-username>/jupyterlab.git
cd jupyterlab
pip install -e ".[dev,test]"
jlpm install
jlpm run build  # Build the dev mode assets (optional)
  1. install your cookiecutter extension (not sure)
git glone xxxx cookiecutter
pip install -e .
jlpm run build (build the frondend proj)
  1. run command
 jupyter lab --dev-mode --extensions-in-dev-mode
  1. build stage (get a wheel for release)
cd your cookiecutter proj
python -m build

hope this can help you

3

Thank you, but I think I didn’t explain my question clearly enough.
I am not asking about how to upgrade the cookiecutter tool.
I am asking about how to upgrade a specific cookiecutter template, which is the widget-ts-cookiecutter. This template defines dependencies on jupyterlab 3, but I would like to use it with jupyterlab 4.

4

sorry i do not much about widget-ts-cookiecutter, need community contributors to assist~~

5

Hi @Sahid! I had the same problem recently and updated the widget-ts-cookiecutter to the latest versions of both JupyterLab 3.x and 4.x. I just opened the corresponding PRs, so you can take a look:

I bumped npm dependencies and added some additional configuration to pyproject.toml and .yarnrc.yml so that the extension successfully builds.

You can try these yourself:

cookiecutter https://github.com/PolusAI/widget-ts-cookiecutter.git -c 3.6.7
cookiecutter https://github.com/PolusAI/widget-ts-cookiecutter.git -c 4.0.11

================================================

If these work for you, could you please provide your review on GitHub so we can make these changes available for everyone?

  1. On PR page, click Files Changed
    image
  2. Then, click Review Changes
    image
  3. Leave some comment about the changes and choose either Approve, Request Changes or Comment
    image
    image1290×968 57.7 KB

(I apologize if this is obvious, I decided to include it just in case you are not familiar)

6

I can recommend the new free and Open Source tool anywidget to build ipywidgets: Getting Started | anywidget it uses ipywidget as well, but abstracts away all the clutter.

2 Likes
7

I created a new ipywidgets template based on the jupyterlab copier template (GitHub - trungleduc/ipywidgets-template: A `copier` template for JupyterLab extensions). There is an ongoing discussion to move this project into the jupyter-widgets organization at Create a copier template for custom widget development · Issue #22 · jupyter-widgets/team-compass · GitHub