refactor: use simpler HMR setup for anywidget

packages/widget/README.md

@@ -14,10 +14,10 @@ To activate the environment, run `hatch shell`.
 
 This should install the widget in development mode so you can start Jupyter.
 
-You can start Jupyter with `jupyter lab --notebook-dir=../../dev/notebooks`. If you cannot import the widget module, make sure that your Jupyter uses the right environment. You can add your environment to Jupyter by running `python -m ipykernel install --user --name=mosaic` and then select `mosaic` in the Jupyter environment dropdown.
+You can start Jupyter with `ANYWIDGET_HMR=1 jupyter lab --notebook-dir=../../dev/notebooks`. If you cannot import the widget module, make sure that your Jupyter uses the right environment. You can add your environment to Jupyter by running `python -m ipykernel install --user --name=mosaic` and then select `mosaic` in the Jupyter environment dropdown.
 
-Run `npm run build` to build the widget JavaScript code. If you want to live edit the widget code, run `npm run dev` in a separate terminal and change `_DEV = False` to `_DEV = True` inside `mosaic_widget/__init__.py`.
+Run `npm run build` to build the widget JavaScript code. If you want to live edit the widget code, run `npm run dev` in a separate terminal.
 
 ## Publishing
 
-First, make sure that you set `_DEV = False`. Run the build with `npm run build` and `hatch build`. Then publish with `hatch publish`. We publish using tokens so when asked, set the username to `__token__` and then use your token as the password. Alternatively, create a [`.pypirc` file](https://packaging.python.org/en/latest/guides/distributing-packages-using-setuptools/#create-an-account).
+Run the build with `npm run build` and `hatch build`. Then publish with `hatch publish`. We publish using tokens so when asked, set the username to `__token__` and then use your token as the password. Alternatively, create a [`.pypirc` file](https://packaging.python.org/en/latest/guides/distributing-packages-using-setuptools/#create-an-account).

packages/widget/mosaic_widget/__init__.py

@@ -12,24 +12,12 @@
 logger = logging.getLogger(__name__)
 logger.addHandler(logging.NullHandler())
 
-_DEV = False # switch to False for production
-
 SLOW_QUERY_THRESHOLD = 5000
 
-if _DEV:
- # from `npm run dev`
- ESM = "http://localhost:5173/src/index.js?anywidget"
- CSS = ""
-else:
- # from `npm run build`
- bundled_assets_dir = pathlib.Path(__file__).parent / "static"
- ESM = bundled_assets_dir / "index.js"
- CSS = bundled_assets_dir / "style.css"
-
 
 class MosaicWidget(anywidget.AnyWidget):
- _esm = ESM
- _css = CSS
+ _esm = pathlib.Path(__file__).parent / "static" / "index.js"
+ _css = pathlib.Path(__file__).parent / "static" / "index.css"
 
  # The Mosaic specification
  spec = traitlets.Dict({}).tag(sync=True)

packages/widget/package.json

@@ -10,8 +10,8 @@
  "url": "https://github.com/uwdata/mosaic.git"
  },
  "scripts": {
- "build": "vite build",
- "dev": "vite",
+ "build": "esbuild --bundle --format=esm --outdir=mosaic_widget/static src/index.js",
+ "dev": "npm run build -- --watch",
  "test": "tsc -p jsconfig.json",
  "lint": "eslint src",
  "prepublishOnly": "rimraf dist && mkdir dist && npm run test && npm run lint && hatch fmt --check && npm run build && hatch build",
@@ -25,7 +25,6 @@
  "uuid": "^10.0.0"
  },
  "devDependencies": {
- "@anywidget/vite": "^0.2.0",
  "anywidget": "^0.9.13"
  }
 }

packages/widget/pyproject.toml

@@ -27,7 +27,8 @@ artifacts = [
 dev = [
  "jupyterlab",
  "pandas",
- "pyyaml"
+ "pyyaml",
+ "watchfiles"
 ]
 
 [tool.hatch.envs.default]