jupyterpack 0.5.5 → 0.5.6

package/README.md

@@ -3,15 +3,32 @@
 [![Github Actions Status](https://github.com/trungleduc/jupyterpack/workflows/Build/badge.svg)](https://github.com/trungleduc/specta/actions/workflows/build.yml)
 [![Try on lite](https://jupyterlite.rtfd.io/en/latest/_static/badge.svg)](https://trungleduc.github.io/jupyterpack/lab/)
 
-<h2 align="center"> A JupyterLite extension to serve in-browser Python and Javascript web application</h2>
+<h2 align="center">In-browser Python and JavaScript web applications for JupyterLite</h2>
+
+`jupyterpack` brings in-browser Python and JavaScript web applications to the JupyterLite ecosystem. Built as a JupyterLite extension, it allows applications to run, serve, and interact fully client-side, with no backend required.
+
+<br/>
+
+![Image](https://github.com/user-attachments/assets/22849fe8-199f-4d9f-ad45-055bccf88bad)
 
 ## Features
 
-- **Python Web Apps**: Serve Python web applications directly in the browser using JupyterLite's in-browser Python kernel. `jupyterpack` currently supports Dash, Streamlit and Shiny for Python. You can also use `jupyterpack` to serve any `Starlette` or `Tornado` application.
-  .
+- **Python Web Apps**: Serve Python web applications directly in the browser using JupyterLite's in-browser Python kernel. `jupyterpack` currently supports:
+  - [**Dash**](https://github.com/plotly/dash)
+  - [**Streamlit**](https://github.com/streamlit/streamlit)
+  - [**Panel**](https://github.com/holoviz/panel)
+  - [**Shiny for Python**](https://github.com/posit-dev/py-shiny)
+  - [**Textual**](https://github.com/Textualize/textual)
+  - [**Vizro**](https://github.com/mckinsey/vizro)
+  - [**FastHTML**](https://github.com/AnswerDotAI/fasthtml)
+
+  You can also use `jupyterpack` to serve any [**Flask**](https://github.com/pallets/flask), [**Starlette**](https://github.com/Kludex/starlette) or [**Tornado**](https://github.com/tornadoweb/tornado) application.
+
 - **JavaScript Web Apps**: Bundle and serve JavaScript web applications using in-browser bundlers.
 
-![Image](https://github.com/user-attachments/assets/22849fe8-199f-4d9f-ad45-055bccf88bad)
+Example of each framework can be found in the [demo](https://github.com/trungleduc/jupyterpack/tree/main/demo/files) folder.
+
+- ** Direct link to your app**: Share your app with others by generating a direct link to your app. This link can be shared with anyone and will open your app in the browser (see the [toolbar buttons](https://github.com/trungleduc/jupyterpack/edit/main/README.md#toolbar-buttons)).
 
 ## Installation
 
@@ -25,7 +42,13 @@ pip install jupyterpack
 conda install -c conda-forge jupyterpack
 ```
 
-## Set up JupyterLite deployment
+## Try it online!
+
+You can try it online by clicking on this badge:
+
+[![Try on lite](https://jupyterlite.rtfd.io/en/latest/_static/badge.svg)](https://trungleduc.github.io/jupyterpack/lab/)
+
+## Setting up JupyterLite deployment
 
 `jupyterpack` currently supports only `xeus-python` kernel and does **not** support `pyodide-kernel`. You can refer to the `xeus-python` [official documentation](https://jupyterlite-xeus.readthedocs.io/en/stable/deploy.html) for the base setup of JupyterLite with `xeus-python` kernel.
 
@@ -105,8 +128,44 @@ dependencies:
       - pyodide_http
 ```
 
+- **Texual**
+
+```yaml
+name: xeus-kernels
+channels:
+  - https://repo.prefix.dev/emscripten-forge-dev
+  - https://repo.prefix.dev/conda-forge
+dependencies:
+  - xeus-python
+  - jupyterpack
+  - textual
+  - textual-serve
+  - pip:
+      - pyodide_http
+```
+
+- **Vizro**
+
+```yaml
+name: xeus-kernels
+channels:
+  - https://repo.prefix.dev/emscripten-forge-dev
+  - https://repo.prefix.dev/conda-forge
+dependencies:
+  - xeus-python
+  - jupyterpack
+  - werkzeug>=2.2,<3.0
+  - blinker>=1.5.0,<2
+  - cachetools>=4.0,<7
+  - vizro
+  - pip:
+      - pyodide_http
+```
+
 ## Usage
 
+### Create a `.spk` file
+
 To use `jupyterpack`, you need to create a `.spk` file that defines your web application. Here's an example structure of a React application:
 
 ```bash
@@ -129,6 +188,15 @@ the `app.spk` is the entry point of your React app, it should contain the follow
 
 Double-clicking the `spk` file to open the web app as a tab of JupyterLab.
 
+### Toolbar buttons
+
+Once the app is loaded, you can interact with it using the toolbar buttons:
+
+- **Reload**: Reload the app manually after editing the code.
+- **Toggle autoreload**: Enable or disable autoreloading of the app when files change.
+- **Open in Specta**: Open the app in full-screen mode without JupyterLab UI elements
+- **Copy link to clipboard**: Copy a shareable link to your application. Anyone with the link can access your app.
+
 ## `.spk` — Jupyter Pack File Format
 
 A **`.spk`** file describes how an application should be loaded, executed, and rendered in JupyterLite and JupyterLab.  
@@ -161,14 +229,16 @@ interface IJupyterPackFileFormat {
 
 - `framework` (required): The framework used to run the application. Supported frameworks are:
 
-  | Value       | Description                      |
-  | ----------- | -------------------------------- |
-  | `react`     | React-based frontend application |
-  | `dash`      | Plotly Dash application          |
-  | `streamlit` | Streamlit application            |
-  | `tornado`   | Tornado web application          |
-  | `shiny`     | Shiny application (Python)       |
-  | `starlette` | Starlette ASGI application       |
+  | Value       | Description                                                         |
+  | ----------- | ------------------------------------------------------------------- |
+  | `react`     | React-based frontend application                                    |
+  | `dash`      | [Plotly Dash](https://github.com/plotly/dash) application           |
+  | `streamlit` | [Streamlit](https://github.com/streamlit/streamlit) application     |
+  | `shiny`     | [Shiny](https://github.com/posit-dev/py-shiny) application (Python) |
+  | `panel`     | [Panel](https://github.com/holoviz/panel) application               |
+  | `textual`   | [Textual](https://github.com/Textualize/textual) application        |
+  | `tornado`   | [Tornado](https://github.com/tornadoweb/tornado) web application    |
+  | `starlette` | [Starlette](https://github.com/Kludex/starlette) web application    |
 
 - `name` (optional): The name of the application. If not provided, the name will be the name of the .spk file.
 
@@ -240,14 +310,12 @@ As with React applications, double-clicking the `.spk` file will open the Dash a
 
 ### Streamlit application
 
-Streamlit applications follow a similar structure to Dash apps.
-Write your code as a standard Streamlit application and do **not** start the server manually — `jupyterpack` will handle execution and serving automatically.
+There is no special requirement for Streamlit applications, just write your code as a standard Streamlit application and do **not** start the server manually — `jupyterpack` will handle execution and serving automatically.
 
 Opening the `.spk` file will launch the Streamlit app in a new JupyterLab tab.
 
 ### Shiny application
 
-Shiny applications also follow a structure similar to Dash apps.  
 `jupyterpack` supports both **Shiny Express** and **Shiny Core** applications.
 
 - **Shiny Express**: no special requirements.
@@ -255,11 +323,21 @@ Shiny applications also follow a structure similar to Dash apps.
 
 In both cases, the server is managed by `jupyterpack`, and opening the `.spk` file will launch the app in JupyterLab.
 
-## Try it online!
+### Panel application
 
-You can try it online by clicking on this badge:
+There is no special requirement for Panel applications, just write your code as a standard Panel application and call `.servable()` on the layout you want to serve.
 
-[![Try on lite](https://jupyterlite.rtfd.io/en/latest/_static/badge.svg)](https://trungleduc.github.io/jupyterpack/lab/)
+### Textual application
+
+You must define your Textual application as a variable named `app` and do not call `app.run()` yourself — `jupyterpack` is responsible for starting and managing the server lifecycle.
+
+### Vizro application
+
+There is no special requirement for Vizro applications, just write your code as a standard Vizro application and call `Vizro().build(...).run()` to serve your dashboard.
+
+### FastHTML application
+
+JupyterPack only supports async handlers with FastHTML. You must convert all synchronous handlers to async, and you should not call `serve()` yourself — jupyterpack is responsible for starting and managing the server lifecycle.
 
 ## License
 

package/lib/document/commands.d.ts

@@ -1,8 +1,20 @@
+import { JupyterFrontEnd } from '@jupyterlab/application';
+import { ILauncher } from '@jupyterlab/launcher';
+import { LabIcon } from '@jupyterlab/ui-components';
 import { CommandRegistry } from '@lumino/commands';
-import { IJupyterpackDocTracker } from '../type';
+import { IJupyterpackDocTracker, JupyterPackFramework } from '../type';
+import { Contents } from '@jupyterlab/services';
 export declare const CommandIDs: {
     RELOAD: string;
     TOGGLE_AUTORELOAD: string;
     OPEN_SPECTA: string;
+    COPY_LINK: string;
 };
-export declare function addCommands(commands: CommandRegistry, tracker: IJupyterpackDocTracker): void;
+export declare function addCommands(commands: CommandRegistry, tracker: IJupyterpackDocTracker, contentsManager: Contents.IManager): void;
+export declare function addLauncherCommands(options: {
+    app: JupyterFrontEnd;
+    launcher: ILauncher;
+    framework: JupyterPackFramework;
+    icon: LabIcon;
+    rank: number;
+}): void;

package/lib/document/commands.js

@@ -1,10 +1,13 @@
-import { refreshIcon } from '@jupyterlab/ui-components';
-import { autoReloadIcon, linkIcon } from '../tools';
-import { PageConfig, URLExt } from '@jupyterlab/coreutils';
+import { PageConfig, PathExt, URLExt } from '@jupyterlab/coreutils';
+import { copyIcon, refreshIcon } from '@jupyterlab/ui-components';
+import { Notification } from '@jupyterlab/apputils';
+import { autoReloadIcon, encodeSpk, linkIcon } from '../tools';
+import { generateAppFiles } from './templates';
 export const CommandIDs = {
     RELOAD: 'jupyterpack:reload',
     TOGGLE_AUTORELOAD: 'jupyterpack:toggleAutoreload',
-    OPEN_SPECTA: 'jupyterpack:openInSpecta'
+    OPEN_SPECTA: 'jupyterpack:openInSpecta',
+    COPY_LINK: 'jupyterpack:copyEncodedLink'
 };
 const labBaseUrl = PageConfig.getOption('baseUrl');
 function getCurrentIframPanel(tracker) {
@@ -19,7 +22,7 @@ function getCurrentIframPanel(tracker) {
     }
     return widget;
 }
-export function addCommands(commands, tracker) {
+export function addCommands(commands, tracker, contentsManager) {
     commands.addCommand(CommandIDs.RELOAD, {
         caption: 'Reload',
         isEnabled: () => {
@@ -73,4 +76,62 @@ export function addCommands(commands, tracker) {
             window.open(spectaUrl.toString(), '_blank');
         }
     });
+    commands.addCommand(CommandIDs.COPY_LINK, {
+        caption: 'Copy link to clipboard',
+        isEnabled: () => {
+            return tracker.currentWidget !== null;
+        },
+        icon: copyIcon,
+        execute: async () => {
+            var _a;
+            const context = (_a = tracker.currentWidget) === null || _a === void 0 ? void 0 : _a.context;
+            if (!context) {
+                return;
+            }
+            await context.ready;
+            const filePath = context.localPath;
+            const spkContent = context.model.toJSON();
+            const entryPath = PathExt.join(PathExt.dirname(filePath), spkContent.entry);
+            const entryContent = await contentsManager.get(entryPath, {
+                content: true,
+                format: 'text'
+            });
+            const encodedData = encodeSpk({
+                spkContent: JSON.stringify(spkContent),
+                entryContent: entryContent.content
+            });
+            const spectaUrl = new URL(URLExt.join(labBaseUrl, 'specta'), window.location.origin);
+            spectaUrl.searchParams.set('no-tree', 'true');
+            spectaUrl.searchParams.set('spk-link', '');
+            spectaUrl.hash = encodedData;
+            await navigator.clipboard.writeText(spectaUrl.toString());
+            Notification.success('Link copied to clipboard', {
+                autoClose: 3000
+            });
+        }
+    });
+}
+export function addLauncherCommands(options) {
+    const { app, launcher, framework, icon, rank } = options;
+    const { commands } = app;
+    const commandId = `jupyterpack:create-${framework}-app`;
+    const frameworkName = framework.charAt(0).toUpperCase() + framework.slice(1);
+    commands.addCommand(commandId, {
+        label: `${frameworkName} App`,
+        icon: icon,
+        caption: `Create a new ${frameworkName} Application`,
+        execute: async (args) => {
+            const cwd = args['cwd'];
+            await generateAppFiles({
+                contentsManager: app.serviceManager.contents,
+                cwd,
+                framework
+            });
+        }
+    });
+    launcher.add({
+        command: commandId,
+        category: 'JupyterPack',
+        rank
+    });
 }

package/lib/document/plugin.d.ts

@@ -2,3 +2,4 @@ import { JupyterFrontEndPlugin } from '@jupyterlab/application';
 import { IJupyterpackDocTracker } from '../type';
 export declare const spkPlugin: JupyterFrontEndPlugin<IJupyterpackDocTracker>;
 export declare const launcherPlugin: JupyterFrontEndPlugin<void>;
+export declare const spkFromLink: JupyterFrontEndPlugin<void>;

package/lib/document/plugin.js

@@ -1,11 +1,13 @@
-import { JupyterPackFramework } from './../type';
 import { WidgetTracker } from '@jupyterlab/apputils';
 import { ILauncher } from '@jupyterlab/launcher';
+import { IDocumentManager } from '@jupyterlab/docmanager';
 import { IConnectionManagerToken, IJupyterpackDocTrackerToken } from '../token';
-import { dashIcon, logoIcon, panelIcon, shinyIcon, streamlitIcon } from '../tools';
-import { addCommands } from './commands';
+import { dashIcon, decodeSpk, fasthtmlIcon, logoIcon, panelIcon, shinyIcon, streamlitIcon, textualIcon, vizroIcon } from '../tools';
+import { JupyterPackFramework } from '../type';
+import { addCommands, addLauncherCommands } from './commands';
 import { JupyterPackWidgetFactory } from './widgetFactory';
-import { generateAppFiles } from './templates';
+import { spkFactory } from './templates/spk';
+import { newFile } from './templates';
 const FACTORY = 'jupyterpack';
 const CONTENT_TYPE = 'jupyterpack';
 export const spkPlugin = {
@@ -17,7 +19,7 @@ export const spkPlugin = {
         const tracker = new WidgetTracker({
             namespace: FACTORY
         });
-        addCommands(app.commands, tracker);
+        addCommands(app.commands, tracker, app.serviceManager.contents);
         const widgetFactory = new JupyterPackWidgetFactory({
             name: FACTORY,
             modelName: 'text',
@@ -50,6 +52,7 @@ export const spkPlugin = {
         return tracker;
     }
 };
+const CREATE_SPK_COMMAND_ID = 'jupyterpack:create-new-file';
 export const launcherPlugin = {
     id: 'jupyterpack:spklauncher',
     optional: [ILauncher],
@@ -60,122 +63,101 @@ export const launcherPlugin = {
             return;
         }
         const { commands } = app;
-        const commandId = 'jupyterpack:create-new-file';
-        const dashCommandId = 'jupyterpack:create-dash-app';
-        const streamlitCommandId = 'jupyterpack:create-streamlit-app';
-        const shinyCommandId = 'jupyterpack:create-shiny-app';
-        const panelCommandId = 'jupyterpack:create-panel-app';
-        commands.addCommand(commandId, {
+        commands.addCommand(CREATE_SPK_COMMAND_ID, {
             label: 'New SPK File',
             icon: logoIcon,
             caption: 'Create a new SPK fike',
             execute: async (args) => {
-                const cwd = args['cwd'];
+                var _a, _b, _c;
+                const cwd = ((_a = args['cwd']) !== null && _a !== void 0 ? _a : '');
                 const contentsManager = app.serviceManager.contents;
-                let model = await contentsManager.newUntitled({
-                    path: cwd,
-                    type: 'file',
-                    ext: '.spk'
+                const spkContent = (_b = args['spkContent']) !== null && _b !== void 0 ? _b : spkFactory({
+                    name: 'Untitled',
+                    framework: ((_c = args['framework']) !== null && _c !== void 0 ? _c : '')
                 });
-                const spkContent = `
-{
-  "name": "${model.name}",
-  "entry": "",
-  "framework": "",
-  "rootUrl": "/",
-  "metadata": {
-    "autoreload": true
-  },
-  "dependencies": {
-    "mamba": [],
-    "pip": []
-  }
-}  
-`;
-                model = await contentsManager.save(model.path, {
-                    ...model,
-                    format: 'text',
-                    size: undefined,
-                    content: spkContent
-                });
-            }
-        });
-        commands.addCommand(dashCommandId, {
-            label: 'Dash App',
-            icon: dashIcon,
-            caption: 'Create a new Dash Application',
-            execute: async (args) => {
-                const cwd = args['cwd'];
-                await generateAppFiles({
-                    contentsManager: app.serviceManager.contents,
-                    cwd,
-                    framework: JupyterPackFramework.DASH
-                });
-            }
-        });
-        commands.addCommand(streamlitCommandId, {
-            label: 'Streamlit App',
-            icon: streamlitIcon,
-            caption: 'Create a new Streamlit Application',
-            execute: async (args) => {
-                const cwd = args['cwd'];
-                await generateAppFiles({
-                    contentsManager: app.serviceManager.contents,
-                    cwd,
-                    framework: JupyterPackFramework.STREAMLIT
-                });
-            }
-        });
-        commands.addCommand(shinyCommandId, {
-            label: 'Shiny App',
-            icon: shinyIcon,
-            caption: 'Create a new Shiny Application',
-            execute: async (args) => {
-                const cwd = args['cwd'];
-                await generateAppFiles({
-                    contentsManager: app.serviceManager.contents,
-                    cwd,
-                    framework: JupyterPackFramework.SHINY
-                });
-            }
-        });
-        commands.addCommand(panelCommandId, {
-            label: 'Panel App',
-            icon: panelIcon,
-            caption: 'Create a new Panel Application',
-            execute: async (args) => {
-                const cwd = args['cwd'];
-                await generateAppFiles({
-                    contentsManager: app.serviceManager.contents,
+                await newFile({
                     cwd,
-                    framework: JupyterPackFramework.PANEL
+                    ext: '.spk',
+                    name: args['name'],
+                    content: spkContent,
+                    contentsManager
                 });
             }
         });
         launcher.add({
-            command: commandId,
+            command: CREATE_SPK_COMMAND_ID,
             category: 'JupyterPack',
             rank: 1
         });
-        launcher.add({
-            command: dashCommandId,
-            category: 'JupyterPack',
-            rank: 2
-        });
-        launcher.add({
-            command: streamlitCommandId,
-            category: 'JupyterPack',
-            rank: 3
-        });
-        launcher.add({
-            command: shinyCommandId,
-            category: 'JupyterPack',
-            rank: 4
-        });
-        launcher.add({
-            command: panelCommandId,
-            category: 'JupyterPack',
-            rank: 5
+        const iconMap = {
+            [JupyterPackFramework.DASH]: dashIcon,
+            [JupyterPackFramework.STREAMLIT]: streamlitIcon,
+            [JupyterPackFramework.SHINY]: shinyIcon,
+            [JupyterPackFramework.PANEL]: panelIcon,
+            [JupyterPackFramework.TEXTUAL]: textualIcon,
+            [JupyterPackFramework.VIZRO]: vizroIcon,
+            [JupyterPackFramework.FASTHTML]: fasthtmlIcon
+        };
+        Object.entries(iconMap).forEach(([framework, icon], index) => {
+            addLauncherCommands({
+                app,
+                launcher,
+                framework: framework,
+                icon,
+                rank: index + 2
+            });
         });
     }
 };
+export const spkFromLink = {
+    id: 'jupyterpack:spkFromLink',
+    requires: [IDocumentManager],
+    autoStart: true,
+    activate: (app, docManager) => {
+        const queryParams = new URLSearchParams(window.location.search);
+        const spkLink = queryParams.has('spk-link');
+        if (spkLink && window.location.hash) {
+            const linkData = window.location.hash.slice(1);
+            app.restored.then(async () => {
+                await new Promise(resolve => setTimeout(resolve, 500));
+                const { spk, entry } = decodeSpk(linkData);
+                const contentsManager = app.serviceManager.contents;
+                await newFile({
+                    cwd: '',
+                    name: '__entry_from_link__.py',
+                    ext: '.py',
+                    content: entry,
+                    contentsManager,
+                    overwrite: true
+                });
+                spk.name = '__spk_from_link__';
+                spk.entry = '__entry_from_link__.py';
+                const spkContent = JSON.stringify(spk, null, 2);
+                await newFile({
+                    cwd: '',
+                    name: '__spk_from_link__.spk',
+                    ext: '.spk',
+                    content: spkContent,
+                    contentsManager,
+                    overwrite: true
+                });
+                await new Promise(resolve => setTimeout(resolve, 200));
+                let count = 0;
+                const tryOpen = () => {
+                    const widget = docManager.openOrReveal('__spk_from_link__.spk', 'default');
+                    if (widget) {
+                        app.shell.add(widget, 'main');
+                    }
+                    else {
+                        count++;
+                        if (count > 10) {
+                            return;
+                        }
+                        setTimeout(tryOpen, 100);
+                    }
+                };
+                tryOpen();
+            });
+        }
+    }
+};

package/lib/document/templates/fasthtml.d.ts

@@ -0,0 +1 @@
+export declare const FASTHTML_APP = "\nfrom fasthtml.common import Div, P, fast_app\n\napp, rt = fast_app()\n\n\n@rt(\"/\")\nasync def get():\n    return Div(P(\"Hello World!\"))\n\n";

package/lib/document/templates/fasthtml.js

@@ -0,0 +1,11 @@
+export const FASTHTML_APP = `
+from fasthtml.common import Div, P, fast_app
+
+app, rt = fast_app()
+
+
+@rt("/")
+async def get():
+    return Div(P("Hello World!"))
+
+`;

package/lib/document/templates/index.d.ts

@@ -5,3 +5,11 @@ export declare function generateAppFiles(options: {
     framework: JupyterPackFramework;
     cwd: string;
 }): Promise<void>;
+export declare function newFile(options: {
+    cwd: string;
+    name?: string;
+    ext: string;
+    content: string;
+    contentsManager: Contents.IManager;
+    overwrite?: boolean;
+}): Promise<void>;

package/lib/document/templates/index.js

@@ -1,10 +1,13 @@
+import { PathExt } from '@jupyterlab/coreutils';
+import { newDirectory, pathExists } from '../../tools';
 import { JupyterPackFramework } from '../../type';
 import { DASH_APP } from './dash';
-import { STREAMLIT_APP } from './streamlit';
-import { SHINY_APP } from './shiny';
-import { newDirectory } from '../../tools';
-import { PathExt } from '@jupyterlab/coreutils';
 import { PANEL_APP } from './panel';
+import { SHINY_APP } from './shiny';
+import { STREAMLIT_APP } from './streamlit';
+import { TEXTUAL_APP } from './textual';
+import { VIZRO_APP } from './vizro';
+import { FASTHTML_APP } from './fasthtml';
 export async function generateAppFiles(options) {
     const { contentsManager, framework, cwd } = options;
     const newPath = await newDirectory({
@@ -35,6 +38,18 @@ export async function generateAppFiles(options) {
             appContent = PANEL_APP;
             break;
         }
+        case JupyterPackFramework.TEXTUAL: {
+            appContent = TEXTUAL_APP;
+            break;
+        }
+        case JupyterPackFramework.VIZRO: {
+            appContent = VIZRO_APP;
+            break;
+        }
+        case JupyterPackFramework.FASTHTML: {
+            appContent = FASTHTML_APP;
+            break;
+        }
         default:
             break;
     }
@@ -68,3 +83,23 @@ export async function generateAppFiles(options) {
     });
     await contentsManager.rename(model.path, PathExt.join(newPath, 'entrypoint.spk'));
 }
+export async function newFile(options) {
+    const { cwd, name, content, contentsManager, ext, overwrite } = options;
+    let model = await contentsManager.newUntitled({
+        path: cwd,
+        type: 'file',
+        ext
+    });
+    model = await contentsManager.save(model.path, {
+        ...model,
+        format: 'text',
+        size: undefined,
+        content
+    });
+    if (name) {
+        if (overwrite && (await pathExists(cwd, name, contentsManager))) {
+            await contentsManager.delete(PathExt.join(cwd, name));
+        }
+        await contentsManager.rename(model.path, PathExt.join(cwd, name));
+    }
+}

package/lib/document/templates/spk.d.ts

@@ -0,0 +1,5 @@
+export declare const spkFactory: (options: {
+    name?: string;
+    entry?: string;
+    framework?: string;
+}) => string;

package/lib/document/templates/spk.js

@@ -0,0 +1,20 @@
+export const spkFactory = (options) => {
+    const name = options.name ? `"${options.name}"` : '';
+    const entry = options.entry ? `"${options.entry}"` : '';
+    const framework = options.framework ? `"${options.framework}"` : '';
+    return `
+  {
+    "name": ${name},
+    "entry": ${entry},
+    "framework": ${framework},
+    "rootUrl": "/",
+    "metadata": {
+      "autoreload": true
+    },
+    "dependencies": {
+      "mamba": [],
+      "pip": []
+    }
+  }
+`;
+};

package/lib/document/templates/textual.d.ts

@@ -0,0 +1 @@
+export declare const TEXTUAL_APP = "\n# This example is taken from the Textual official repository (https://github.com/Textualize/textual-demo/blob/main/src/textual_demo)\n\nfrom textual.demo.demo_app import DemoApp\n\napp = DemoApp()\n";

package/lib/document/templates/textual.js

@@ -0,0 +1,7 @@
+export const TEXTUAL_APP = `
+# This example is taken from the Textual official repository (https://github.com/Textualize/textual-demo/blob/main/src/textual_demo)
+
+from textual.demo.demo_app import DemoApp
+
+app = DemoApp()
+`;

package/lib/document/templates/vizro.d.ts

@@ -0,0 +1 @@
+export declare const VIZRO_APP = "\n# This example is taken from the vizro official documentation (https://vizro.readthedocs.io/en/stable/pages/tutorials/quickstart-tutorial)\n\nimport vizro.plotly.express as px\nfrom vizro import Vizro\nimport vizro.models as vm\n\ndf = px.data.iris()\n\npage = vm.Page(\n    title=\"My first dashboard\",\n    components=[\n        vm.Graph(\n            figure=px.scatter(df, x=\"sepal_length\", y=\"petal_width\", color=\"species\")\n        ),\n        vm.Graph(figure=px.histogram(df, x=\"sepal_width\", color=\"species\")),\n    ],\n    controls=[\n        vm.Filter(column=\"species\"),\n    ],\n)\n\ndashboard = vm.Dashboard(pages=[page])\nVizro().build(dashboard).run()\n\n";