@jupyterlab/vdom-extension
TypeScript icon, indicating that this package has built-in type declarations

3.6.7 • Public • Published

vdom-extension

A JupyterLab extension for rendering VirtualDOM using React

demo

This extension is in the official JupyterLab distribution.

Usage

To render VDOM output in IPython:

from IPython.display import display

def VDOM(data={}):
    bundle = {}
    bundle['application/vdom.v1+json'] = data
    display(bundle, raw=True)

VDOM({
    'tagName': 'div',
    'attributes': {},
    'children': [{
        'tagName': 'h1',
        'attributes': {},
        'children': 'Our Incredibly Declarative Example',
        'key': 0
    }, {
        'tagName': 'p',
        'attributes': {},
        'children': ['Can you believe we wrote this ', {
            'tagName': 'b',
            'attributes': {},
            'children': 'in Python',
            'key': 1
        }, '?'],
        'key': 1
    }, {
        'tagName': 'img',
        'attributes': {
            'src': 'https://media.giphy.com/media/xUPGcguWZHRC2HyBRS/giphy.gif'
        },
        'key': 2
    }, {
        'tagName': 'p',
        'attributes': {},
        'children': ['What will ', {
            'tagName': 'b',
            'attributes': {},
            'children': 'you',
            'key': 1
        }, ' create next?'],
        'key': 3
    }]
})

Using the vdom Python library:

from vdom import h1, p, img, div, b

div(
    h1('Our Incredibly Declarative Example'),
    p('Can you believe we wrote this ', b('in Python'), '?'),
    img(src="https://media.giphy.com/media/xUPGcguWZHRC2HyBRS/giphy.gif"),
    p('What will ', b('you'), ' create next?'),
)

To render a .vdom or .vdom.json file, simply open it:

Development

See the JupyterLab Contributor Documentation.

Readme

Keywords

none

Package Sidebar

Install

npm i @jupyterlab/vdom-extension

Weekly Downloads

6,291

Version

3.6.7

License

BSD-3-Clause

Unpacked Size

10.6 kB

Total Files

7

Last publish

Collaborators

  • hbcarlos
  • jupyter-server-release-bot
  • jupyterlab-release-bot
  • jweill-aws
  • krassowski
  • darian
  • blink1073
  • jasongrout
  • sylvaincorlay
  • ian-r-rose
  • minrk
  • hoo761
  • zsailer
  • telamonian
  • fcollonval
  • jtpio
  • echarles
  • goanpeca
  • mbektas
  • loichuder