@pyscript/core 0.2.6 → 0.2.8

package/dist/{error-e4fe78fd.js → error-q53fTtv2.js}

@@ -1,2 +1,2 @@
 import{hooks as e}from"./core.js";function r(e){const r=document.createElement("div");r.className="py-error",r.textContent=e,r.style.cssText="\n    border: 1px solid red;\n    background: #ffdddd;\n    color: black;\n    font-family: courier, monospace;\n    white-space: pre;\n    overflow-x: auto;\n    padding: 8px;\n    margin-top: 8px;\n  ",document.body.append(r)}e.onInterpreterReady.add((function n(t){e.onInterpreterReady.delete(n);const{stderr:o}=t.io;t.io.stderr=(e,...n)=>(r(e.message||e),o(e,...n)),addEventListener("error",(({message:e})=>{e.startsWith("Uncaught PythonError")&&r(e)}))}));export{r as notify};
-//# sourceMappingURL=error-e4fe78fd.js.map
+//# sourceMappingURL=error-q53fTtv2.js.map

package/dist/{error-e4fe78fd.js.map → error-q53fTtv2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"error-e4fe78fd.js","sources":["../src/plugins/error.js"],"sourcesContent":["// PyScript Error Plugin\nimport { hooks } from \"../core.js\";\n\nhooks.onInterpreterReady.add(function override(pyScript) {\n    // be sure this override happens only once\n    hooks.onInterpreterReady.delete(override);\n\n    // trap generic `stderr` to propagate to it regardless\n    const { stderr } = pyScript.io;\n\n    // override it with our own logic\n    pyScript.io.stderr = (error, ...rest) => {\n        notify(error.message || error);\n        // let other plugins or stderr hook, if any, do the rest\n        return stderr(error, ...rest);\n    };\n\n    // be sure uncaught Python errors are also visible\n    addEventListener(\"error\", ({ message }) => {\n        if (message.startsWith(\"Uncaught PythonError\")) notify(message);\n    });\n});\n\n// Error hook utilities\n\n// Custom function to show notifications\n\n/**\n * Add a banner to the top of the page, notifying the user of an error\n * @param {string} message\n */\nexport function notify(message) {\n    const div = document.createElement(\"div\");\n    div.className = \"py-error\";\n    div.textContent = message;\n    div.style.cssText = `\n    border: 1px solid red;\n    background: #ffdddd;\n    color: black;\n    font-family: courier, monospace;\n    white-space: pre;\n    overflow-x: auto;\n    padding: 8px;\n    margin-top: 8px;\n  `;\n    document.body.append(div);\n}\n"],"names":["notify","message","div","document","createElement","className","textContent","style","cssText","body","append","hooks","onInterpreterReady","add","override","pyScript","delete","stderr","io","error","rest","addEventListener","startsWith"],"mappings":"kCA+BO,SAASA,EAAOC,GACnB,MAAMC,EAAMC,SAASC,cAAc,OACnCF,EAAIG,UAAY,WAChBH,EAAII,YAAcL,EAClBC,EAAIK,MAAMC,QAAU,6MAUpBL,SAASM,KAAKC,OAAOR,EACzB,CA3CAS,EAAMC,mBAAmBC,KAAI,SAASC,EAASC,GAE3CJ,EAAMC,mBAAmBI,OAAOF,GAGhC,MAAMG,OAAEA,GAAWF,EAASG,GAG5BH,EAASG,GAAGD,OAAS,CAACE,KAAUC,KAC5BpB,EAAOmB,EAAMlB,SAAWkB,GAEjBF,EAAOE,KAAUC,IAI5BC,iBAAiB,SAAS,EAAGpB,cACrBA,EAAQqB,WAAW,yBAAyBtB,EAAOC,EAAQ,GAEvE"}
+{"version":3,"file":"error-q53fTtv2.js","sources":["../src/plugins/error.js"],"sourcesContent":["// PyScript Error Plugin\nimport { hooks } from \"../core.js\";\n\nhooks.onInterpreterReady.add(function override(pyScript) {\n    // be sure this override happens only once\n    hooks.onInterpreterReady.delete(override);\n\n    // trap generic `stderr` to propagate to it regardless\n    const { stderr } = pyScript.io;\n\n    // override it with our own logic\n    pyScript.io.stderr = (error, ...rest) => {\n        notify(error.message || error);\n        // let other plugins or stderr hook, if any, do the rest\n        return stderr(error, ...rest);\n    };\n\n    // be sure uncaught Python errors are also visible\n    addEventListener(\"error\", ({ message }) => {\n        if (message.startsWith(\"Uncaught PythonError\")) notify(message);\n    });\n});\n\n// Error hook utilities\n\n// Custom function to show notifications\n\n/**\n * Add a banner to the top of the page, notifying the user of an error\n * @param {string} message\n */\nexport function notify(message) {\n    const div = document.createElement(\"div\");\n    div.className = \"py-error\";\n    div.textContent = message;\n    div.style.cssText = `\n    border: 1px solid red;\n    background: #ffdddd;\n    color: black;\n    font-family: courier, monospace;\n    white-space: pre;\n    overflow-x: auto;\n    padding: 8px;\n    margin-top: 8px;\n  `;\n    document.body.append(div);\n}\n"],"names":["notify","message","div","document","createElement","className","textContent","style","cssText","body","append","hooks","onInterpreterReady","add","override","pyScript","delete","stderr","io","error","rest","addEventListener","startsWith"],"mappings":"kCA+BO,SAASA,EAAOC,GACnB,MAAMC,EAAMC,SAASC,cAAc,OACnCF,EAAIG,UAAY,WAChBH,EAAII,YAAcL,EAClBC,EAAIK,MAAMC,QAAU,6MAUpBL,SAASM,KAAKC,OAAOR,EACzB,CA3CAS,EAAMC,mBAAmBC,KAAI,SAASC,EAASC,GAE3CJ,EAAMC,mBAAmBI,OAAOF,GAGhC,MAAMG,OAAEA,GAAWF,EAASG,GAG5BH,EAASG,GAAGD,OAAS,CAACE,KAAUC,KAC5BpB,EAAOmB,EAAMlB,SAAWkB,GAEjBF,EAAOE,KAAUC,IAI5BC,iBAAiB,SAAS,EAAGpB,cACrBA,EAAQqB,WAAW,yBAAyBtB,EAAOC,EAAQ,GAEvE"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pyscript/core",
-    "version": "0.2.6",
+    "version": "0.2.8",
     "type": "module",
     "description": "PyScript",
     "module": "./index.js",
@@ -19,7 +19,7 @@
         "./package.json": "./package.json"
     },
     "scripts": {
-        "server": "npx static-handler --cors --coep --coop --corp .",
+        "server": "npx static-handler --coi .",
         "build": "node rollup/stdlib.cjs && node rollup/plugins.cjs && rm -rf dist && rollup --config rollup/core.config.js && eslint src/ && npm run ts",
         "size": "echo -e \"\\033[1mdist/*.js file size\\033[0m\"; for js in $(ls dist/*.js); do echo -e \"\\033[2m$js:\\033[0m $(cat $js | brotli | wc -c) bytes\"; done",
         "ts": "tsc -p ."
@@ -33,17 +33,17 @@
     "dependencies": {
         "@ungap/with-resolvers": "^0.1.0",
         "basic-devtools": "^0.1.6",
-        "polyscript": "^0.4.11",
+        "polyscript": "^0.4.13",
         "type-checked-collections": "^0.1.7"
     },
     "devDependencies": {
-        "@rollup/plugin-node-resolve": "^15.2.1",
-        "@rollup/plugin-terser": "^0.4.3",
-        "eslint": "^8.50.0",
-        "rollup": "^3.29.4",
+        "@rollup/plugin-node-resolve": "^15.2.3",
+        "@rollup/plugin-terser": "^0.4.4",
+        "eslint": "^8.51.0",
+        "rollup": "^4.0.2",
         "rollup-plugin-postcss": "^4.0.2",
         "rollup-plugin-string": "^3.0.0",
-        "static-handler": "^0.4.2",
+        "static-handler": "^0.4.3",
         "typescript": "^5.2.2"
     },
     "repository": {

package/src/config.js

@@ -50,7 +50,7 @@ const syntaxError = (type, url, { message }) => {
 const configs = new Map();
 
 for (const [TYPE] of TYPES) {
-    /** @type {Promise<any> | undefined} A Promise wrapping any plugins which should be loaded. */
+    /** @type {Promise<[...any]>} A Promise wrapping any plugins which should be loaded. */
     let plugins;
 
     /** @type {any} The PyScript configuration parsed from the JSON or TOML object*. May be any of the return types of JSON.parse() or toml-j0.4's parse() ( {number | string | boolean | null | object | Array} ) */
@@ -119,7 +119,7 @@ for (const [TYPE] of TYPES) {
     }
 
     // assign plugins as Promise.all only if needed
-    if (toBeAwaited.length) plugins = Promise.all(toBeAwaited);
+    plugins = Promise.all(toBeAwaited);
 
     configs.set(TYPE, { config: parsed, plugins, error });
 }

package/src/core.js

@@ -128,162 +128,162 @@ for (const [TYPE, interpreter] of TYPES) {
     // define the module as both `<script type="py">` and `<py-script>`
     // but only if the config didn't throw an error
     if (!error) {
-        // possible early errors sent by polyscript
-        const errors = new Map();
-
-        define(TYPE, {
-            config,
-            interpreter,
-            env: `${TYPE}-script`,
-            version: config?.interpreter,
-            onerror(error, element) {
-                errors.set(element, error);
-            },
-            ...workerHooks,
-            onWorkerReady(_, xworker) {
-                assign(xworker.sync, sync);
-                for (const callback of hooks.onWorkerReady)
-                    callback(_, xworker);
-            },
-            onBeforeRun(wrap, element) {
-                currentElement = element;
-                bootstrapNodeAndPlugins(wrap, element, before, "onBeforeRun");
-            },
-            onBeforeRunAsync(wrap, element) {
-                currentElement = element;
-                bootstrapNodeAndPlugins(
-                    wrap,
-                    element,
-                    before,
-                    "onBeforeRunAsync",
-                );
-            },
-            onAfterRun(wrap, element) {
-                bootstrapNodeAndPlugins(wrap, element, after, "onAfterRun");
-            },
-            onAfterRunAsync(wrap, element) {
-                bootstrapNodeAndPlugins(
-                    wrap,
-                    element,
-                    after,
-                    "onAfterRunAsync",
-                );
-            },
-            async onInterpreterReady(wrap, element) {
-                if (shouldRegister) {
-                    shouldRegister = false;
-                    registerModule(wrap);
-                }
-
-                // ensure plugins are bootstrapped already
-                if (plugins) await plugins;
-
-                // allows plugins to do whatever they want with the element
-                // before regular stuff happens in here
-                for (const callback of hooks.onInterpreterReady)
-                    callback(wrap, element);
-
-                // now that all possible plugins are configured,
-                // bail out if polyscript encountered an error
-                if (errors.has(element)) {
-                    let { message } = errors.get(element);
-                    errors.delete(element);
-                    const clone = message === INVALID_CONTENT;
-                    message = `(${ErrorCode.CONFLICTING_CODE}) ${message} for `;
-                    message += element.cloneNode(clone).outerHTML;
-                    wrap.io.stderr(message);
-                    return;
-                }
-
-                if (isScript(element)) {
-                    const {
-                        attributes: { async: isAsync, target },
-                    } = element;
-                    const hasTarget = !!target?.value;
-                    const show = hasTarget
-                        ? queryTarget(element, target.value)
-                        : document.createElement("script-py");
+        // ensure plugins are bootstrapped already before custom type definition
+        // NOTE: we cannot top-level await in here as plugins import other utilities
+        //       from core.js itself so that custom definition should not be blocking.
+        plugins.then(() => {
+            // possible early errors sent by polyscript
+            const errors = new Map();
+
+            define(TYPE, {
+                config,
+                interpreter,
+                env: `${TYPE}-script`,
+                version: config?.interpreter,
+                onerror(error, element) {
+                    errors.set(element, error);
+                },
+                ...workerHooks,
+                onWorkerReady(_, xworker) {
+                    assign(xworker.sync, sync);
+                    for (const callback of hooks.onWorkerReady)
+                        callback(_, xworker);
+                },
+                onBeforeRun(wrap, element) {
+                    currentElement = element;
+                    bootstrapNodeAndPlugins(
+                        wrap,
+                        element,
+                        before,
+                        "onBeforeRun",
+                    );
+                },
+                onBeforeRunAsync(wrap, element) {
+                    currentElement = element;
+                    bootstrapNodeAndPlugins(
+                        wrap,
+                        element,
+                        before,
+                        "onBeforeRunAsync",
+                    );
+                },
+                onAfterRun(wrap, element) {
+                    bootstrapNodeAndPlugins(wrap, element, after, "onAfterRun");
+                },
+                onAfterRunAsync(wrap, element) {
+                    bootstrapNodeAndPlugins(
+                        wrap,
+                        element,
+                        after,
+                        "onAfterRunAsync",
+                    );
+                },
+                async onInterpreterReady(wrap, element) {
+                    if (shouldRegister) {
+                        shouldRegister = false;
+                        registerModule(wrap);
+                    }
 
-                    if (!hasTarget) {
-                        const { head, body } = document;
-                        if (head.contains(element)) body.append(show);
-                        else element.after(show);
+                    // allows plugins to do whatever they want with the element
+                    // before regular stuff happens in here
+                    for (const callback of hooks.onInterpreterReady)
+                        callback(wrap, element);
+
+                    // now that all possible plugins are configured,
+                    // bail out if polyscript encountered an error
+                    if (errors.has(element)) {
+                        let { message } = errors.get(element);
+                        errors.delete(element);
+                        const clone = message === INVALID_CONTENT;
+                        message = `(${ErrorCode.CONFLICTING_CODE}) ${message} for `;
+                        message += element.cloneNode(clone).outerHTML;
+                        wrap.io.stderr(message);
+                        return;
                     }
-                    if (!show.id) show.id = getID();
 
-                    // allows the code to retrieve the target element via
-                    // document.currentScript.target if needed
-                    defineProperty(element, "target", { value: show });
+                    if (isScript(element)) {
+                        const {
+                            attributes: { async: isAsync, target },
+                        } = element;
+                        const hasTarget = !!target?.value;
+                        const show = hasTarget
+                            ? queryTarget(element, target.value)
+                            : document.createElement("script-py");
+
+                        if (!hasTarget) {
+                            const { head, body } = document;
+                            if (head.contains(element)) body.append(show);
+                            else element.after(show);
+                        }
+                        if (!show.id) show.id = getID();
+
+                        // allows the code to retrieve the target element via
+                        // document.currentScript.target if needed
+                        defineProperty(element, "target", { value: show });
+
+                        // notify before the code runs
+                        dispatch(element, TYPE, "ready");
+                        dispatchDone(
+                            element,
+                            isAsync,
+                            wrap[`run${isAsync ? "Async" : ""}`](
+                                await fetchSource(element, wrap.io, true),
+                            ),
+                        );
+                    } else {
+                        // resolve PyScriptElement to allow connectedCallback
+                        element._wrap.resolve(wrap);
+                    }
+                    console.debug("[pyscript/main] PyScript Ready");
+                },
+            });
 
-                    // notify before the code runs
-                    dispatch(element, TYPE, "ready");
-                    dispatchDone(
-                        element,
-                        isAsync,
-                        wrap[`run${isAsync ? "Async" : ""}`](
-                            await fetchSource(element, wrap.io, true),
-                        ),
-                    );
-                } else {
-                    // resolve PyScriptElement to allow connectedCallback
-                    element._wrap.resolve(wrap);
-                }
-                console.debug("[pyscript/main] PyScript Ready");
-            },
+            customElements.define(
+                `${TYPE}-script`,
+                class extends HTMLElement {
+                    constructor() {
+                        assign(super(), {
+                            _wrap: Promise.withResolvers(),
+                            srcCode: "",
+                            executed: false,
+                        });
+                    }
+                    get id() {
+                        return super.id || (super.id = getID());
+                    }
+                    set id(value) {
+                        super.id = value;
+                    }
+                    async connectedCallback() {
+                        if (!this.executed) {
+                            this.executed = true;
+                            const isAsync = this.hasAttribute("async");
+                            const { io, run, runAsync } = await this._wrap
+                                .promise;
+                            this.srcCode = await fetchSource(
+                                this,
+                                io,
+                                !this.childElementCount,
+                            );
+                            this.replaceChildren();
+                            this.style.display = "block";
+                            dispatch(this, TYPE, "ready");
+                            dispatchDone(
+                                this,
+                                isAsync,
+                                (isAsync ? runAsync : run)(this.srcCode),
+                            );
+                        }
+                    }
+                },
+            );
         });
     }
 
-    class PyScriptElement extends HTMLElement {
-        constructor() {
-            assign(super(), {
-                _wrap: Promise.withResolvers(),
-                srcCode: "",
-                executed: false,
-            });
-        }
-        get _pyodide() {
-            // TODO: deprecate this hidden attribute already
-            //       currently used by integration tests
-            return this._wrap;
-        }
-        get id() {
-            return super.id || (super.id = getID());
-        }
-        set id(value) {
-            super.id = value;
-        }
-        async connectedCallback() {
-            if (!this.executed) {
-                this.executed = true;
-                const isAsync = this.hasAttribute("async");
-                const { io, run, runAsync } = await this._wrap.promise;
-                this.srcCode = await fetchSource(
-                    this,
-                    io,
-                    !this.childElementCount,
-                );
-                this.replaceChildren();
-                this.style.display = "block";
-                dispatch(this, TYPE, "ready");
-                dispatchDone(
-                    this,
-                    isAsync,
-                    (isAsync ? runAsync : run)(this.srcCode),
-                );
-            }
-        }
-    }
-
-    // define py-script only if the config didn't throw an error
-    if (!error) customElements.define(`${TYPE}-script`, PyScriptElement);
-
     // export the used config without allowing leaks through it
     exportedConfig[TYPE] = structuredClone(config);
 }
 
-// TBD: I think manual worker cases are interesting in pyodide only
-//      so for the time being we should be fine with this export.
-
 /**
  * A `Worker` facade able to bootstrap on the worker thread only a PyScript module.
  * @param {string} file the python file to run ina worker.
@@ -297,8 +297,8 @@ export function PyWorker(file, options) {
     // and as `pyodide` is the only default interpreter that can deal with
     // all the features we need to deliver pyscript out there.
     const xworker = XWorker.call(new Hook(null, workerHooks), file, {
-        ...options,
         type: "pyodide",
+        ...options,
     });
     assign(xworker.sync, sync);
     return xworker;

package/src/stdlib/pyscript/__init__.py

@@ -29,8 +29,15 @@
 #     pyscript.magic_js. This is the blessed way to access them from pyscript,
 #     as it works transparently in both the main thread and worker cases.
 
-from pyscript.magic_js import RUNNING_IN_WORKER, window, document, sync
 from pyscript.display import HTML, display
+from pyscript.magic_js import (
+    RUNNING_IN_WORKER,
+    PyWorker,
+    current_target,
+    document,
+    sync,
+    window,
+)
 
 try:
     from pyscript.event_handling import when
@@ -38,6 +45,5 @@ except:
     from pyscript.util import NotSupported
 
     when = NotSupported(
-        "pyscript.when",
-        "pyscript.when currently not available with this interpreter"
+        "pyscript.when", "pyscript.when currently not available with this interpreter"
     )

package/src/stdlib/pyscript/display.py

@@ -148,9 +148,23 @@ def _write(element, value, append=False):
 def display(*values, target=None, append=True):
     if target is None:
         target = current_target()
+    elif not isinstance(target, str):
+        raise TypeError(f"target must be str or None, not {target.__class__.__name__}")
+    elif target == "":
+        raise ValueError("Cannot have an empty target")
+    elif target.startswith("#"):
+        # note: here target is str and not None!
+        # align with @when behavior
+        target = target[1:]
 
     element = document.getElementById(target)
 
+    # If target cannot be found on the page, a ValueError is raised
+    if element is None:
+        raise ValueError(
+            f"Invalid selector with id={target}. Cannot be found in the page."
+        )
+
     # if element is a <script type="py">, it has a 'target' attribute which
     # points to the visual element holding the displayed values. In that case,
     # use that.

package/src/stdlib/pyscript/magic_js.py

@@ -1,5 +1,5 @@
-from pyscript.util import NotSupported
 import js as globalThis
+from pyscript.util import NotSupported
 
 RUNNING_IN_WORKER = not hasattr(globalThis, "document")
 
@@ -7,8 +7,9 @@ if RUNNING_IN_WORKER:
     import polyscript
 
     PyWorker = NotSupported(
-        'pyscript.PyWorker',
-        'pyscript.PyWorker works only when running in the main thread')
+        "pyscript.PyWorker",
+        "pyscript.PyWorker works only when running in the main thread",
+    )
     window = polyscript.xworker.window
     document = window.document
     sync = polyscript.xworker.sync
@@ -21,11 +22,12 @@ if RUNNING_IN_WORKER:
 else:
     import _pyscript
     from _pyscript import PyWorker
+
     window = globalThis
     document = globalThis.document
     sync = NotSupported(
-        'pyscript.sync',
-        'pyscript.sync works only when running in a worker')
+        "pyscript.sync", "pyscript.sync works only when running in a worker"
+    )
 
     # in MAIN the current element target exist, just use it
     def current_target():

package/src/stdlib/pyscript.js

@@ -1,10 +1,10 @@
 // ⚠️ This file is an artifact: DO NOT MODIFY
 export default {
   "pyscript": {
-    "__init__.py": "# Some notes about the naming conventions and the relationship between various\n# similar-but-different names.\n#\n# import pyscript\n#     this package contains the main user-facing API offered by pyscript. All\n#     the names which are supposed be used by end users should be made\n#     available in pyscript/__init__.py (i.e., this file)\n#\n# import _pyscript\n#     this is an internal module implemented in JS. It is used internally by\n#     the pyscript package, end users should not use it directly. For its\n#     implementation, grep for `interpreter.registerJsModule(\"_pyscript\",\n#     ...)` in core.js\n#\n# import js\n#     this is the JS globalThis, as exported by pyodide and/or micropython's\n#     FFIs. As such, it contains different things in the main thread or in a\n#     worker.\n#\n# import pyscript.magic_js\n#     this submodule abstracts away some of the differences between the main\n#     thread and the worker. In particular, it defines `window` and `document`\n#     in such a way that these names work in both cases: in the main thread,\n#     they are the \"real\" objects, in the worker they are proxies which work\n#     thanks to coincident.\n#\n# from pyscript import window, document\n#     these are just the window and document objects as defined by\n#     pyscript.magic_js. This is the blessed way to access them from pyscript,\n#     as it works transparently in both the main thread and worker cases.\n\nfrom pyscript.magic_js import RUNNING_IN_WORKER, window, document, sync\nfrom pyscript.display import HTML, display\n\ntry:\n    from pyscript.event_handling import when\nexcept:\n    from pyscript.util import NotSupported\n\n    when = NotSupported(\n        \"pyscript.when\",\n        \"pyscript.when currently not available with this interpreter\"\n    )\n",
-    "display.py": "import base64\nimport html\nimport io\nimport re\n\nfrom pyscript.magic_js import current_target, document, window\n\n_MIME_METHODS = {\n    \"__repr__\": \"text/plain\",\n    \"_repr_html_\": \"text/html\",\n    \"_repr_markdown_\": \"text/markdown\",\n    \"_repr_svg_\": \"image/svg+xml\",\n    \"_repr_pdf_\": \"application/pdf\",\n    \"_repr_jpeg_\": \"image/jpeg\",\n    \"_repr_png_\": \"image/png\",\n    \"_repr_latex\": \"text/latex\",\n    \"_repr_json_\": \"application/json\",\n    \"_repr_javascript_\": \"application/javascript\",\n    \"savefig\": \"image/png\",\n}\n\n\ndef _render_image(mime, value, meta):\n    # If the image value is using bytes we should convert it to base64\n    # otherwise it will return raw bytes and the browser will not be able to\n    # render it.\n    if isinstance(value, bytes):\n        value = base64.b64encode(value).decode(\"utf-8\")\n\n    # This is the pattern of base64 strings\n    base64_pattern = re.compile(\n        r\"^([A-Za-z0-9+/]{4})*([A-Za-z0-9+/]{3}=|[A-Za-z0-9+/]{2}==)?$\"\n    )\n    # If value doesn't match the base64 pattern we should encode it to base64\n    if len(value) > 0 and not base64_pattern.match(value):\n        value = base64.b64encode(value.encode(\"utf-8\")).decode(\"utf-8\")\n\n    data = f\"data:{mime};charset=utf-8;base64,{value}\"\n    attrs = \" \".join(['{k}=\"{v}\"' for k, v in meta.items()])\n    return f'<img src=\"{data}\" {attrs}></img>'\n\n\ndef _identity(value, meta):\n    return value\n\n\n_MIME_RENDERERS = {\n    \"text/plain\": html.escape,\n    \"text/html\": _identity,\n    \"image/png\": lambda value, meta: _render_image(\"image/png\", value, meta),\n    \"image/jpeg\": lambda value, meta: _render_image(\"image/jpeg\", value, meta),\n    \"image/svg+xml\": _identity,\n    \"application/json\": _identity,\n    \"application/javascript\": lambda value, meta: f\"<script>{value}<\\\\/script>\",\n}\n\n\nclass HTML:\n    \"\"\"\n    Wrap a string so that display() can render it as plain HTML\n    \"\"\"\n\n    def __init__(self, html):\n        self._html = html\n\n    def _repr_html_(self):\n        return self._html\n\n\ndef _eval_formatter(obj, print_method):\n    \"\"\"\n    Evaluates a formatter method.\n    \"\"\"\n    if print_method == \"__repr__\":\n        return repr(obj)\n    elif hasattr(obj, print_method):\n        if print_method == \"savefig\":\n            buf = io.BytesIO()\n            obj.savefig(buf, format=\"png\")\n            buf.seek(0)\n            return base64.b64encode(buf.read()).decode(\"utf-8\")\n        return getattr(obj, print_method)()\n    elif print_method == \"_repr_mimebundle_\":\n        return {}, {}\n    return None\n\n\ndef _format_mime(obj):\n    \"\"\"\n    Formats object using _repr_x_ methods.\n    \"\"\"\n    if isinstance(obj, str):\n        return html.escape(obj), \"text/plain\"\n\n    mimebundle = _eval_formatter(obj, \"_repr_mimebundle_\")\n    if isinstance(mimebundle, tuple):\n        format_dict, _ = mimebundle\n    else:\n        format_dict = mimebundle\n\n    output, not_available = None, []\n    for method, mime_type in reversed(_MIME_METHODS.items()):\n        if mime_type in format_dict:\n            output = format_dict[mime_type]\n        else:\n            output = _eval_formatter(obj, method)\n\n        if output is None:\n            continue\n        elif mime_type not in _MIME_RENDERERS:\n            not_available.append(mime_type)\n            continue\n        break\n    if output is None:\n        if not_available:\n            window.console.warn(\n                f\"Rendered object requested unavailable MIME renderers: {not_available}\"\n            )\n        output = repr(output)\n        mime_type = \"text/plain\"\n    elif isinstance(output, tuple):\n        output, meta = output\n    else:\n        meta = {}\n    return _MIME_RENDERERS[mime_type](output, meta), mime_type\n\n\ndef _write(element, value, append=False):\n    html, mime_type = _format_mime(value)\n    if html == \"\\\\n\":\n        return\n\n    if append:\n        out_element = document.createElement(\"div\")\n        element.append(out_element)\n    else:\n        out_element = element.lastElementChild\n        if out_element is None:\n            out_element = element\n\n    if mime_type in (\"application/javascript\", \"text/html\"):\n        script_element = document.createRange().createContextualFragment(html)\n        out_element.append(script_element)\n    else:\n        out_element.innerHTML = html\n\n\ndef display(*values, target=None, append=True):\n    if target is None:\n        target = current_target()\n\n    element = document.getElementById(target)\n\n    # if element is a <script type=\"py\">, it has a 'target' attribute which\n    # points to the visual element holding the displayed values. In that case,\n    # use that.\n    if element.tagName == \"SCRIPT\" and hasattr(element, \"target\"):\n        element = element.target\n\n    for v in values:\n        if not append:\n            element.replaceChildren()\n        _write(element, v, append=append)\n",
+    "__init__.py": "# Some notes about the naming conventions and the relationship between various\n# similar-but-different names.\n#\n# import pyscript\n#     this package contains the main user-facing API offered by pyscript. All\n#     the names which are supposed be used by end users should be made\n#     available in pyscript/__init__.py (i.e., this file)\n#\n# import _pyscript\n#     this is an internal module implemented in JS. It is used internally by\n#     the pyscript package, end users should not use it directly. For its\n#     implementation, grep for `interpreter.registerJsModule(\"_pyscript\",\n#     ...)` in core.js\n#\n# import js\n#     this is the JS globalThis, as exported by pyodide and/or micropython's\n#     FFIs. As such, it contains different things in the main thread or in a\n#     worker.\n#\n# import pyscript.magic_js\n#     this submodule abstracts away some of the differences between the main\n#     thread and the worker. In particular, it defines `window` and `document`\n#     in such a way that these names work in both cases: in the main thread,\n#     they are the \"real\" objects, in the worker they are proxies which work\n#     thanks to coincident.\n#\n# from pyscript import window, document\n#     these are just the window and document objects as defined by\n#     pyscript.magic_js. This is the blessed way to access them from pyscript,\n#     as it works transparently in both the main thread and worker cases.\n\nfrom pyscript.display import HTML, display\nfrom pyscript.magic_js import (\n    RUNNING_IN_WORKER,\n    PyWorker,\n    current_target,\n    document,\n    sync,\n    window,\n)\n\ntry:\n    from pyscript.event_handling import when\nexcept:\n    from pyscript.util import NotSupported\n\n    when = NotSupported(\n        \"pyscript.when\", \"pyscript.when currently not available with this interpreter\"\n    )\n",
+    "display.py": "import base64\nimport html\nimport io\nimport re\n\nfrom pyscript.magic_js import current_target, document, window\n\n_MIME_METHODS = {\n    \"__repr__\": \"text/plain\",\n    \"_repr_html_\": \"text/html\",\n    \"_repr_markdown_\": \"text/markdown\",\n    \"_repr_svg_\": \"image/svg+xml\",\n    \"_repr_pdf_\": \"application/pdf\",\n    \"_repr_jpeg_\": \"image/jpeg\",\n    \"_repr_png_\": \"image/png\",\n    \"_repr_latex\": \"text/latex\",\n    \"_repr_json_\": \"application/json\",\n    \"_repr_javascript_\": \"application/javascript\",\n    \"savefig\": \"image/png\",\n}\n\n\ndef _render_image(mime, value, meta):\n    # If the image value is using bytes we should convert it to base64\n    # otherwise it will return raw bytes and the browser will not be able to\n    # render it.\n    if isinstance(value, bytes):\n        value = base64.b64encode(value).decode(\"utf-8\")\n\n    # This is the pattern of base64 strings\n    base64_pattern = re.compile(\n        r\"^([A-Za-z0-9+/]{4})*([A-Za-z0-9+/]{3}=|[A-Za-z0-9+/]{2}==)?$\"\n    )\n    # If value doesn't match the base64 pattern we should encode it to base64\n    if len(value) > 0 and not base64_pattern.match(value):\n        value = base64.b64encode(value.encode(\"utf-8\")).decode(\"utf-8\")\n\n    data = f\"data:{mime};charset=utf-8;base64,{value}\"\n    attrs = \" \".join(['{k}=\"{v}\"' for k, v in meta.items()])\n    return f'<img src=\"{data}\" {attrs}></img>'\n\n\ndef _identity(value, meta):\n    return value\n\n\n_MIME_RENDERERS = {\n    \"text/plain\": html.escape,\n    \"text/html\": _identity,\n    \"image/png\": lambda value, meta: _render_image(\"image/png\", value, meta),\n    \"image/jpeg\": lambda value, meta: _render_image(\"image/jpeg\", value, meta),\n    \"image/svg+xml\": _identity,\n    \"application/json\": _identity,\n    \"application/javascript\": lambda value, meta: f\"<script>{value}<\\\\/script>\",\n}\n\n\nclass HTML:\n    \"\"\"\n    Wrap a string so that display() can render it as plain HTML\n    \"\"\"\n\n    def __init__(self, html):\n        self._html = html\n\n    def _repr_html_(self):\n        return self._html\n\n\ndef _eval_formatter(obj, print_method):\n    \"\"\"\n    Evaluates a formatter method.\n    \"\"\"\n    if print_method == \"__repr__\":\n        return repr(obj)\n    elif hasattr(obj, print_method):\n        if print_method == \"savefig\":\n            buf = io.BytesIO()\n            obj.savefig(buf, format=\"png\")\n            buf.seek(0)\n            return base64.b64encode(buf.read()).decode(\"utf-8\")\n        return getattr(obj, print_method)()\n    elif print_method == \"_repr_mimebundle_\":\n        return {}, {}\n    return None\n\n\ndef _format_mime(obj):\n    \"\"\"\n    Formats object using _repr_x_ methods.\n    \"\"\"\n    if isinstance(obj, str):\n        return html.escape(obj), \"text/plain\"\n\n    mimebundle = _eval_formatter(obj, \"_repr_mimebundle_\")\n    if isinstance(mimebundle, tuple):\n        format_dict, _ = mimebundle\n    else:\n        format_dict = mimebundle\n\n    output, not_available = None, []\n    for method, mime_type in reversed(_MIME_METHODS.items()):\n        if mime_type in format_dict:\n            output = format_dict[mime_type]\n        else:\n            output = _eval_formatter(obj, method)\n\n        if output is None:\n            continue\n        elif mime_type not in _MIME_RENDERERS:\n            not_available.append(mime_type)\n            continue\n        break\n    if output is None:\n        if not_available:\n            window.console.warn(\n                f\"Rendered object requested unavailable MIME renderers: {not_available}\"\n            )\n        output = repr(output)\n        mime_type = \"text/plain\"\n    elif isinstance(output, tuple):\n        output, meta = output\n    else:\n        meta = {}\n    return _MIME_RENDERERS[mime_type](output, meta), mime_type\n\n\ndef _write(element, value, append=False):\n    html, mime_type = _format_mime(value)\n    if html == \"\\\\n\":\n        return\n\n    if append:\n        out_element = document.createElement(\"div\")\n        element.append(out_element)\n    else:\n        out_element = element.lastElementChild\n        if out_element is None:\n            out_element = element\n\n    if mime_type in (\"application/javascript\", \"text/html\"):\n        script_element = document.createRange().createContextualFragment(html)\n        out_element.append(script_element)\n    else:\n        out_element.innerHTML = html\n\n\ndef display(*values, target=None, append=True):\n    if target is None:\n        target = current_target()\n    elif not isinstance(target, str):\n        raise TypeError(f\"target must be str or None, not {target.__class__.__name__}\")\n    elif target == \"\":\n        raise ValueError(\"Cannot have an empty target\")\n    elif target.startswith(\"#\"):\n        # note: here target is str and not None!\n        # align with @when behavior\n        target = target[1:]\n\n    element = document.getElementById(target)\n\n    # If target cannot be found on the page, a ValueError is raised\n    if element is None:\n        raise ValueError(\n            f\"Invalid selector with id={target}. Cannot be found in the page.\"\n        )\n\n    # if element is a <script type=\"py\">, it has a 'target' attribute which\n    # points to the visual element holding the displayed values. In that case,\n    # use that.\n    if element.tagName == \"SCRIPT\" and hasattr(element, \"target\"):\n        element = element.target\n\n    for v in values:\n        if not append:\n            element.replaceChildren()\n        _write(element, v, append=append)\n",
     "event_handling.py": "import inspect\n\nfrom pyodide.ffi.wrappers import add_event_listener\nfrom pyscript.magic_js import document\n\n\ndef when(event_type=None, selector=None):\n    \"\"\"\n    Decorates a function and passes py-* events to the decorated function\n    The events might or not be an argument of the decorated function\n    \"\"\"\n\n    def decorator(func):\n        if isinstance(selector, str):\n            elements = document.querySelectorAll(selector)\n        else:\n            # TODO: This is a hack that will be removed when pyscript becomes a package\n            #       and we can better manage the imports without circular dependencies\n            from pyweb import pydom\n\n            if isinstance(selector, pydom.Element):\n                elements = [selector._js]\n            elif isinstance(selector, pydom.ElementCollection):\n                elements = [el._js for el in selector]\n            else:\n                raise ValueError(\n                    f\"Invalid selector: {selector}. Selector must\"\n                    \" be a string, a pydom.Element or a pydom.ElementCollection.\"\n                )\n\n        sig = inspect.signature(func)\n        # Function doesn't receive events\n        if not sig.parameters:\n\n            def wrapper(*args, **kwargs):\n                func()\n\n            for el in elements:\n                add_event_listener(el, event_type, wrapper)\n        else:\n            for el in elements:\n                add_event_listener(el, event_type, func)\n        return func\n\n    return decorator\n",
-    "magic_js.py": "from pyscript.util import NotSupported\nimport js as globalThis\n\nRUNNING_IN_WORKER = not hasattr(globalThis, \"document\")\n\nif RUNNING_IN_WORKER:\n    import polyscript\n\n    PyWorker = NotSupported(\n        'pyscript.PyWorker',\n        'pyscript.PyWorker works only when running in the main thread')\n    window = polyscript.xworker.window\n    document = window.document\n    sync = polyscript.xworker.sync\n\n    # in workers the display does not have a default ID\n    # but there is a sync utility from xworker\n    def current_target():\n        return polyscript.target\n\nelse:\n    import _pyscript\n    from _pyscript import PyWorker\n    window = globalThis\n    document = globalThis.document\n    sync = NotSupported(\n        'pyscript.sync',\n        'pyscript.sync works only when running in a worker')\n\n    # in MAIN the current element target exist, just use it\n    def current_target():\n        return _pyscript.target\n",
+    "magic_js.py": "import js as globalThis\nfrom pyscript.util import NotSupported\n\nRUNNING_IN_WORKER = not hasattr(globalThis, \"document\")\n\nif RUNNING_IN_WORKER:\n    import polyscript\n\n    PyWorker = NotSupported(\n        \"pyscript.PyWorker\",\n        \"pyscript.PyWorker works only when running in the main thread\",\n    )\n    window = polyscript.xworker.window\n    document = window.document\n    sync = polyscript.xworker.sync\n\n    # in workers the display does not have a default ID\n    # but there is a sync utility from xworker\n    def current_target():\n        return polyscript.target\n\nelse:\n    import _pyscript\n    from _pyscript import PyWorker\n\n    window = globalThis\n    document = globalThis.document\n    sync = NotSupported(\n        \"pyscript.sync\", \"pyscript.sync works only when running in a worker\"\n    )\n\n    # in MAIN the current element target exist, just use it\n    def current_target():\n        return _pyscript.target\n",
     "util.py": "class NotSupported:\n    \"\"\"\n    Small helper that raises exceptions if you try to get/set any attribute on\n    it.\n    \"\"\"\n\n    def __init__(self, name, error):\n        object.__setattr__(self, \"name\", name)\n        object.__setattr__(self, \"error\", error)\n\n    def __repr__(self):\n        return f\"<NotSupported {self.name} [{self.error}]>\"\n\n    def __getattr__(self, attr):\n        raise AttributeError(self.error)\n\n    def __setattr__(self, attr, value):\n        raise AttributeError(self.error)\n\n    def __call__(self, *args):\n        raise TypeError(self.error)\n"
   },
   "pyweb": {