Update ipywidgets requirement from ~=7.7 to ~=8.0

amd-public-path.js

@@ -0,0 +1,8 @@
+// In an AMD module, we set the public path using the magic requirejs 'module' dependency
+// See https://github.com/requirejs/requirejs/wiki/Differences-between-the-simplified-CommonJS-wrapper-and-standard-AMD-define#module
+// Since 'module' is a requirejs magic module, we must include 'module' in the webpack externals configuration.
+var module = require('module');
+var url = new URL(module.uri, document.location)
+// Using lastIndexOf('/')+1 gives us the empty string if there is no '/', so pathname becomes '/'
+url.pathname = url.pathname.slice(0,url.pathname.lastIndexOf('/')+1);
+__webpack_public_path__ = `${url.origin}${url.pathname}`;

ipywidgets_extended/nbextension/static/extension.js

@@ -1,5 +1,5 @@
 // Entry point for the notebook bundle containing custom model definitions.
-//
+
 define(function() {
     "use strict";
 

package.json

@@ -46,12 +46,12 @@
     "watch:nbextension": "webpack --watch"
   },
   "dependencies": {
-    "@jupyter-widgets/base": "^1.2.0 || ^2 || ^3 || ^4",
-    "@jupyter-widgets/controls": "^1.5.0 || ^2 || ^3"
+    "@jupyter-widgets/base": "^1.2.0 || ^2 || ^3 || ^4 || ^5 || ^6",
+    "@jupyter-widgets/controls": "^1.5.0 || ^2 || ^3 || ^4"
   },
   "devDependencies": {
-    "@phosphor/application": "^1.6.0",
-    "@phosphor/widgets": "^1.6.0",
+    "@lumino/application": "^1.6.0",
+    "@lumino/widgets": "^1.6.0",
     "@types/expect.js": "^0.3.29",
     "@types/mocha": "^5.2.5",
     "@types/node": "^10.11.6",

requirements.txt

@@ -1,2 +1,2 @@
-ipywidgets~=7.7
+ipywidgets>=7.7,<9
 packaging~=21.3

src/plugin.ts

@@ -3,11 +3,11 @@
 
 import {
   Application, IPlugin
-} from '@phosphor/application';
+} from '@lumino/application';
 
 import {
   Widget
-} from '@phosphor/widgets';
+} from '@lumino/widgets';
 
 import {
   IJupyterWidgetRegistry

webpack.config.js

@@ -9,82 +9,95 @@ const rules = [
 ];
 
 // Packages that shouldn't be bundled but loaded at runtime
-const externals = ['@jupyter-widgets/base', '@jupyter-widgets/controls'];
+const externals = ['@jupyter-widgets/base', '@jupyter-widgets/controls', 'module'];
 
 const resolve = {
   // Add '.ts' and '.tsx' as resolvable extensions.
   extensions: [".webpack.js", ".web.js", ".ts", ".js"]
 };
 
-module.exports = [
-  /**
-   * Notebook extension
-   *
-   * This bundle only contains the part of the JavaScript that is run on load of
-   * the notebook.
-   */
-  {
-    entry: './src/extension.ts',
-    output: {
-      filename: 'index.js',
-      path: path.resolve(__dirname, 'ipywidgets_extended', 'nbextension', 'static'),
-      libraryTarget: 'amd'
+module.exports = (env, argv) => {
+  const devtool = argv.mode === 'development' ? 'source-map' : false;
+  return [
+    /**
+     * Notebook extension
+     *
+     * This bundle only contains the part of the JavaScript that is run on load of
+     * the notebook.
+     */
+    {
+      entry: './src/extension.ts',
+      output: {
+        filename: 'extension.js',
+        path: path.resolve(__dirname, 'ipywidgets_extended', 'nbextension', 'static'),
+        libraryTarget: 'amd'
+      },
+      devtool,
+      resolve
     },
-    module: {
-      rules: rules
-    },
-    devtool: 'source-map',
-    externals,
-    resolve,
-  },
 
-  /**
-   * Embeddable widget-periodictable bundle
-   *
-   * This bundle is almost identical to the notebook extension bundle. The only
-   * difference is in the configuration of the webpack public path for the
-   * static assets.
-   *
-   * The target bundle is always `dist/index.js`, which is the path required by
-   * the custom widget embedder.
-   */
-  {
-    entry: './src/index.ts',
-    output: {
+    {
+      entry: ['./amd-public-path.js', './src/index.ts'],
+      output: {
         filename: 'index.js',
-        path: path.resolve(__dirname, 'dist'),
+        path: path.resolve(__dirname, 'ipywidgets_extended', 'nbextension', 'static'),
         libraryTarget: 'amd',
-        library: "ipywidgets-extended",
-        publicPath: 'https://unpkg.com/ipywidgets-extended@' + version + '/dist/'
-    },
-    devtool: 'source-map',
-    module: {
+        library: 'ipywidgets-extended',
+        publicPath: '',  // Set in amd-public-path.js
+      },
+      devtool,
+      module: {
         rules: rules
+      },
+      externals,
+      resolve
     },
-    externals,
-    resolve,
-  },
 
+    /**
+     * Embeddable bundle
+     *
+     * This bundle is almost identical to the notebook extension bundle. The only
+     * difference is in the configuration of the webpack public path for the
+     * static assets.
+     */
+    {
+      entry: ['./amd-public-path.js', './src/index.ts'],
+      output: {
+          filename: 'index.js',
+          path: path.resolve(__dirname, 'dist'),
+          libraryTarget: 'amd',
+          library: "ipywidgets-extended",
+          publicPath: ''  // Set in amd-public-path.js, old='https://unpkg.com/ipywidgets-extended@' + version + '/dist/'
+      },
+      devtool,
+      module: {
+          rules: rules
+      },
+      externals,
+      resolve
+    }
 
-  /**
-   * Documentation widget bundle
-   *
-   * This bundle is used to embed widgets in the package documentation.
-   */
-  // {
-  //   entry: './src/index.ts',
-  //   output: {
-  //     filename: 'embed-bundle.js',
-  //     path: path.resolve(__dirname, 'docs', 'source', '_static'),
-  //     library: "ipywidgets-extended",
-  //     libraryTarget: 'amd'
-  //   },
-  //   module: {
-  //     rules: rules
-  //   },
-  //   devtool: 'source-map',
-  //   externals,
-  //   resolve,
-  // }
 
-];
+    /**
+     * Documentation widget bundle
+     *
+     * This bundle is used to embed widgets in the package documentation.
+     */
+    // {
+    //   entry: './src/index.ts',
+    //   output: {
+    //     filename: 'embed-bundle.js',
+    //     path: path.resolve(__dirname, 'docs', 'source', '_static'),
+    //     library: "ipywidgets-extended",
+    //     libraryTarget: 'amd'
+    //   },
+    //   module: {
+    //     rules: rules
+    //   },
+    //   devtool,
+    //   externals,
+    //   resolve,
+    // }
+
+  ];
+}