From 8cec739ce5d1311150bd8d2554f7efab8c9194d2 Mon Sep 17 00:00:00 2001
From: "Ahmad K. Bawaneh" <ahmad.bawaneh@dominokit.com>
Date: Sat, 13 Aug 2022 01:45:53 +0300
Subject: [PATCH 1/6] Update DeepHavenJsApiLinker to allow exporting GWT
 JsTypes as ES6 module

---
 .../deephaven/web/DeephavenJsApiLinker.java   | 45 ++++++++++++-------
 .../web/DeephavenJsApiLinkerTemplate.js       | 31 +++++++++++++
 .../java/io/deephaven/web/public/console.html |  7 +--
 .../java/io/deephaven/web/public/format.html  |  6 +--
 .../java/io/deephaven/web/public/freeze.html  |  8 ++--
 .../java/io/deephaven/web/public/index.html   |  1 -
 .../io/deephaven/web/public/input_table.html  | 10 +++--
 .../io/deephaven/web/public/linked/child.html | 18 ++++----
 .../io/deephaven/web/public/linked/index.html | 15 ++++---
 .../web/public/persistentquery_figures.html   | 17 +++----
 .../java/io/deephaven/web/public/rollup.html  |  4 +-
 .../java/io/deephaven/web/public/search.html  | 22 ++++-----
 .../java/io/deephaven/web/public/simple.html  |  7 +--
 .../io/deephaven/web/public/snapshot.html     | 19 ++++----
 .../io/deephaven/web/public/table_basic.html  |  7 +--
 .../io/deephaven/web/public/table_batch.html  | 27 +++++------
 .../deephaven/web/public/table_columns.html   | 20 ++++-----
 .../io/deephaven/web/public/table_filter.html | 17 +++----
 .../io/deephaven/web/public/table_sort.html   | 13 +++---
 .../web/public/table_subscription.html        | 19 ++++----
 .../deephaven/web/public/table_viewport.html  |  9 ++--
 .../io/deephaven/web/public/tablemap.html     | 18 ++++----
 .../deephaven/web/public/totals_tables.html   |  8 ++--
 .../java/io/deephaven/web/public/treegrid.js  | 12 ++---
 .../io/deephaven/web/public/treetable.html    | 16 ++++---
 25 files changed, 219 insertions(+), 157 deletions(-)
 create mode 100644 web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js

diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
index 501ffc28ab4..7383b210a49 100644
--- a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
@@ -9,7 +9,9 @@
 import com.google.gwt.core.ext.linker.*;
 import com.google.gwt.dev.About;
 import com.google.gwt.dev.util.DefaultTextOutput;
+import com.google.gwt.util.tools.Utility;
 
+import java.io.IOException;
 import java.util.Set;
 
 /**
@@ -35,8 +37,6 @@ public ArtifactSet link(TreeLogger logger, LinkerContext context, ArtifactSet ar
 
         ArtifactSet toReturn = new ArtifactSet(artifacts);
         DefaultTextOutput out = new DefaultTextOutput(true);
-        out.print("(function(){");
-        out.newline();
 
         // get compilation result
         Set<CompilationResult> results = artifacts.find(CompilationResult.class);
@@ -54,23 +54,38 @@ public ArtifactSet link(TreeLogger logger, LinkerContext context, ArtifactSet ar
 
         // get the generated javascript
         String[] javaScript = result.getJavaScript();
-        out.print("self.dh = {}");
-        out.newline();
-        out.print("var $wnd = self, $doc, $entry, $moduleName, $moduleBase;");
-        out.newline();
-        out.print("var $gwt_version = \"" + About.getGwtVersionNum() + "\";");
-        out.newlineOpt();
-        out.print(javaScript[0]);
-        out.newline();
 
-        out.print("gwtOnLoad(null,'" + context.getModuleName() + "',null);");
-        out.newline();
-        out.print("})();");
-        out.newline();
+        StringBuffer buffer = readFileToStringBuffer(getSelectionScriptTemplate(), logger);
+        replaceAll(buffer, "__GWT_VERSION__",  About.getGwtVersionNum());
+        replaceAll(buffer, "__JAVASCRIPT_RESULT__",  javaScript[0]);
+        replaceAll(buffer, "__MODULE_NAME__",  context.getModuleName());
+
+        out.print(buffer.toString());
 
         toReturn.add(emitString(logger, out.toString(), "dh-core.js"));
 
         return toReturn;
     }
-
+    protected StringBuffer readFileToStringBuffer(String filename,
+                                                  TreeLogger logger) throws UnableToCompleteException {
+        StringBuffer buffer;
+        try {
+            buffer = new StringBuffer(Utility.getFileFromClassPath(filename));
+        } catch (IOException e) {
+            logger.log(TreeLogger.ERROR, "Unable to read file: " + filename, e);
+            throw new UnableToCompleteException();
+        }
+        return buffer;
+    }
+    protected String getSelectionScriptTemplate(){
+        return "io/deephaven/web/DeephavenJsApiLinkerTemplate.js";
+    }
+    protected static void replaceAll(StringBuffer buf, String search,
+                                     String replace) {
+        int len = search.length();
+        for (int pos = buf.indexOf(search); pos >= 0; pos = buf.indexOf(search,
+                pos + 1)) {
+            buf.replace(pos, pos + len, replace);
+        }
+    }
 }
diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
new file mode 100644
index 00000000000..721f777781a
--- /dev/null
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
@@ -0,0 +1,31 @@
+function bindTo(target, source) {
+    var descriptors = Object.getOwnPropertyDescriptors(source);
+    for (var key in descriptors) {
+        if (!(key[0].toUpperCase() === key[0])) {
+            var descriptor = descriptors[key];
+            if (typeof (descriptor.value) === 'function') {
+                descriptor.value = descriptor.value.bind(source)
+            } else if (typeof (descriptor.get) === 'function') {
+                descriptor.get = descriptor.get.bind(source);
+            }
+        }
+    }
+    Object.defineProperties(target, descriptors);
+}
+
+var Scope = function () {
+};
+Scope.prototype = self;
+var $doc, $entry, $moduleName, $moduleBase;
+var $wnd = new Scope();
+bindTo($wnd, self);
+
+var dh = {}
+$wnd.dh = dh;
+
+var $gwt_version = "__GWT_VERSION__";
+
+__JAVASCRIPT_RESULT__
+
+gwtOnLoad(null, '__MODULE_NAME__', null);
+export {dh};
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/console.html b/web/client-api/src/main/java/io/deephaven/web/public/console.html
index 5b5a3d5dfe3..b964a67a84e 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/console.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/console.html
@@ -5,20 +5,21 @@
 
     <title>Deephaven JS API Console Interaction</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 <div id="logs"></div>
 <div id="tools">
     <textarea id="command" placeholder="waiting for connection..." rows="1" cols="80" autofocus="autofocus" disabled="disabled" style="resize:vertical"></textarea><button id="run">Run</button>
 </div>
-<script type="text/javascript">
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
     var connection;
     var ide;
     var table;
     (async () => {
         // create a connection to the server
-        connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+        connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
         // check if a language was specified
         var url = new URL(window.location);
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/format.html b/web/client-api/src/main/java/io/deephaven/web/public/format.html
index 4731a698fe0..39773e2e018 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/format.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/format.html
@@ -4,7 +4,6 @@
     <meta charset="UTF-8">
     <title>Deephaven Web API Formatting examples</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <style>
         .console {
             max-height: 200px;
@@ -73,9 +72,8 @@ <h4>Sample format strings (click to replace the current format)</h4>
         </ul>
     </div>
 </div>
-<script>
-
-
+<script type="module">
+    import {dh} from './dh-core.js';
   document.querySelectorAll(".section").forEach(section => {
     var patternInput = section.querySelector('.pattern');
     // wire up predefined templates
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
index 7e7a98524e1..75ba7411374 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table freeze</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -40,8 +39,9 @@ <h3>Selected table data</h3>
 <button id="next_frozen">&gt;</button>
 <button id="end_frozen">&gt;&gt;</button>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
@@ -49,7 +49,7 @@ <h3>Selected table data</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
+    window.c = new Client(url.href);
     c.addEventListener(dh.Client.EVENT_CONNECT, () => {
         connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/index.html b/web/client-api/src/main/java/io/deephaven/web/public/index.html
index ac74f8ed12f..44e429fafa1 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/index.html
@@ -5,7 +5,6 @@
 
     <title>Deephaven JS API samples</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 Welcome to the Deephaven JS API. This page has the api loaded, open the browser console to interact with the server.
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
index 2174add5000..962bafb9a20 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
@@ -4,7 +4,6 @@
   <meta charset="utf-8" />
   <title>Deephaven Web API table viewport and updates</title>
   <script src="dh-internal.js" type="text/javascript"></script>
-  <script src="dh-core.js" type="text/javascript"></script>
   <script src="input_tables.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <style>
@@ -34,7 +33,10 @@ <h3>Table data (bold headers are keys)</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
+<script type="module">
+  import {dh} from './dh-core.js'
+  const {IdeConnection, Table} = dh;
+
   var table, inputTable;
   var connection;
   var ide;
@@ -43,7 +45,7 @@ <h3>Table data (bold headers are keys)</h3>
   var currentOffset;
   var PAGE_SIZE = 20;
   (async () => {
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
     var types = await connection.getConsoleTypes();
     if (types.indexOf("python") !== -1) {
@@ -135,7 +137,7 @@ <h3>Table data (bold headers are keys)</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = t.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = t.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
index b4102876cc1..abd6e2e2272 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: child window</title>
     <script src="../dh-internal.js" type="text/javascript"></script>
-    <script src="../dh-core.js" type="text/javascript"></script>
     <link href="../basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -26,7 +25,10 @@ <h3>Outgoing link summary</h3>
 
 </ul>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, FilterValue, Table} = dh;
+
   if (!window.opener) {
     alert("This page only works correctly when opened by another window.");
     throw "This page only works correctly when opened by another window.";
@@ -43,14 +45,14 @@ <h3>Outgoing link summary</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
     });
   });
   //wait for the named config to load
-  c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+  c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
     var config = event.detail;
     if (config.name === configName) {
       if (config.status !== 'Running') {
@@ -136,9 +138,9 @@ <h3>Outgoing link summary</h3>
 
               // wrap the data so that we can handle it as a filter value
               if (typeof valueToFilterOn === 'string') {
-                valueToFilterOn = dh.FilterValue.ofString(valueToFilterOn);
+                valueToFilterOn = FilterValue.ofString(valueToFilterOn);
               } else {
-                valueToFilterOn = dh.FilterValue.ofNumber(valueToFilterOn);
+                valueToFilterOn = FilterValue.ofNumber(valueToFilterOn);
               }
 
               // apply a new filter (could also present a menu at this point to ask which filter to use)
@@ -166,7 +168,7 @@ <h3>Outgoing link summary</h3>
     simpleLinkedTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simpleLinkedTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
index ef44c9820a7..965767cb0bc 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: parent window</title>
     <script src="../dh-internal.js" type="text/javascript"></script>
-    <script src="../dh-core.js" type="text/javascript"></script>
     <style>
         p, ul {
             max-width: 800px;
@@ -68,7 +67,9 @@ <h3>Persistent Query Configurations</h3>
 <ul id="queries">
 
 </ul>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -76,8 +77,8 @@ <h3>Persistent Query Configurations</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -88,14 +89,14 @@ <h3>Persistent Query Configurations</h3>
   var configs = Object.create(null);
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
index caea1a0bd36..302483ee4cf 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API Plotting sample</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -22,7 +21,9 @@ <h5>Series</h5>
 <div id="series"></div>
 <div id="data"></div>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
@@ -30,8 +31,8 @@ <h5>Series</h5>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -42,14 +43,14 @@ <h5>Series</h5>
     var configs = Object.create(null);
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -71,7 +72,7 @@ <h5>Series</h5>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
index ef2fa6e0a2a..5f106435baa 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API rollup table example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <script src="treegrid.js" type="text/javascript"></script>
     <script src="totals.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
@@ -72,7 +71,8 @@ <h3>Rollup Table Configuration</h3>
 <input id="includeConstituents" type="checkbox"><label for="includeConstituents">Include Constituent values</label><br/>
 <button id="open">Display Rollup Table</button>
 <div id="treetable"></div>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js'
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/search.html b/web/client-api/src/main/java/io/deephaven/web/public/search.html
index c3ff25f0b47..300f4b79d95 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/search.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/search.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API Search example through OR'd contains operations</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -27,8 +26,9 @@ <h3>Selected table data</h3>
 
 </table>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -36,8 +36,8 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -48,14 +48,14 @@ <h3>Selected table data</h3>
   var configs = Object.create(null);
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -77,7 +77,7 @@ <h3>Selected table data</h3>
       queryElt.onclick = () => {
         open = !open;
         queryElt.className = open ? 'open' : 'closed';
-        queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+        queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
           if (event.detail.nanos === -1) {
             console.log(event.detail.type);
           } else {
@@ -128,7 +128,7 @@ <h3>Selected table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -168,7 +168,7 @@ <h3>Selected table data</h3>
     if (needle === null || needle.trim().length === 0) {
       currentTable.applyFilter([]);
     } else {
-      currentTable.applyFilter([dh.FilterCondition.search(dh.FilterValue.ofString(needle))]);
+      currentTable.applyFilter([FilterCondition.search(FilterValue.ofString(needle))]);
     }
     currentTable.setViewport(0, 24);
   }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/simple.html b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
index d4e851bcc14..abf0a185570 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/simple.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
@@ -5,7 +5,6 @@
 
     <title>Simple Deephaven JS Client</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 <h3>Simple test page to verify that the Deephaven JS API can connect, create a table, and subscribe to changes</h3>
@@ -13,11 +12,13 @@ <h3>Simple test page to verify that the Deephaven JS API can connect, create a t
     When the page loads, a connection to the server will be created, and a new ticking table declared. Read the source
     for this page to see how it was created.
 </p>
-<script type="text/javascript">
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
 var ide;
 var table;
 (async () => {
-    var connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    var connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
     var consoleTypes = await connection.getConsoleTypes();
     ide = await connection.startSession(consoleTypes[0]);
     document.body.append("session created", document.createElement("br"));
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
index ef2e5185c14..5d009ffcba5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table snapshot</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -69,7 +68,9 @@ <h3>Snapshot table</h3>
     </tr>
 </table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
 
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
@@ -78,8 +79,8 @@ <h3>Snapshot table</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -96,14 +97,14 @@ <h3>Snapshot table</h3>
     var doInitialSnapshotInput = document.getElementById('doInitialSnapshotInput');
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -132,7 +133,7 @@ <h3>Snapshot table</h3>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
@@ -188,7 +189,7 @@ <h3>Snapshot table</h3>
         tableElement.appendChild(header);
 
         // listen for items to be added, populate the table body
-        handleCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        handleCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
             var tbody = tableElement.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
index 93c838dd5a4..983e9981605 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API display basic table</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
@@ -17,14 +16,16 @@
 <h3>Table data</h3>
 <table id="simpleTable"></table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
 var table;
 var connection;
 var ide;
 
 (async () => {
     // Open a connection to the server
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
 
     var types = await connection.getConsoleTypes();
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
index 95767f725da..3da1fc1a00c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
@@ -4,7 +4,6 @@
   <meta charset="utf-8" />
   <title>Deephaven Web API table filter api</title>
   <script src="dh-internal.js" type="text/javascript"></script>
-  <script src="dh-core.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <script src="batch.js" type="text/javascript"></script>
 </head>
@@ -32,7 +31,9 @@ <h3>Selected table data</h3>
 
 </table>
 
-<script>
+<script type="module">
+  import {dh} from './dh-core.js';
+  const {Client, FilterValue} = dh;
 
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
@@ -41,8 +42,8 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -61,14 +62,14 @@ <h3>Selected table data</h3>
   const heads = [];
   window.dhDebug = { pendingSorts, pendingFilters };
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -90,7 +91,7 @@ <h3>Selected table data</h3>
       queryElt.onclick = () => {
         open = !open;
         queryElt.className = open ? 'open' : 'closed';
-        queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+        queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
           if (event.detail.nanos === -1) {
             console.log(event.detail.type);
           } else {
@@ -146,7 +147,7 @@ <h3>Selected table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -275,10 +276,10 @@ <h3>Selected table data</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -289,10 +290,10 @@ <h3>Selected table data</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
index 8248a272229..174e8a235d1 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
@@ -4,7 +4,6 @@
 <meta charset="utf-8" />
 <title>Deephaven Web API table custom columns</title>
 <script src="dh-internal.js" type="text/javascript"></script>
-<script src="dh-core.js" type="text/javascript"></script>
 <link href="basic.css" rel="stylesheet" type="text/css" />
 <style>
     li.open ul { display:block; }
@@ -36,8 +35,9 @@ <h3>Add a new Column with a formula</h3>
 
 </ul>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
       url.protocol = 'ws:';
@@ -45,8 +45,8 @@ <h3>Add a new Column with a formula</h3>
       url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
       connected();
       c.login({username:'dh',token:'dh',type:'password'}).then(result => {
         console.log("login successful");
@@ -57,14 +57,14 @@ <h3>Add a new Column with a formula</h3>
     var configs = Object.create(null);
 
     function connected() {
-      c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+      c.addEventListener(Client.EVENT_CONIG_REMOVED, event => {
         removeQuery(event.detail);
       });
-      c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+      c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
         removeQuery(event.detail);
         addQuery(event.detail);
       });
-      c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+      c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
         addQuery(event.detail);
       });
       function removeQuery(queryInfo) {
@@ -86,7 +86,7 @@ <h3>Add a new Column with a formula</h3>
         queryElt.onclick = () => {
           open = !open;
           queryElt.className = open ? 'open' : 'closed';
-          queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+          queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
             if (event.detail.nanos === -1) {
               console.log(event.detail.type);
             } else {
@@ -129,7 +129,7 @@ <h3>Add a new Column with a formula</h3>
         simplePagingTable.appendChild(header);
 
         // listen for items to be added, populate the table body
-        oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
 
             //since we're adding custom columns too, let's rebuild the header as well
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
index 7a1ae59c055..f441cf3ea5b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table filter api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -53,7 +52,9 @@ <h3>Filter Details</h3>
 <div id="topMenu">
 </div>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection, Table, FilterValue} = dh;
 
   var filterSetup = {
     "Equals..." : {
@@ -151,7 +152,7 @@ <h3>Filter Details</h3>
   var topMenu = document.getElementById('topMenu');
 
   (async () => {
-      connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+      connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
       var types = await connection.getConsoleTypes();
 
@@ -190,7 +191,7 @@ <h3>Filter Details</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = t.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = t.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -270,10 +271,10 @@ <h3>Filter Details</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -284,10 +285,10 @@ <h3>Filter Details</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
index 085bd3b3b98..61921f45d84 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table sort api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
   </head>
   <body>
@@ -16,14 +15,16 @@ <h3>Selected table data (click headers to sort)</h3>
     <button id="clear">Clear Reverse</button>
     <table id="simplePagingTable"></table>
 
-    <script>
+    <script type="module">
+      import {dh} from './dh-core.js';
+      const {IdeConnection, Table} = dh;
       var connection;
       var ide;
       var table;
       var oldTableHandlerCleanup;
       var simplePagingTable = document.getElementById("simplePagingTable");
       (async () => {
-        connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+        connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
         var types = await connection.getConsoleTypes();
 
@@ -86,7 +87,7 @@ <h3>Selected table data (click headers to sort)</h3>
 
         // listen for items to be added, populate the table body
         oldTableHandlerCleanup = t.addEventListener(
-          dh.Table.EVENT_UPDATED,
+          Table.EVENT_UPDATED,
           function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
@@ -116,7 +117,7 @@ <h3>Selected table data (click headers to sort)</h3>
           const sorts = table.sort.filter(
             s => s.direction !== "REVERSE"
           );
-          sorts.unshift(dh.Table.reverse());
+          sorts.unshift(Table.reverse());
           table.applySort(sorts);
           table.setViewport(0, 49);
         };
@@ -125,7 +126,7 @@ <h3>Selected table data (click headers to sort)</h3>
           const sorts = table.sort.filter(
             s => s.direction !== "REVERSE"
           );
-          sorts.push(dh.Table.reverse());
+          sorts.push(Table.reverse());
           table.applySort(sorts);
           table.setViewport(0, 49);
         };
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
index ab2f560f81f..817788e4bf0 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table viewport and updates</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -50,7 +49,9 @@ <h3>Table data</h3>
 
 </table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, QueryInfo, Table} = dh;
 
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
@@ -59,8 +60,8 @@ <h3>Table data</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -71,14 +72,14 @@ <h3>Table data</h3>
     var configs = Object.create(null);
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -100,7 +101,7 @@ <h3>Table data</h3>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
@@ -177,7 +178,7 @@ <h3>Table data</h3>
         tableData.appendChild(header);
 
         // listen for items to be added, populate the table body
-        oldTableHandlerCleanup = subscription.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        oldTableHandlerCleanup = subscription.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
             var tbody = tableData.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
index 8f610c4cc68..e62ff6d11a5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API table viewport and updates</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
@@ -22,7 +21,9 @@ <h3>Table data</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection, Table} = dh;
 var table;
 var connection;
 var ide;
@@ -31,7 +32,7 @@ <h3>Table data</h3>
 var currentOffset;
 var PAGE_SIZE = 20;
 (async () => {
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
     var types = await connection.getConsoleTypes();
 
     if (types.indexOf("python") !== -1) {
@@ -94,7 +95,7 @@ <h3>Table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
         console.log("update event received, time to redraw data");
         // rebuild the current tbody from scratch
         var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
index 11880b87239..a9db5519c1c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API TableMap api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -27,8 +26,9 @@ <h3 id="activeTableKey"></h3>
 
 </table>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, Table} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -36,8 +36,8 @@ <h3 id="activeTableKey"></h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -50,14 +50,14 @@ <h3 id="activeTableKey"></h3>
   var keyList = document.getElementById('keyList');
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -149,7 +149,7 @@ <h3 id="activeTableKey"></h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
index 292ae2e5541..e778eb101d8 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API Totals Tables example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -32,8 +31,9 @@ <h3>Selected table data</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -41,7 +41,7 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
+  window.c = new Client(url.href);
   c.addEventListener(dh.Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
index 3466a596957..303431107af 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
@@ -1,3 +1,5 @@
+import {dh} from './dh-core.js';
+const {Table, FilterValue} = dh;
 /**
  * Simple es6 class encapsulating some basic rendering for a tree table in a grid, allowing
  * expanding and collapsing nodes, and filtering and sorting columns.
@@ -5,7 +7,7 @@
 class TreeGrid {
   constructor(treeTable) {
     this.treeTable = treeTable;
-    this.treeTable.addEventListener(dh.Table.EVENT_UPDATED, e => this.repaint(e.detail));
+    this.treeTable.addEventListener(Table.EVENT_UPDATED, e => this.repaint(e.detail));
 
     this.rootElement = document.createElement('table');
     this.rootElement.addEventListener('click', e => this.toggle(e));
@@ -176,10 +178,10 @@ class TreeGrid {
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -190,10 +192,10 @@ class TreeGrid {
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
index 126d07c8df3..d582d5933bf 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
@@ -4,8 +4,7 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API tree table example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
-    <script src="treegrid.js" type="text/javascript"></script>
+    <script src="treegrid.js" type="module"></script>
     <script src="totals.js" type="text/javascript"></script>
 
     <link href="basic.css" rel="stylesheet" type="text/css" />
@@ -16,22 +15,25 @@
     </style>
 </head>
 <body>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
+
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
   } else {
     url.protocol = 'wss:';
   }
-  var c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  var c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
   });

From 24c2b4222fdc6eed77909523dfa554915f6ad0f4 Mon Sep 17 00:00:00 2001
From: "Ahmad K. Bawaneh" <ahmad.bawaneh@dominokit.com>
Date: Sat, 13 Aug 2022 01:45:53 +0300
Subject: [PATCH 2/6] Update DeepHavenJsApiLinker to allow exporting GWT
 JsTypes as ES6 module

---
 .../deephaven/web/DeephavenJsApiLinker.java   | 48 +++++++++++++------
 .../web/DeephavenJsApiLinkerTemplate.js       | 31 ++++++++++++
 .../java/io/deephaven/web/public/console.html |  7 +--
 .../java/io/deephaven/web/public/format.html  |  6 +--
 .../java/io/deephaven/web/public/freeze.html  |  8 ++--
 .../java/io/deephaven/web/public/index.html   |  1 -
 .../io/deephaven/web/public/input_table.html  | 10 ++--
 .../io/deephaven/web/public/linked/child.html | 18 +++----
 .../io/deephaven/web/public/linked/index.html | 15 +++---
 .../web/public/persistentquery_figures.html   | 17 +++----
 .../java/io/deephaven/web/public/rollup.html  |  4 +-
 .../java/io/deephaven/web/public/search.html  | 22 ++++-----
 .../java/io/deephaven/web/public/simple.html  |  7 +--
 .../io/deephaven/web/public/snapshot.html     | 19 ++++----
 .../io/deephaven/web/public/table_basic.html  |  7 +--
 .../io/deephaven/web/public/table_batch.html  | 27 ++++++-----
 .../deephaven/web/public/table_columns.html   | 20 ++++----
 .../io/deephaven/web/public/table_filter.html | 17 +++----
 .../io/deephaven/web/public/table_sort.html   | 13 ++---
 .../web/public/table_subscription.html        | 19 ++++----
 .../deephaven/web/public/table_viewport.html  |  9 ++--
 .../io/deephaven/web/public/tablemap.html     | 18 +++----
 .../deephaven/web/public/totals_tables.html   |  8 ++--
 .../java/io/deephaven/web/public/treegrid.js  | 12 +++--
 .../io/deephaven/web/public/treetable.html    | 16 ++++---
 25 files changed, 222 insertions(+), 157 deletions(-)
 create mode 100644 web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js

diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
index 501ffc28ab4..c842b2b5304 100644
--- a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
@@ -9,7 +9,9 @@
 import com.google.gwt.core.ext.linker.*;
 import com.google.gwt.dev.About;
 import com.google.gwt.dev.util.DefaultTextOutput;
+import com.google.gwt.util.tools.Utility;
 
+import java.io.IOException;
 import java.util.Set;
 
 /**
@@ -35,8 +37,6 @@ public ArtifactSet link(TreeLogger logger, LinkerContext context, ArtifactSet ar
 
         ArtifactSet toReturn = new ArtifactSet(artifacts);
         DefaultTextOutput out = new DefaultTextOutput(true);
-        out.print("(function(){");
-        out.newline();
 
         // get compilation result
         Set<CompilationResult> results = artifacts.find(CompilationResult.class);
@@ -54,23 +54,41 @@ public ArtifactSet link(TreeLogger logger, LinkerContext context, ArtifactSet ar
 
         // get the generated javascript
         String[] javaScript = result.getJavaScript();
-        out.print("self.dh = {}");
-        out.newline();
-        out.print("var $wnd = self, $doc, $entry, $moduleName, $moduleBase;");
-        out.newline();
-        out.print("var $gwt_version = \"" + About.getGwtVersionNum() + "\";");
-        out.newlineOpt();
-        out.print(javaScript[0]);
-        out.newline();
-
-        out.print("gwtOnLoad(null,'" + context.getModuleName() + "',null);");
-        out.newline();
-        out.print("})();");
-        out.newline();
+
+        StringBuffer buffer = readFileToStringBuffer(getSelectionScriptTemplate(), logger);
+        replaceAll(buffer, "__GWT_VERSION__", About.getGwtVersionNum());
+        replaceAll(buffer, "__JAVASCRIPT_RESULT__", javaScript[0]);
+        replaceAll(buffer, "__MODULE_NAME__", context.getModuleName());
+
+        out.print(buffer.toString());
 
         toReturn.add(emitString(logger, out.toString(), "dh-core.js"));
 
         return toReturn;
     }
 
+    protected StringBuffer readFileToStringBuffer(String filename,
+            TreeLogger logger) throws UnableToCompleteException {
+        StringBuffer buffer;
+        try {
+            buffer = new StringBuffer(Utility.getFileFromClassPath(filename));
+        } catch (IOException e) {
+            logger.log(TreeLogger.ERROR, "Unable to read file: " + filename, e);
+            throw new UnableToCompleteException();
+        }
+        return buffer;
+    }
+
+    protected String getSelectionScriptTemplate() {
+        return "io/deephaven/web/DeephavenJsApiLinkerTemplate.js";
+    }
+
+    protected static void replaceAll(StringBuffer buf, String search,
+            String replace) {
+        int len = search.length();
+        for (int pos = buf.indexOf(search); pos >= 0; pos = buf.indexOf(search,
+                pos + 1)) {
+            buf.replace(pos, pos + len, replace);
+        }
+    }
 }
diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
new file mode 100644
index 00000000000..721f777781a
--- /dev/null
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
@@ -0,0 +1,31 @@
+function bindTo(target, source) {
+    var descriptors = Object.getOwnPropertyDescriptors(source);
+    for (var key in descriptors) {
+        if (!(key[0].toUpperCase() === key[0])) {
+            var descriptor = descriptors[key];
+            if (typeof (descriptor.value) === 'function') {
+                descriptor.value = descriptor.value.bind(source)
+            } else if (typeof (descriptor.get) === 'function') {
+                descriptor.get = descriptor.get.bind(source);
+            }
+        }
+    }
+    Object.defineProperties(target, descriptors);
+}
+
+var Scope = function () {
+};
+Scope.prototype = self;
+var $doc, $entry, $moduleName, $moduleBase;
+var $wnd = new Scope();
+bindTo($wnd, self);
+
+var dh = {}
+$wnd.dh = dh;
+
+var $gwt_version = "__GWT_VERSION__";
+
+__JAVASCRIPT_RESULT__
+
+gwtOnLoad(null, '__MODULE_NAME__', null);
+export {dh};
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/console.html b/web/client-api/src/main/java/io/deephaven/web/public/console.html
index 5b5a3d5dfe3..b964a67a84e 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/console.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/console.html
@@ -5,20 +5,21 @@
 
     <title>Deephaven JS API Console Interaction</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 <div id="logs"></div>
 <div id="tools">
     <textarea id="command" placeholder="waiting for connection..." rows="1" cols="80" autofocus="autofocus" disabled="disabled" style="resize:vertical"></textarea><button id="run">Run</button>
 </div>
-<script type="text/javascript">
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
     var connection;
     var ide;
     var table;
     (async () => {
         // create a connection to the server
-        connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+        connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
         // check if a language was specified
         var url = new URL(window.location);
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/format.html b/web/client-api/src/main/java/io/deephaven/web/public/format.html
index 4731a698fe0..39773e2e018 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/format.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/format.html
@@ -4,7 +4,6 @@
     <meta charset="UTF-8">
     <title>Deephaven Web API Formatting examples</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <style>
         .console {
             max-height: 200px;
@@ -73,9 +72,8 @@ <h4>Sample format strings (click to replace the current format)</h4>
         </ul>
     </div>
 </div>
-<script>
-
-
+<script type="module">
+    import {dh} from './dh-core.js';
   document.querySelectorAll(".section").forEach(section => {
     var patternInput = section.querySelector('.pattern');
     // wire up predefined templates
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
index 7e7a98524e1..75ba7411374 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table freeze</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -40,8 +39,9 @@ <h3>Selected table data</h3>
 <button id="next_frozen">&gt;</button>
 <button id="end_frozen">&gt;&gt;</button>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
@@ -49,7 +49,7 @@ <h3>Selected table data</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
+    window.c = new Client(url.href);
     c.addEventListener(dh.Client.EVENT_CONNECT, () => {
         connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/index.html b/web/client-api/src/main/java/io/deephaven/web/public/index.html
index ac74f8ed12f..44e429fafa1 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/index.html
@@ -5,7 +5,6 @@
 
     <title>Deephaven JS API samples</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 Welcome to the Deephaven JS API. This page has the api loaded, open the browser console to interact with the server.
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
index 2174add5000..962bafb9a20 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
@@ -4,7 +4,6 @@
   <meta charset="utf-8" />
   <title>Deephaven Web API table viewport and updates</title>
   <script src="dh-internal.js" type="text/javascript"></script>
-  <script src="dh-core.js" type="text/javascript"></script>
   <script src="input_tables.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <style>
@@ -34,7 +33,10 @@ <h3>Table data (bold headers are keys)</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
+<script type="module">
+  import {dh} from './dh-core.js'
+  const {IdeConnection, Table} = dh;
+
   var table, inputTable;
   var connection;
   var ide;
@@ -43,7 +45,7 @@ <h3>Table data (bold headers are keys)</h3>
   var currentOffset;
   var PAGE_SIZE = 20;
   (async () => {
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
     var types = await connection.getConsoleTypes();
     if (types.indexOf("python") !== -1) {
@@ -135,7 +137,7 @@ <h3>Table data (bold headers are keys)</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = t.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = t.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
index b4102876cc1..abd6e2e2272 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: child window</title>
     <script src="../dh-internal.js" type="text/javascript"></script>
-    <script src="../dh-core.js" type="text/javascript"></script>
     <link href="../basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -26,7 +25,10 @@ <h3>Outgoing link summary</h3>
 
 </ul>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, FilterValue, Table} = dh;
+
   if (!window.opener) {
     alert("This page only works correctly when opened by another window.");
     throw "This page only works correctly when opened by another window.";
@@ -43,14 +45,14 @@ <h3>Outgoing link summary</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
     });
   });
   //wait for the named config to load
-  c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+  c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
     var config = event.detail;
     if (config.name === configName) {
       if (config.status !== 'Running') {
@@ -136,9 +138,9 @@ <h3>Outgoing link summary</h3>
 
               // wrap the data so that we can handle it as a filter value
               if (typeof valueToFilterOn === 'string') {
-                valueToFilterOn = dh.FilterValue.ofString(valueToFilterOn);
+                valueToFilterOn = FilterValue.ofString(valueToFilterOn);
               } else {
-                valueToFilterOn = dh.FilterValue.ofNumber(valueToFilterOn);
+                valueToFilterOn = FilterValue.ofNumber(valueToFilterOn);
               }
 
               // apply a new filter (could also present a menu at this point to ask which filter to use)
@@ -166,7 +168,7 @@ <h3>Outgoing link summary</h3>
     simpleLinkedTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simpleLinkedTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
index ef44c9820a7..965767cb0bc 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: parent window</title>
     <script src="../dh-internal.js" type="text/javascript"></script>
-    <script src="../dh-core.js" type="text/javascript"></script>
     <style>
         p, ul {
             max-width: 800px;
@@ -68,7 +67,9 @@ <h3>Persistent Query Configurations</h3>
 <ul id="queries">
 
 </ul>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -76,8 +77,8 @@ <h3>Persistent Query Configurations</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -88,14 +89,14 @@ <h3>Persistent Query Configurations</h3>
   var configs = Object.create(null);
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
index caea1a0bd36..302483ee4cf 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API Plotting sample</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -22,7 +21,9 @@ <h5>Series</h5>
 <div id="series"></div>
 <div id="data"></div>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
@@ -30,8 +31,8 @@ <h5>Series</h5>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -42,14 +43,14 @@ <h5>Series</h5>
     var configs = Object.create(null);
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -71,7 +72,7 @@ <h5>Series</h5>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
index ef2fa6e0a2a..5f106435baa 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API rollup table example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <script src="treegrid.js" type="text/javascript"></script>
     <script src="totals.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
@@ -72,7 +71,8 @@ <h3>Rollup Table Configuration</h3>
 <input id="includeConstituents" type="checkbox"><label for="includeConstituents">Include Constituent values</label><br/>
 <button id="open">Display Rollup Table</button>
 <div id="treetable"></div>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js'
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/search.html b/web/client-api/src/main/java/io/deephaven/web/public/search.html
index c3ff25f0b47..300f4b79d95 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/search.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/search.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API Search example through OR'd contains operations</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -27,8 +26,9 @@ <h3>Selected table data</h3>
 
 </table>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -36,8 +36,8 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -48,14 +48,14 @@ <h3>Selected table data</h3>
   var configs = Object.create(null);
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -77,7 +77,7 @@ <h3>Selected table data</h3>
       queryElt.onclick = () => {
         open = !open;
         queryElt.className = open ? 'open' : 'closed';
-        queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+        queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
           if (event.detail.nanos === -1) {
             console.log(event.detail.type);
           } else {
@@ -128,7 +128,7 @@ <h3>Selected table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -168,7 +168,7 @@ <h3>Selected table data</h3>
     if (needle === null || needle.trim().length === 0) {
       currentTable.applyFilter([]);
     } else {
-      currentTable.applyFilter([dh.FilterCondition.search(dh.FilterValue.ofString(needle))]);
+      currentTable.applyFilter([FilterCondition.search(FilterValue.ofString(needle))]);
     }
     currentTable.setViewport(0, 24);
   }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/simple.html b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
index d4e851bcc14..abf0a185570 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/simple.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
@@ -5,7 +5,6 @@
 
     <title>Simple Deephaven JS Client</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
 </head>
 <body>
 <h3>Simple test page to verify that the Deephaven JS API can connect, create a table, and subscribe to changes</h3>
@@ -13,11 +12,13 @@ <h3>Simple test page to verify that the Deephaven JS API can connect, create a t
     When the page loads, a connection to the server will be created, and a new ticking table declared. Read the source
     for this page to see how it was created.
 </p>
-<script type="text/javascript">
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
 var ide;
 var table;
 (async () => {
-    var connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    var connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
     var consoleTypes = await connection.getConsoleTypes();
     ide = await connection.startSession(consoleTypes[0]);
     document.body.append("session created", document.createElement("br"));
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
index ef2e5185c14..5d009ffcba5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table snapshot</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -69,7 +68,9 @@ <h3>Snapshot table</h3>
     </tr>
 </table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
 
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
@@ -78,8 +79,8 @@ <h3>Snapshot table</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -96,14 +97,14 @@ <h3>Snapshot table</h3>
     var doInitialSnapshotInput = document.getElementById('doInitialSnapshotInput');
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -132,7 +133,7 @@ <h3>Snapshot table</h3>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
@@ -188,7 +189,7 @@ <h3>Snapshot table</h3>
         tableElement.appendChild(header);
 
         // listen for items to be added, populate the table body
-        handleCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        handleCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
             var tbody = tableElement.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
index 93c838dd5a4..983e9981605 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API display basic table</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
@@ -17,14 +16,16 @@
 <h3>Table data</h3>
 <table id="simpleTable"></table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection} = dh;
 var table;
 var connection;
 var ide;
 
 (async () => {
     // Open a connection to the server
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
 
     var types = await connection.getConsoleTypes();
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
index 95767f725da..3da1fc1a00c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
@@ -4,7 +4,6 @@
   <meta charset="utf-8" />
   <title>Deephaven Web API table filter api</title>
   <script src="dh-internal.js" type="text/javascript"></script>
-  <script src="dh-core.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <script src="batch.js" type="text/javascript"></script>
 </head>
@@ -32,7 +31,9 @@ <h3>Selected table data</h3>
 
 </table>
 
-<script>
+<script type="module">
+  import {dh} from './dh-core.js';
+  const {Client, FilterValue} = dh;
 
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
@@ -41,8 +42,8 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -61,14 +62,14 @@ <h3>Selected table data</h3>
   const heads = [];
   window.dhDebug = { pendingSorts, pendingFilters };
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -90,7 +91,7 @@ <h3>Selected table data</h3>
       queryElt.onclick = () => {
         open = !open;
         queryElt.className = open ? 'open' : 'closed';
-        queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+        queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
           if (event.detail.nanos === -1) {
             console.log(event.detail.type);
           } else {
@@ -146,7 +147,7 @@ <h3>Selected table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -275,10 +276,10 @@ <h3>Selected table data</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -289,10 +290,10 @@ <h3>Selected table data</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
index 8248a272229..174e8a235d1 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
@@ -4,7 +4,6 @@
 <meta charset="utf-8" />
 <title>Deephaven Web API table custom columns</title>
 <script src="dh-internal.js" type="text/javascript"></script>
-<script src="dh-core.js" type="text/javascript"></script>
 <link href="basic.css" rel="stylesheet" type="text/css" />
 <style>
     li.open ul { display:block; }
@@ -36,8 +35,9 @@ <h3>Add a new Column with a formula</h3>
 
 </ul>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
       url.protocol = 'ws:';
@@ -45,8 +45,8 @@ <h3>Add a new Column with a formula</h3>
       url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
       connected();
       c.login({username:'dh',token:'dh',type:'password'}).then(result => {
         console.log("login successful");
@@ -57,14 +57,14 @@ <h3>Add a new Column with a formula</h3>
     var configs = Object.create(null);
 
     function connected() {
-      c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+      c.addEventListener(Client.EVENT_CONIG_REMOVED, event => {
         removeQuery(event.detail);
       });
-      c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+      c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
         removeQuery(event.detail);
         addQuery(event.detail);
       });
-      c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+      c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
         addQuery(event.detail);
       });
       function removeQuery(queryInfo) {
@@ -86,7 +86,7 @@ <h3>Add a new Column with a formula</h3>
         queryElt.onclick = () => {
           open = !open;
           queryElt.className = open ? 'open' : 'closed';
-          queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+          queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
             if (event.detail.nanos === -1) {
               console.log(event.detail.type);
             } else {
@@ -129,7 +129,7 @@ <h3>Add a new Column with a formula</h3>
         simplePagingTable.appendChild(header);
 
         // listen for items to be added, populate the table body
-        oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
 
             //since we're adding custom columns too, let's rebuild the header as well
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
index 7a1ae59c055..f441cf3ea5b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table filter api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -53,7 +52,9 @@ <h3>Filter Details</h3>
 <div id="topMenu">
 </div>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection, Table, FilterValue} = dh;
 
   var filterSetup = {
     "Equals..." : {
@@ -151,7 +152,7 @@ <h3>Filter Details</h3>
   var topMenu = document.getElementById('topMenu');
 
   (async () => {
-      connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+      connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
       var types = await connection.getConsoleTypes();
 
@@ -190,7 +191,7 @@ <h3>Filter Details</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = t.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = t.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
@@ -270,10 +271,10 @@ <h3>Filter Details</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -284,10 +285,10 @@ <h3>Filter Details</h3>
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
index 085bd3b3b98..61921f45d84 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table sort api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
   </head>
   <body>
@@ -16,14 +15,16 @@ <h3>Selected table data (click headers to sort)</h3>
     <button id="clear">Clear Reverse</button>
     <table id="simplePagingTable"></table>
 
-    <script>
+    <script type="module">
+      import {dh} from './dh-core.js';
+      const {IdeConnection, Table} = dh;
       var connection;
       var ide;
       var table;
       var oldTableHandlerCleanup;
       var simplePagingTable = document.getElementById("simplePagingTable");
       (async () => {
-        connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+        connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
 
         var types = await connection.getConsoleTypes();
 
@@ -86,7 +87,7 @@ <h3>Selected table data (click headers to sort)</h3>
 
         // listen for items to be added, populate the table body
         oldTableHandlerCleanup = t.addEventListener(
-          dh.Table.EVENT_UPDATED,
+          Table.EVENT_UPDATED,
           function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
@@ -116,7 +117,7 @@ <h3>Selected table data (click headers to sort)</h3>
           const sorts = table.sort.filter(
             s => s.direction !== "REVERSE"
           );
-          sorts.unshift(dh.Table.reverse());
+          sorts.unshift(Table.reverse());
           table.applySort(sorts);
           table.setViewport(0, 49);
         };
@@ -125,7 +126,7 @@ <h3>Selected table data (click headers to sort)</h3>
           const sorts = table.sort.filter(
             s => s.direction !== "REVERSE"
           );
-          sorts.push(dh.Table.reverse());
+          sorts.push(Table.reverse());
           table.applySort(sorts);
           table.setViewport(0, 49);
         };
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
index ab2f560f81f..817788e4bf0 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API table viewport and updates</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -50,7 +49,9 @@ <h3>Table data</h3>
 
 </table>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, QueryInfo, Table} = dh;
 
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
@@ -59,8 +60,8 @@ <h3>Table data</h3>
         url.protocol = 'wss:';
     }
 
-    window.c = new dh.Client(url.href);
-    c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+    window.c = new Client(url.href);
+    c.addEventListener(Client.EVENT_CONNECT, () => {
         connected();
         c.login({username:'dh',token:'dh',type:'password'}).then(result => {
             console.log("login successful");
@@ -71,14 +72,14 @@ <h3>Table data</h3>
     var configs = Object.create(null);
 
     function connected() {
-        c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
             removeQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
             removeQuery(event.detail);
             addQuery(event.detail);
         });
-        c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+        c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
             addQuery(event.detail);
         });
         function removeQuery(queryInfo) {
@@ -100,7 +101,7 @@ <h3>Table data</h3>
             queryElt.onclick = () => {
                 open = !open;
                 queryElt.className = open ? 'open' : 'closed';
-                queryInfo.addEventListener(dh.QueryInfo.EVENT_TABLE_METRICS, event => {
+                queryInfo.addEventListener(QueryInfo.EVENT_TABLE_METRICS, event => {
                     if (event.detail.nanos === -1) {
                         console.log(event.detail.type);
                     } else {
@@ -177,7 +178,7 @@ <h3>Table data</h3>
         tableData.appendChild(header);
 
         // listen for items to be added, populate the table body
-        oldTableHandlerCleanup = subscription.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+        oldTableHandlerCleanup = subscription.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
             console.log("update event received, time to redraw data");
             // rebuild the current tbody from scratch
             var tbody = tableData.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
index 8f610c4cc68..e62ff6d11a5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven JS API table viewport and updates</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
@@ -22,7 +21,9 @@ <h3>Table data</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {IdeConnection, Table} = dh;
 var table;
 var connection;
 var ide;
@@ -31,7 +32,7 @@ <h3>Table data</h3>
 var currentOffset;
 var PAGE_SIZE = 20;
 (async () => {
-    connection = new dh.IdeConnection(window.location.protocol + "//" + window.location.host);
+    connection = new IdeConnection(window.location.protocol + "//" + window.location.host);
     var types = await connection.getConsoleTypes();
 
     if (types.indexOf("python") !== -1) {
@@ -94,7 +95,7 @@ <h3>Table data</h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
         console.log("update event received, time to redraw data");
         // rebuild the current tbody from scratch
         var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
index 11880b87239..a9db5519c1c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API TableMap api</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
@@ -27,8 +26,9 @@ <h3 id="activeTableKey"></h3>
 
 </table>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client, Table} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -36,8 +36,8 @@ <h3 id="activeTableKey"></h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  window.c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
@@ -50,14 +50,14 @@ <h3 id="activeTableKey"></h3>
   var keyList = document.getElementById('keyList');
 
   function connected() {
-    c.addEventListener(dh.Client.EVENT_CONFIG_REMOVED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_REMOVED, event => {
       removeQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       removeQuery(event.detail);
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
     function removeQuery(queryInfo) {
@@ -149,7 +149,7 @@ <h3 id="activeTableKey"></h3>
     simplePagingTable.appendChild(header);
 
     // listen for items to be added, populate the table body
-    oldTableHandlerCleanup = table.addEventListener(dh.Table.EVENT_UPDATED, function handleTableUpdate(event) {
+    oldTableHandlerCleanup = table.addEventListener(Table.EVENT_UPDATED, function handleTableUpdate(event) {
       console.log("update event received, time to redraw data");
       // rebuild the current tbody from scratch
       var tbody = simplePagingTable.querySelector('tbody');
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
index 292ae2e5541..e778eb101d8 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API Totals Tables example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
@@ -32,8 +31,9 @@ <h3>Selected table data</h3>
 <button id="next">&gt;</button>
 <button id="end">&gt;&gt;</button>
 
-<script>
-
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
@@ -41,7 +41,7 @@ <h3>Selected table data</h3>
     url.protocol = 'wss:';
   }
 
-  window.c = new dh.Client(url.href);
+  window.c = new Client(url.href);
   c.addEventListener(dh.Client.EVENT_CONNECT, () => {
     connected();
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
index 3466a596957..303431107af 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
@@ -1,3 +1,5 @@
+import {dh} from './dh-core.js';
+const {Table, FilterValue} = dh;
 /**
  * Simple es6 class encapsulating some basic rendering for a tree table in a grid, allowing
  * expanding and collapsing nodes, and filtering and sorting columns.
@@ -5,7 +7,7 @@
 class TreeGrid {
   constructor(treeTable) {
     this.treeTable = treeTable;
-    this.treeTable.addEventListener(dh.Table.EVENT_UPDATED, e => this.repaint(e.detail));
+    this.treeTable.addEventListener(Table.EVENT_UPDATED, e => this.repaint(e.detail));
 
     this.rootElement = document.createElement('table');
     this.rootElement.addEventListener('click', e => this.toggle(e));
@@ -176,10 +178,10 @@ class TreeGrid {
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
           //TODO make editable
           current.push(buildFilter(column, value));
@@ -190,10 +192,10 @@ class TreeGrid {
           //TODO convert value more completely
           var value = target.internalValue;
           if (typeof value === 'string') {
-            value = dh.FilterValue.ofString(value);
+            value = FilterValue.ofString(value);
           } else /*if (typeof value === 'number')*/ {
             //otherwise, we'll just assume it is a number, ofNumber will throw exceptions if not
-            value = dh.FilterValue.ofNumber(value);
+            value = FilterValue.ofNumber(value);
           }
 
           //TODO make editable
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
index 126d07c8df3..d582d5933bf 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
@@ -4,8 +4,7 @@
     <meta charset="utf-8" />
     <title>Deephaven Web API tree table example</title>
     <script src="dh-internal.js" type="text/javascript"></script>
-    <script src="dh-core.js" type="text/javascript"></script>
-    <script src="treegrid.js" type="text/javascript"></script>
+    <script src="treegrid.js" type="module"></script>
     <script src="totals.js" type="text/javascript"></script>
 
     <link href="basic.css" rel="stylesheet" type="text/css" />
@@ -16,22 +15,25 @@
     </style>
 </head>
 <body>
-<script>
+<script type="module">
+    import {dh} from './dh-core.js';
+    const {Client} = dh;
+
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
   } else {
     url.protocol = 'wss:';
   }
-  var c = new dh.Client(url.href);
-  c.addEventListener(dh.Client.EVENT_CONNECT, () => {
+  var c = new Client(url.href);
+  c.addEventListener(Client.EVENT_CONNECT, () => {
     c.login({username:'dh',token:'dh',type:'password'}).then(result => {
       console.log("login successful");
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_UPDATED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_UPDATED, event => {
       addQuery(event.detail);
     });
-    c.addEventListener(dh.Client.EVENT_CONFIG_ADDED, event => {
+    c.addEventListener(Client.EVENT_CONFIG_ADDED, event => {
       addQuery(event.detail);
     });
   });

From 76538231388608fd2aa6e9ba9d7b26742ddb4f92 Mon Sep 17 00:00:00 2001
From: "Ahmad K. Bawaneh" <ahmad.bawaneh@dominokit.com>
Date: Wed, 17 Aug 2022 18:13:31 +0300
Subject: [PATCH 3/6] Update DeepHavenJsApiLinker to allow exporting GWT
 JsTypes as ES6 module

---
 .../main/java/io/deephaven/web/DeephavenJsApiLinker.java    | 2 +-
 .../java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js   | 6 +-----
 .../src/main/java/io/deephaven/web/public/console.html      | 3 ++-
 .../src/main/java/io/deephaven/web/public/format.html       | 3 ++-
 .../src/main/java/io/deephaven/web/public/freeze.html       | 3 ++-
 .../src/main/java/io/deephaven/web/public/input_table.html  | 4 ++--
 .../src/main/java/io/deephaven/web/public/linked/child.html | 4 ++--
 .../src/main/java/io/deephaven/web/public/linked/index.html | 5 +++--
 .../io/deephaven/web/public/persistentquery_figures.html    | 3 ++-
 .../src/main/java/io/deephaven/web/public/rollup.html       | 3 ++-
 .../src/main/java/io/deephaven/web/public/search.html       | 5 +++--
 .../src/main/java/io/deephaven/web/public/simple.html       | 5 +++--
 .../src/main/java/io/deephaven/web/public/snapshot.html     | 4 ++--
 .../src/main/java/io/deephaven/web/public/table_basic.html  | 5 +++--
 .../src/main/java/io/deephaven/web/public/table_batch.html  | 4 ++--
 .../main/java/io/deephaven/web/public/table_columns.html    | 3 ++-
 .../src/main/java/io/deephaven/web/public/table_filter.html | 4 ++--
 .../src/main/java/io/deephaven/web/public/table_sort.html   | 3 ++-
 .../java/io/deephaven/web/public/table_subscription.html    | 4 ++--
 .../main/java/io/deephaven/web/public/table_viewport.html   | 5 +++--
 .../src/main/java/io/deephaven/web/public/tablemap.html     | 5 +++--
 .../main/java/io/deephaven/web/public/totals_tables.html    | 5 +++--
 .../src/main/java/io/deephaven/web/public/treegrid.js       | 3 ++-
 .../src/main/java/io/deephaven/web/public/treetable.html    | 4 ++--
 24 files changed, 53 insertions(+), 42 deletions(-)

diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
index c842b2b5304..2f1667112d4 100644
--- a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinker.java
@@ -87,7 +87,7 @@ protected static void replaceAll(StringBuffer buf, String search,
             String replace) {
         int len = search.length();
         for (int pos = buf.indexOf(search); pos >= 0; pos = buf.indexOf(search,
-                pos + 1)) {
+                pos + replace.length())) {
             buf.replace(pos, pos + len, replace);
         }
     }
diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
index 721f777781a..dbb13fe56cd 100644
--- a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
@@ -19,13 +19,9 @@ Scope.prototype = self;
 var $doc, $entry, $moduleName, $moduleBase;
 var $wnd = new Scope();
 bindTo($wnd, self);
-
 var dh = {}
 $wnd.dh = dh;
-
 var $gwt_version = "__GWT_VERSION__";
-
 __JAVASCRIPT_RESULT__
-
 gwtOnLoad(null, '__MODULE_NAME__', null);
-export {dh};
+export default dh;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/console.html b/web/client-api/src/main/java/io/deephaven/web/public/console.html
index b964a67a84e..a14f07261d0 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/console.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/console.html
@@ -12,7 +12,8 @@
     <textarea id="command" placeholder="waiting for connection..." rows="1" cols="80" autofocus="autofocus" disabled="disabled" style="resize:vertical"></textarea><button id="run">Run</button>
 </div>
 <script type="module">
-    import {dh} from './dh-core.js';
+    import dh from './dh-core.js';
+
     const {IdeConnection} = dh;
     var connection;
     var ide;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/format.html b/web/client-api/src/main/java/io/deephaven/web/public/format.html
index 39773e2e018..ed8e4b2d511 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/format.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/format.html
@@ -73,7 +73,8 @@ <h4>Sample format strings (click to replace the current format)</h4>
     </div>
 </div>
 <script type="module">
-    import {dh} from './dh-core.js';
+  import dh from './dh-core.js';
+
   document.querySelectorAll(".section").forEach(section => {
     var patternInput = section.querySelector('.pattern');
     // wire up predefined templates
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
index 75ba7411374..0f79e57b03e 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
@@ -40,7 +40,8 @@ <h3>Selected table data</h3>
 <button id="end_frozen">&gt;&gt;</button>
 
 <script type="module">
-    import {dh} from './dh-core.js';
+    import dh from './dh-core.js';
+
     const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
index 962bafb9a20..9899a6e4d7b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
@@ -34,9 +34,9 @@ <h3>Table data (bold headers are keys)</h3>
 <button id="end">&gt;&gt;</button>
 
 <script type="module">
-  import {dh} from './dh-core.js'
-  const {IdeConnection, Table} = dh;
+  import dh from './dh-core.js'
 
+  const {IdeConnection, Table} = dh;
   var table, inputTable;
   var connection;
   var ide;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
index abd6e2e2272..1340b38637a 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
@@ -26,9 +26,9 @@ <h3>Outgoing link summary</h3>
 </ul>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client, FilterValue, Table} = dh;
+  import dh from '../dh-core.js';
 
+  const {Client, FilterValue, Table} = dh;
   if (!window.opener) {
     alert("This page only works correctly when opened by another window.");
     throw "This page only works correctly when opened by another window.";
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
index 965767cb0bc..b24b7ccb063 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
@@ -68,8 +68,9 @@ <h3>Persistent Query Configurations</h3>
 
 </ul>
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client} = dh;
+  import dh from './dh-core.js';
+
+  const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
index 302483ee4cf..5264555fe82 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
@@ -22,7 +22,8 @@ <h5>Series</h5>
 <div id="data"></div>
 
 <script type="module">
-    import {dh} from './dh-core.js';
+    import dh from './dh-core.js';
+
     const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
index 5f106435baa..9d0fabf2442 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
@@ -72,7 +72,8 @@ <h3>Rollup Table Configuration</h3>
 <button id="open">Display Rollup Table</button>
 <div id="treetable"></div>
 <script type="module">
-    import {dh} from './dh-core.js'
+  import dh from './dh-core.js'
+
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/search.html b/web/client-api/src/main/java/io/deephaven/web/public/search.html
index 300f4b79d95..027043311ee 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/search.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/search.html
@@ -27,8 +27,9 @@ <h3>Selected table data</h3>
 </table>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client} = dh;
+  import dh from './dh-core.js';
+
+  const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/simple.html b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
index abf0a185570..1240c9c020b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/simple.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
@@ -13,8 +13,9 @@ <h3>Simple test page to verify that the Deephaven JS API can connect, create a t
     for this page to see how it was created.
 </p>
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {IdeConnection} = dh;
+import dh from './dh-core.js';
+
+const {IdeConnection} = dh;
 var ide;
 var table;
 (async () => {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
index 5d009ffcba5..c61fe2b2c86 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
@@ -69,9 +69,9 @@ <h3>Snapshot table</h3>
 </table>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client} = dh;
+    import dh from './dh-core.js';
 
+    const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
index 983e9981605..bb88c7cc866 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
@@ -17,8 +17,9 @@ <h3>Table data</h3>
 <table id="simpleTable"></table>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {IdeConnection} = dh;
+import dh from './dh-core.js';
+
+const {IdeConnection} = dh;
 var table;
 var connection;
 var ide;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
index 3da1fc1a00c..c3b60cd2e0d 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
@@ -32,9 +32,9 @@ <h3>Selected table data</h3>
 </table>
 
 <script type="module">
-  import {dh} from './dh-core.js';
-  const {Client, FilterValue} = dh;
+  import dh from './dh-core.js';
 
+  const {Client, FilterValue} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
index 174e8a235d1..011aa8869d5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
@@ -36,7 +36,8 @@ <h3>Add a new Column with a formula</h3>
 </ul>
 
 <script type="module">
-    import {dh} from './dh-core.js';
+    import dh from './dh-core.js';
+
     const {Client} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
index f441cf3ea5b..adcbd84f38e 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
@@ -53,9 +53,9 @@ <h3>Filter Details</h3>
 </div>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {IdeConnection, Table, FilterValue} = dh;
+  import dh from './dh-core.js';
 
+  const {IdeConnection, Table, FilterValue} = dh;
   var filterSetup = {
     "Equals..." : {
       build : (column, value) => column.filter().eq(value),
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
index 61921f45d84..bd20bc18500 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
@@ -16,7 +16,8 @@ <h3>Selected table data (click headers to sort)</h3>
     <table id="simplePagingTable"></table>
 
     <script type="module">
-      import {dh} from './dh-core.js';
+      import dh from './dh-core.js';
+
       const {IdeConnection, Table} = dh;
       var connection;
       var ide;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
index 817788e4bf0..f85afe30594 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
@@ -50,9 +50,9 @@ <h3>Table data</h3>
 </table>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client, QueryInfo, Table} = dh;
+    import dh from './dh-core.js';
 
+    const {Client, QueryInfo, Table} = dh;
     var url = new URL('/socket', window.location);
     if (url.protocol === 'http:') {
         url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
index e62ff6d11a5..a3163234ab5 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
@@ -22,8 +22,9 @@ <h3>Table data</h3>
 <button id="end">&gt;&gt;</button>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {IdeConnection, Table} = dh;
+import dh from './dh-core.js';
+
+const {IdeConnection, Table} = dh;
 var table;
 var connection;
 var ide;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
index a9db5519c1c..6b91df95c45 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
@@ -27,8 +27,9 @@ <h3 id="activeTableKey"></h3>
 </table>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client, Table} = dh;
+  import dh from './dh-core.js';
+
+  const {Client, Table} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
index e778eb101d8..259b3eba063 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
@@ -32,8 +32,9 @@ <h3>Selected table data</h3>
 <button id="end">&gt;&gt;</button>
 
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client} = dh;
+  import dh from './dh-core.js';
+
+  const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
index 303431107af..6a364b4c7a3 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treegrid.js
@@ -1,4 +1,5 @@
-import {dh} from './dh-core.js';
+import dh from './dh-core.js';
+
 const {Table, FilterValue} = dh;
 /**
  * Simple es6 class encapsulating some basic rendering for a tree table in a grid, allowing
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
index d582d5933bf..a51e4587707 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
@@ -16,9 +16,9 @@
 </head>
 <body>
 <script type="module">
-    import {dh} from './dh-core.js';
-    const {Client} = dh;
+  import dh from './dh-core.js';
 
+  const {Client} = dh;
   var url = new URL('/socket', window.location);
   if (url.protocol === 'http:') {
     url.protocol = 'ws:';

From 17e40cbb23023c404958dd3f3f63311d02106a13 Mon Sep 17 00:00:00 2001
From: Colin Alworth <colinalworth@deephaven.io>
Date: Mon, 6 Feb 2023 16:10:31 -0600
Subject: [PATCH 4/6] Fix broken example

---
 .../src/main/java/io/deephaven/web/public/table_sort.html       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
index 408bc805661..b9766f7050c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
@@ -27,7 +27,7 @@ <h3>Selected table data (click headers to sort)</h3>
       (async () => {
         var client = new CoreClient(window.location.protocol + "//" + window.location.host);
         await client.login({type:CoreClient.LOGIN_TYPE_ANONYMOUS});
-        connection = client.getAsIdeConnection();
+        connection = await client.getAsIdeConnection();
 
         var types = await connection.getConsoleTypes();
 

From d33d115144487e5041f14f76c3ab51a820dfadb1 Mon Sep 17 00:00:00 2001
From: Colin Alworth <colinalworth@deephaven.io>
Date: Mon, 6 Feb 2023 21:08:37 -0600
Subject: [PATCH 5/6] dh-core should load dh-internal as an es6 module

---
 proto/raw-js-openapi/webpack.config.js                      | 6 +++++-
 .../java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js   | 2 ++
 .../src/main/java/io/deephaven/web/public/console.html      | 1 -
 .../src/main/java/io/deephaven/web/public/format.html       | 1 -
 .../src/main/java/io/deephaven/web/public/freeze.html       | 1 -
 .../src/main/java/io/deephaven/web/public/grpc.html         | 1 -
 .../src/main/java/io/deephaven/web/public/index.html        | 1 -
 .../src/main/java/io/deephaven/web/public/input_table.html  | 1 -
 .../src/main/java/io/deephaven/web/public/linked/child.html | 1 -
 .../src/main/java/io/deephaven/web/public/linked/index.html | 1 -
 .../io/deephaven/web/public/persistentquery_figures.html    | 1 -
 .../src/main/java/io/deephaven/web/public/rollup.html       | 1 -
 .../src/main/java/io/deephaven/web/public/search.html       | 1 -
 .../src/main/java/io/deephaven/web/public/simple.html       | 1 -
 .../src/main/java/io/deephaven/web/public/snapshot.html     | 1 -
 .../src/main/java/io/deephaven/web/public/table_basic.html  | 1 -
 .../src/main/java/io/deephaven/web/public/table_batch.html  | 1 -
 .../main/java/io/deephaven/web/public/table_columns.html    | 1 -
 .../src/main/java/io/deephaven/web/public/table_filter.html | 1 -
 .../src/main/java/io/deephaven/web/public/table_sort.html   | 1 -
 .../java/io/deephaven/web/public/table_subscription.html    | 1 -
 .../main/java/io/deephaven/web/public/table_viewport.html   | 1 -
 .../src/main/java/io/deephaven/web/public/tablemap.html     | 1 -
 .../main/java/io/deephaven/web/public/totals_tables.html    | 1 -
 .../src/main/java/io/deephaven/web/public/treetable.html    | 1 -
 25 files changed, 7 insertions(+), 24 deletions(-)

diff --git a/proto/raw-js-openapi/webpack.config.js b/proto/raw-js-openapi/webpack.config.js
index 793653ffae7..05627b1d856 100644
--- a/proto/raw-js-openapi/webpack.config.js
+++ b/proto/raw-js-openapi/webpack.config.js
@@ -8,7 +8,11 @@ module.exports = {
     output: {
         path: __dirname+'/build/js-out/',
         filename: 'dh-internal.js',
-        libraryTarget: "umd",
+        libraryTarget: 'module',
+        module:true,
+    },
+    experiments: {
+        outputModule:true
     },
     resolve : {
         modules: ['node_modules', __dirname + '/build/js-src'],
diff --git a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
index dbb13fe56cd..6a7ed749806 100644
--- a/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
+++ b/web/client-api/src/main/java/io/deephaven/web/DeephavenJsApiLinkerTemplate.js
@@ -21,6 +21,8 @@ var $wnd = new Scope();
 bindTo($wnd, self);
 var dh = {}
 $wnd.dh = dh;
+import {dhinternal} from './dh-internal.js';
+$wnd.dhinternal = dhinternal;
 var $gwt_version = "__GWT_VERSION__";
 __JAVASCRIPT_RESULT__
 gwtOnLoad(null, '__MODULE_NAME__', null);
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/console.html b/web/client-api/src/main/java/io/deephaven/web/public/console.html
index 4de3f94d14f..96428fab658 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/console.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/console.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
 
     <title>Deephaven JS API Console Interaction</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
 </head>
 <body>
 <div id="logs"></div>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/format.html b/web/client-api/src/main/java/io/deephaven/web/public/format.html
index ed8e4b2d511..db738557e3f 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/format.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/format.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="UTF-8">
     <title>Deephaven Web API Formatting examples</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <style>
         .console {
             max-height: 200px;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
index 0f79e57b03e..286e16367c6 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/freeze.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API table freeze</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/grpc.html b/web/client-api/src/main/java/io/deephaven/web/public/grpc.html
index d3d413a574e..d15a271d305 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/grpc.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/grpc.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
 
     <title>Deephaven gRPC test page</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
 </head>
 <body>
 <h3>Simple test page to verify that gRPC is working</h3>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/index.html b/web/client-api/src/main/java/io/deephaven/web/public/index.html
index 3654ac416bf..915dde66a8b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/index.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
 
     <title>Deephaven JS API samples</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
 </head>
 <body>
 Welcome to the Deephaven JS API. This page has the api loaded, open the browser console to interact with the server.
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
index de2159f0596..599f6a5dfe6 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/input_table.html
@@ -3,7 +3,6 @@
 <head>
   <meta charset="utf-8" />
   <title>Deephaven Web API table viewport and updates</title>
-  <script src="dh-internal.js" type="text/javascript"></script>
   <script src="input_tables.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <style>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
index 1340b38637a..3e01b61ee60 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/child.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: child window</title>
-    <script src="../dh-internal.js" type="text/javascript"></script>
     <link href="../basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
index b24b7ccb063..70ac5a0b931 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/linked/index.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API linked table example: parent window</title>
-    <script src="../dh-internal.js" type="text/javascript"></script>
     <style>
         p, ul {
             max-width: 800px;
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
index 5264555fe82..9927714c1e4 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/persistentquery_figures.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven JS API Plotting sample</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
index 9f7ea835414..150b85c50ff 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/rollup.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API rollup table example</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <script src="totals.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/search.html b/web/client-api/src/main/java/io/deephaven/web/public/search.html
index 027043311ee..350b3243b75 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/search.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/search.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API Search example through OR'd contains operations</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/simple.html b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
index 191d9b88820..88a878ce5bb 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/simple.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/simple.html
@@ -4,7 +4,6 @@
     <meta charset="utf-8" />
 
     <title>Simple Deephaven JS Client</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
 </head>
 <body>
 <h3>Simple test page to verify that the Deephaven JS API can connect, create a table, and subscribe to changes</h3>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
index c61fe2b2c86..aa2099a541d 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/snapshot.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API table snapshot</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
index 65fe0665b69..805603d665b 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_basic.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven JS API display basic table</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
index c3b60cd2e0d..e9846acc050 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_batch.html
@@ -3,7 +3,6 @@
 <head>
   <meta charset="utf-8" />
   <title>Deephaven Web API table filter api</title>
-  <script src="dh-internal.js" type="text/javascript"></script>
   <link href="basic.css" rel="stylesheet" type="text/css" />
   <script src="batch.js" type="text/javascript"></script>
 </head>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
index 011aa8869d5..2743d6aa610 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_columns.html
@@ -3,7 +3,6 @@
 <head>
 <meta charset="utf-8" />
 <title>Deephaven Web API table custom columns</title>
-<script src="dh-internal.js" type="text/javascript"></script>
 <link href="basic.css" rel="stylesheet" type="text/css" />
 <style>
     li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
index 65b2d6d2b16..4a816143c3c 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_filter.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API table filter api</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
index b9766f7050c..594f2c1973a 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_sort.html
@@ -3,7 +3,6 @@
   <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API table sort api</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
   </head>
   <body>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
index f85afe30594..b51a61363b3 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_subscription.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API table viewport and updates</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
index 5f702aa9ef0..b55f9757d4d 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/table_viewport.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven JS API table viewport and updates</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         table { border-spacing: 0; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
index 6b91df95c45..c7ddf7b2a19 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/tablemap.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API TableMap api</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
index 259b3eba063..87c9aa939bc 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/totals_tables.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API Totals Tables example</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <link href="basic.css" rel="stylesheet" type="text/css" />
     <style>
         li.open ul { display:block; }
diff --git a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
index 4986c31b5ae..61ccb228be9 100644
--- a/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
+++ b/web/client-api/src/main/java/io/deephaven/web/public/treetable.html
@@ -3,7 +3,6 @@
 <head>
     <meta charset="utf-8" />
     <title>Deephaven Web API tree table example</title>
-    <script src="dh-internal.js" type="text/javascript"></script>
     <script src="totals.js" type="text/javascript"></script>
 
     <link href="basic.css" rel="stylesheet" type="text/css" />

From d49fdb074e7e202d8907a15954e315e7203361ec Mon Sep 17 00:00:00 2001
From: Colin Alworth <colinalworth@deephaven.io>
Date: Thu, 9 Feb 2023 08:53:42 -0600
Subject: [PATCH 6/6] Update web UI to alpha version so that it can use these
 new modules

---
 web/client-ui/Dockerfile | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/client-ui/Dockerfile b/web/client-ui/Dockerfile
index 8931ca111f4..7e84a6df934 100644
--- a/web/client-ui/Dockerfile
+++ b/web/client-ui/Dockerfile
@@ -2,9 +2,9 @@ FROM deephaven/node:local-build
 WORKDIR /usr/src/app
 
 # Most of the time, these versions are the same, except in cases where a patch only affects one of the packages
-ARG WEB_VERSION=0.29.0
-ARG GRID_VERSION=0.29.0
-ARG CHART_VERSION=0.29.0
+ARG WEB_VERSION=0.29.1-jsapi-core-module.9
+ARG GRID_VERSION=0.29.1-jsapi-core-module.9
+ARG CHART_VERSION=0.29.1-jsapi-core-module.9
 
 # Pull in the published code-studio package from npmjs and extract is
 RUN set -eux; \