Experiment with ways a frontend can support ipywidgets 7 and 8

packages/html-manager/src/htmlmanager.ts

@@ -1,9 +1,11 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
 
-import * as widgets from '@jupyter-widgets/controls';
+import * as controls from '@jupyter-widgets/controls';
 import * as base from '@jupyter-widgets/base';
 import * as outputWidgets from './output';
+
+import { createErrorWidgetModel, ErrorWidgetView } from '@jupyter-widgets/base';
 import { ManagerBase } from '@jupyter-widgets/base-manager';
 import { MessageLoop } from '@lumino/messaging';
 
@@ -14,7 +16,12 @@ import {
 } from '@jupyterlab/rendermime';
 
 import { WidgetRenderer, WIDGET_MIMETYPE } from './output_renderers';
-import { WidgetModel, WidgetView, DOMWidgetView } from '@jupyter-widgets/base';
+
+import type {
+ WidgetModel,
+ WidgetView,
+ DOMWidgetView,
+} from '@jupyter-widgets/base';
 
 export class HTMLManager extends ManagerBase {
  constructor(options?: {
@@ -58,9 +65,9 @@ export class HTMLManager extends ManagerBase {
  } catch (error) {
  const msg = `Could not create a view for ${view}`;
  console.error(msg);
- const ModelCls = base.createErrorWidgetModel(error, msg);
+ const ModelCls = createErrorWidgetModel(error, msg);
  const errorModel = new ModelCls();
- v = new base.ErrorWidgetView({
+ v = new ErrorWidgetView({
  model: errorModel,
  });
  v.render();
@@ -106,32 +113,42 @@ export class HTMLManager extends ManagerBase {
  /**
  * Load a class and return a promise to the loaded object.
  */
- protected loadClass(
+ protected async loadClass(
  className: string,
  moduleName: string,
  moduleVersion: string
  ): Promise<typeof WidgetModel | typeof WidgetView> {
- return new Promise((resolve, reject) => {
- if (moduleName === '@jupyter-widgets/base') {
- resolve(base);
- } else if (moduleName === '@jupyter-widgets/controls') {
- resolve(widgets);
- } else if (moduleName === '@jupyter-widgets/output') {
- resolve(outputWidgets);
- } else if (this.loader !== undefined) {
- resolve(this.loader(moduleName, moduleVersion));
- } else {
- reject(`Could not load module ${moduleName}@${moduleVersion}`);
- }
- }).then((module) => {
- if ((module as any)[className]) {
- return (module as any)[className];
- } else {
- return Promise.reject(
- `Class ${className} not found in module ${moduleName}@${moduleVersion}`
- );
- }
- });
+ let module: any;
+ if (
+ moduleName === '@jupyter-widgets/base' &&
+ moduleVersion /* Some semver test??? */ === base.JUPYTER_WIDGETS_VERSION
+ ) {
+ module = base;
+ } else if (
+ moduleName === '@jupyter-widgets/controls' &&
+ moduleVersion /* Some semver test??? */ ===
+ controls.JUPYTER_CONTROLS_VERSION
+ ) {
+ module = controls;
+ } else if (
+ moduleName === '@jupyter-widgets/output' &&
+ moduleVersion /* Some semver test??? */ ===
+ outputWidgets.OUTPUT_WIDGET_VERSION
+ ) {
+ module = outputWidgets;
+ } else if (this.loader !== undefined) {
+ module = await this.loader(moduleName, moduleVersion);
+ } else {
+ throw new Error(`Could not load module ${moduleName}@${moduleVersion}`);
+ }
+
+ if ((module as any)[className]) {
+ return (module as any)[className];
+ } else {
+ throw Error(
+ `Class ${className} not found in module ${moduleName}@${moduleVersion}`
+ );
+ }
  }
 
  /**

packages/html-manager/src/libembed-amd.ts

@@ -60,7 +60,7 @@ function moduleNameToCDNUrl(moduleName: string, moduleVersion: string): string {
  *
  * The semver range is only used with the CDN.
  */
-export function requireLoader(
+export async function requireLoader(
  moduleName: string,
  moduleVersion: string
 ): Promise<any> {

packages/html-manager/src/libembed.ts

@@ -67,6 +67,7 @@ export async function renderWidgets(
  *
  * @param element The DOM element to search for widget view state script tags
  * @param widgetState The widget manager state
+ * @param managerFactory A function that returns a new HTMLManager
  *
  * #### Notes
  *

packages/html-manager/src/output.ts

@@ -13,6 +13,8 @@ import $ from 'jquery';
 
 import '../css/output.css';
 
+export const OUTPUT_WIDGET_VERSION = outputBase.OUTPUT_WIDGET_VERSION;
+
 export class OutputModel extends outputBase.OutputModel {
  defaults(): Backbone.ObjectHash {
  return {

packages/html-manager/webpack.config.js

@@ -93,4 +93,49 @@ module.exports = [
  externals: ['@jupyter-widgets/base', 'module'],
  ...options,
  },
+ {
+ // @jupyter-widgets/base
+ entry: ['./amd-public-path.js', '@jupyter-widgets/base/lib/index'],
+ output: {
+ filename: '@jupyter-widgets/base.js',
+ path: path.resolve(__dirname, 'dist'),
+ library: {
+ type: 'amd',
+ },
+ publicPath: '', // Set in amd-public-path.js
+ },
+ // 'module' is the magic requirejs dependency used to set the publicPath
+ externals: ['module'],
+ ...options,
+ },
+ {
+ // @jupyter-widgets/controls, but versioned so we can load it beside other versions of controls
+ entry: ['./amd-public-path.js', '@jupyter-widgets/controls/lib/index'],
+ output: {
+ filename: '@jupyter-widgets/controls.js',
+ path: path.resolve(__dirname, 'dist'),
+ library: {
+ type: 'amd',
+ },
+ publicPath: '', // Set in amd-public-path.js
+ },
+ // 'module' is the magic requirejs dependency used to set the publicPath
+ externals: ['@jupyter-widgets/base', 'module'],
+ ...options,
+ },
+ {
+ // @jupyter-widgets/html-manager
+ entry: ['./amd-public-path.js', './lib/index.js'],
+ output: {
+ filename: '@jupyter-widgets/html-manager.js',
+ path: path.resolve(__dirname, 'dist'),
+ library: {
+ type: 'amd',
+ },
+ publicPath: '', // Set in amd-public-path.js
+ },
+ // 'module' is the magic requirejs dependency used to set the publicPath
+ externals: ['@jupyter-widgets/base', '@jupyter-widgets/controls', 'module'],
+ ...options,
+ },
 ];

python/ipywidgets/ipywidgets/widgets/widget.py

@@ -345,7 +345,32 @@ def _handle_control_comm_msg(cls, msg):
  states=full_state,
  buffer_paths=buffer_paths
  ), buffers=buffers)
-
+ elif method == 'request_registered':
+ # Send back registered widgets
+ registered = []
+ filter = data.get('filter', {})
+ filter_list = (
+ filter.get('model_module', None),
+ filter.get('model_version', None),
+ filter.get('model_name', None),
+ filter.get('view_module', None),
+ filter.get('view_version', None),
+ filter.get('view_name', None)
+ )
+ for info, _ in cls._widget_types.items():
+ if all(f is None or f == v for f, v in zip(filter, info)):
+ registered.append(dict(
+ model_module=info[0],
+ model_version=info[1],
+ model_name=info[2],
+ view_module=info[3],
+ view_version=info[4],
+ view_name=info[5]
+ ))
+ cls._control_comm.send(dict(
+ method='reply_registered',
+ registered=registered
+ ))
  else:
  raise RuntimeError('Unknown front-end to back-end widget control msg with method "%s"' % method)