@deck.gl/widgets 9.3.0-alpha.2 → 9.3.0-alpha.5

package/dist/index.cjs

@@ -1163,10 +1163,13 @@ var Popover = ({ x, y, placement = "right", offset: pixelOffset = 0, arrow: arro
     (_a = updaterRef.current) == null ? void 0 : _a.call(updaterRef);
   }, [x, y, placement, arrowSize, pixelOffset]);
   (0, import_hooks4.useEffect)(() => {
-    if (contentRef.current) {
-      contentRef.current.style.visibility = "visible";
+    const anchor = anchorRef.current;
+    const content = contentRef.current;
+    if (!anchor || !content) {
+      return void 0;
     }
-    const cleanup = (0, import_dom.autoUpdate)(anchorRef.current, contentRef.current, () => {
+    content.style.visibility = "visible";
+    const cleanup = (0, import_dom.autoUpdate)(anchor, content, () => {
       var _a;
       return (_a = updaterRef.current) == null ? void 0 : _a.call(updaterRef);
     });
@@ -2487,6 +2490,7 @@ var StatsWidget = class extends import_core22.Widget {
     }
     const stats = this._getStats();
     const title = this.props.title || ("id" in stats ? stats.id : null) || "Stats";
+    const deviceLabel = this._getDeviceLabel();
     const items = [];
     if (stats) {
       stats.forEach((stat) => {
@@ -2499,7 +2503,7 @@ var StatsWidget = class extends import_core22.Widget {
         });
       });
     }
-    (0, import_preact20.render)((0, import_jsx_runtime26.jsxs)("div", { className: "deck-widget-stats-container", style: { cursor: "default" }, children: [(0, import_jsx_runtime26.jsxs)("div", { className: "deck-widget-stats-header", style: { cursor: "pointer", pointerEvents: "auto" }, onClick: this._toggleCollapsed, children: [(0, import_jsx_runtime26.jsx)("b", { children: title }), (0, import_jsx_runtime26.jsx)("button", { className: "deck-widget-dropdown-button", children: (0, import_jsx_runtime26.jsx)("span", { className: "deck-widget-dropdown-icon open" }) })] }), (0, import_jsx_runtime26.jsx)("div", { className: "deck-widget-stats-content", children: items })] }), rootElement);
+    (0, import_preact20.render)((0, import_jsx_runtime26.jsxs)("div", { className: "deck-widget-stats-container", style: { cursor: "default" }, children: [(0, import_jsx_runtime26.jsxs)("div", { className: "deck-widget-stats-header", style: { cursor: "pointer", pointerEvents: "auto" }, onClick: this._toggleCollapsed, children: [(0, import_jsx_runtime26.jsx)("b", { children: title }), deviceLabel && (0, import_jsx_runtime26.jsx)("span", { className: "deck-widget-stats-device", children: deviceLabel }), (0, import_jsx_runtime26.jsx)("button", { className: "deck-widget-dropdown-button", children: (0, import_jsx_runtime26.jsx)("span", { className: "deck-widget-dropdown-icon open" }) })] }), (0, import_jsx_runtime26.jsx)("div", { className: "deck-widget-stats-content", children: items })] }), rootElement);
   }
   onRedraw() {
     if (!this.collapsed) {
@@ -2527,6 +2531,21 @@ var StatsWidget = class extends import_core22.Widget {
         throw new Error(`Unknown stats type: ${this.props.type}`);
     }
   }
+  _getDeviceLabel() {
+    var _a, _b;
+    const deviceType = (_b = (_a = this.deck) == null ? void 0 : _a.device) == null ? void 0 : _b.type;
+    if (!deviceType) {
+      return null;
+    }
+    switch (deviceType) {
+      case "webgpu":
+        return "WebGPU";
+      case "webgl":
+        return "WebGL";
+      default:
+        return String(deviceType);
+    }
+  }
   _getLines(stat) {
     if ("count" in stat) {
       const formatter = this._formatters[stat.name] || this._formatters[stat.type || ""] || DEFAULT_COUNT_FORMATTER;