# yjs-widgets

> A JupyterLab extension for widgets based on Yjs.

Latest version **0.6.0** (published 2026-07-15) · BSD-3-Clause license · 0 weekly downloads

## Install

```sh
npm install yjs-widgets
pnpm add yjs-widgets
yarn add yjs-widgets
bun add yjs-widgets
```

## Health

**Score 55/100 (C)** — status: active.

Positive: has types; no vulnerabilities; has provenance.

Warnings: low downloads; no esm support; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.6.0 |
| Published | 2026-07-15 |
| First published | 2023-05-03 |
| Weekly downloads | 0 |
| License | BSD-3-Clause |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 15 |
| Unpacked size | 34.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 10 |
| Author | Trung Le |
| Maintainers | davidbrochart, quantstack-bot |
| Keywords | jupyter, jupyterlab, jupyterlab-extension, yjs |

## Links

- npm: https://www.npmjs.com/package/yjs-widgets
- Repository: https://github.com/QuantStack/yjs-widgets
- Issues: https://github.com/QuantStack/yjs-widgets/issues
- npm.io page: https://npm.io/package/yjs-widgets

## Dependencies (15)

- [lib0](https://npm.io/package/lib0.md) ^0.2.76
- [uuid](https://npm.io/package/uuid.md) ^9.0.0
- [webpack](https://npm.io/package/webpack.md) ^5.77.0
- [webpack-cli](https://npm.io/package/webpack-cli.md) ^5.0.1
- [y-protocols](https://npm.io/package/y-protocols.md) ^1.0.6
- [@jupyter/ydoc](https://npm.io/package/@jupyter/ydoc.md) ^2.0.0 || ^3.0.0 || ^4.0.0
- [@lumino/widgets](https://npm.io/package/@lumino/widgets.md) ^2.1.1
- [@lumino/coreutils](https://npm.io/package/@lumino/coreutils.md) ^2.1.1
- [@lumino/signaling](https://npm.io/package/@lumino/signaling.md) ^2.1.1
- [@jupyterlab/console](https://npm.io/package/@jupyterlab/console.md) ^4.6
- [@jupyterlab/apputils](https://npm.io/package/@jupyterlab/apputils.md) ^4.6
- [@jupyterlab/notebook](https://npm.io/package/@jupyterlab/notebook.md) ^4.6
- [@jupyterlab/services](https://npm.io/package/@jupyterlab/services.md) ^7.0.0
- [@jupyterlab/coreutils](https://npm.io/package/@jupyterlab/coreutils.md) ^6.6
- [@jupyterlab/application](https://npm.io/package/@jupyterlab/application.md) ^4.6

## Recent versions

- 0.6.0 (latest) — 2026-07-15
- 0.5.2 — 2026-06-19
- 0.5.1 — 2026-05-13
- 0.5.0 — 2026-04-07
- 0.4.0 — 2025-02-07
- 0.3.9 — 2025-02-06
- 0.3.8 — 2024-10-22
- 0.3.7 — 2024-10-17
- 0.3.6 — 2024-09-10
- 0.3.5 — 2024-07-30
- 0.3.4 — 2023-06-08
- 0.3.3 — 2023-05-29
- 0.3.2 — 2023-05-29
- 0.3.1 — 2023-05-25
- 0.3.0 — 2023-05-25
- … 1 more at https://npm.io/package/yjs-widgets/versions

## README

# JupyterLab extension for widgets based on Yjs

## Requirements

- JupyterLab == 4.0.0b0

## Installation

You can install yjs-widgets using pip:

```bash
pip install yjs-widgets
```

## Usage

```typescript
import { IJupyterYModel } from './types';
import { JupyterYModel } from './model';
import { IJupyterYWidgetManager } from './notebookrenderer/types';
import {
  JupyterFrontEnd,
  JupyterFrontEndPlugin
} from '@jupyterlab/application';

class MyWidget {
  constructor(yModel: IJupyterYModel, node: HTMLElement) {
    this.yModel = yModel;
    this.node = node;
    yModel.sharedModel.attrsChanged.connect(() => {
      this._attrsChanged();
    });
    node.textContent = 'Hello world!';
  }

  _attrsChanged(): void {
    const foo: string = this.yModel.sharedModel.getAttr('foo') as string;
    const bar: string = this.yModel.sharedModel.getAttr('bar') as string;
    this.node.textContent = `foo=${foo}, bar=${bar}`;
  }

  yModel: IJupyterYModel;
  node: HTMLElement;
}

export const foo: JupyterFrontEndPlugin<void> = {
  id: 'foo:bar',
  autoStart: true,
  requires: [IJupyterYWidgetManager],
  activate: (app: JupyterFrontEnd, wm: IJupyterYWidgetManager): void => {
    wm.registerWidget('MyWidget', JupyterYModel, MyWidget);
  }
};
```

## Contributing

yjs-widgets is an open-source project, and contributions are always welcome. If you would like to contribute, please fork the repository and submit a pull request.

See [CONTRIBUTING](CONTRIBUTING.md) for dev installation instructions.

## License

yjs-widgets is licensed under the BSD 3-Clause License. See the LICENSE file for more information.

---
_Source: https://npm.io/package/yjs-widgets · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._