@malloydata/malloy-explorer 0.0.285-dev250530165648 → 0.0.285-dev250610181307

package/dist/cjs/index.cjs

@@ -20,7 +20,7 @@ const React = require("react");
 const QB = require("@malloydata/malloy-query-builder");
 const malloyTag = require("@malloydata/malloy-tag");
 const malloyFilter = require("@malloydata/malloy-filter");
-require("@malloydata/render/webcomponent");
+const render = require("@malloydata/render");
 const ReactDOM = require("react-dom");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -31770,6 +31770,9 @@ function typeFromFilter(filter) {
   if (filter.operator === "null" && filter.not) {
     return "-null";
   }
+  if (filter.operator === "before" && filter.not) {
+    return "not_before";
+  }
   return filter.operator;
 }
 function unitsFromFilter(filter, isDateTime) {
@@ -31823,6 +31826,9 @@ const DateTimeFilterCore = ({
         }, {
           value: "next",
           label: "next complete"
+        }, {
+          value: "not_before",
+          label: "on or after"
         }, {
           value: "after",
           label: "after"
@@ -32184,6 +32190,12 @@ function dateTimeFilterChangeType(filter, type, units) {
         operator: type,
         before: fromMoment
       };
+    case "not_before":
+      return {
+        operator: "before",
+        before: fromMoment,
+        not: true
+      };
     case "in":
       return {
         operator: type,
@@ -33637,7 +33649,7 @@ const parsedToLabels = (parsed, filterString) => {
             const {
               not
             } = temporalClause;
-            op = `is${not ? " not" : ""} before`;
+            op = not ? "is on or after" : "is before";
             value = displayTimeFromMoment(temporalClause.before);
           }
           break;
@@ -35682,42 +35694,48 @@ function RenderedResult({
   result,
   source
 }) {
-  const [renderer, setRenderer] = React.useState();
   const {
     onDrill,
     setQuery
   } = React.useContext(QueryEditorContext);
-  React.useEffect(() => {
-    const renderer2 = document.createElement("malloy-render");
-    renderer2.malloyResult = result;
-    renderer2.onDrill = ({
-      stableQuery,
-      stableDrillClauses
-    }) => {
-      if (onDrill) {
-        onDrill({
-          stableQuery,
-          stableDrillClauses
+  const vizContainer = React.useRef(null);
+  const viz = React.useMemo(() => {
+    const renderer = new render.MalloyRenderer();
+    const viz2 = renderer.createViz({
+      onDrill: ({
+        stableQuery,
+        stableDrillClauses
+      }) => {
+        if (onDrill) {
+          onDrill({
+            stableQuery,
+            stableDrillClauses
+          });
+          return;
+        }
+        const rootQuery = new QB.ASTQuery({
+          query: stableQuery,
+          source
         });
-        return;
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      },
+      tableConfig: {
+        enableDrill: true
       }
-      const rootQuery = new QB.ASTQuery({
-        query: stableQuery,
-        source
-      });
-      setQuery == null ? void 0 : setQuery(rootQuery.build());
-    };
-    renderer2.tableConfig = {
-      enableDrill: true
-    };
-    setRenderer(renderer2);
-  }, [onDrill, result, source, setQuery]);
-  if (renderer) {
-    return /* @__PURE__ */ jsxRuntime.jsx(DOMElement, {
-      element: renderer,
-      style: {
-        overflow: "hidden",
-        height: "100%"
+    });
+    return viz2;
+  }, [onDrill, source, setQuery]);
+  React.useEffect(() => {
+    if (vizContainer.current && viz) {
+      viz.setResult(result);
+      viz.render(vizContainer.current);
+    }
+  }, [viz, result]);
+  if (viz) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      ref: vizContainer,
+      ...{
+        className: "mly5yr21d mly1n2onr6 mly1ja2u2z mlyb3r6kr mlyh8yej3"
       }
     });
   } else {