@nebula.js/stardust 5.12.2 → 5.12.4

package/dist/stardust.dev.js

@@ -1,5 +1,5 @@
 /*
-* @nebula.js/stardust v5.12.2
+* @nebula.js/stardust v5.12.4
 * Copyright (c) 2025 QlikTech International AB
 * Released under the MIT license.
 */
@@ -15311,7 +15311,7 @@
 	  return cache[key];
 	}
 
-	const NEBULA_VERSION_HASH = "9841";
+	const NEBULA_VERSION_HASH = "1a27";
 	ClassNameGenerator.configure(componentName => {
 	  return "njs-".concat(NEBULA_VERSION_HASH, "-").concat(componentName.replace('Mui', ''));
 	});
@@ -15552,7 +15552,7 @@
 	  const appRef = React.createRef();
 	  const element = document.createElement('div');
 	  element.style.display = 'none';
-	  element.setAttribute('data-nebulajs-version', "5.12.2");
+	  element.setAttribute('data-nebulajs-version', "5.12.4");
 	  element.setAttribute('data-app-id', app.id);
 	  document.body.appendChild(element);
 	  if (context) {
@@ -15569,7 +15569,7 @@
 	    selectionStore: selectionStore
 	  }));
 	  const cells = {};
-	  const cellsUnmount = {};
+	  const componentsUnmount = [];
 	  const components = [];
 	  return [{
 	    toggleFocusOfCells(cellIdToFocus) {
@@ -15578,30 +15578,31 @@
 	      });
 	    },
 	    cells,
-	    addCell(id, cell, unmount) {
+	    addCell(id, cell) {
 	      cells[id] = cell;
-	      cellsUnmount[id] = unmount;
 	    },
 	    removeCell(id) {
 	      delete cells[id];
-	      cellsUnmount[id]();
-	      delete cellsUnmount[id];
 	    },
-	    add(component) {
+	    add(component, unmount) {
 	      (async () => {
 	        await rendered;
 	        components.push(component);
+	        componentsUnmount.push(unmount);
 	        appRef.current.setComps(components);
 	      })();
 	    },
 	    remove(component) {
-	      (async () => {
+	      (async _appRef$current => {
 	        await rendered;
 	        const ix = components.indexOf(component);
 	        if (ix !== -1) {
+	          var _componentsUnmount$ix;
+	          (_componentsUnmount$ix = componentsUnmount[ix]) === null || _componentsUnmount$ix === void 0 || _componentsUnmount$ix.call(componentsUnmount);
 	          components.splice(ix, 1);
+	          componentsUnmount.splice(ix, 1);
 	        }
-	        appRef.current.setComps(components);
+	        appRef === null || appRef === void 0 || (_appRef$current = appRef.current) === null || _appRef$current === void 0 || _appRef$current.setComps(components);
 	      })();
 	    },
 	    setMuiThemeName(themeName) {
@@ -15621,10 +15622,11 @@
 	      })();
 	    },
 	    destroy() {
-	      Object.keys(cellsUnmount).forEach(c => {
-	        cellsUnmount[c]();
+	      componentsUnmount.forEach(c => {
+	        c && c();
 	      });
 	      modelStore.destroy();
+	      root.unmount();
 	    }
 	  }, modelStore, selectionStore, appRef, rendered];
 	}
@@ -31252,7 +31254,7 @@
 	  return {
 	    fontFamily: textProps.fontFamily || theme.getStyle("object.".concat(objectType), "title.".concat(target), 'fontFamily'),
 	    fontSize: textProps.fontSize || theme.getStyle("object.".concat(objectType), "title.".concat(target), 'fontSize'),
-	    color: textProps.color && textProps.color.color !== 'none' ? theme.getColorPickerColor(textProps.color) : theme.getStyle("object.".concat(objectType), target, 'color'),
+	    color: textProps.color && textProps.color.color !== 'none' ? theme.getColorPickerColor(textProps.color) : theme.getStyle("object.".concat(objectType), "title.".concat(target), 'color'),
 	    backgroundColor: textProps.backgroundColor || theme.getStyle("object.".concat(objectType), "title.".concat(target), 'backgroundColor'),
 	    fontWeight: fontStyle.includes('bold') ? 'bold' : 'normal',
 	    fontStyle: fontStyle.includes('italic') ? 'italic' : 'normal',
@@ -32102,7 +32104,7 @@
 	  })))))), CurrentItem);
 	}
 
-	const MIN_WIDTH$1 = 120;
+	const MIN_WIDTH = 120;
 	const MIN_WIDTH_MORE = 72;
 	function getItems(layout) {
 	  if (!layout) {
@@ -32167,7 +32169,7 @@
 	      width
 	    } = containerRect;
 	    const maxWidth = Math.floor(width) - MIN_WIDTH_MORE;
-	    const items = Math.floor(maxWidth / MIN_WIDTH$1);
+	    const items = Math.floor(maxWidth / MIN_WIDTH);
 	    setMaxItems(items);
 	  }, [containerRect]);
 	  reactExports.useEffect(() => {
@@ -32213,7 +32215,7 @@
 	    style: {
 	      position: 'relative',
 	      maxWidth: '240px',
-	      minWidth: "".concat(MIN_WIDTH$1, "px"),
+	      minWidth: "".concat(MIN_WIDTH, "px"),
 	      background: theme.palette.background.paper,
 	      borderRight: "1px solid ".concat(theme.palette.divider)
 	    }
@@ -32625,12 +32627,11 @@
 	    super(...args);
 	    this.state = {
 	      height: this.props.defaultHeight || 0,
-	      scaledHeight: this.props.defaultHeight || 0,
-	      scaledWidth: this.props.defaultWidth || 0,
 	      width: this.props.defaultWidth || 0
 	    };
 	    this._autoSizer = null;
 	    this._detectElementResize = null;
+	    this._didLogDeprecationWarning = false;
 	    this._parentNode = null;
 	    this._resizeObserver = null;
 	    this._timeoutId = null;
@@ -32652,23 +32653,32 @@
 	        const paddingTop = parseFloat(style.paddingTop || "0");
 	        const paddingBottom = parseFloat(style.paddingBottom || "0");
 	        const rect = this._parentNode.getBoundingClientRect();
-	        const scaledHeight = rect.height - paddingTop - paddingBottom;
-	        const scaledWidth = rect.width - paddingLeft - paddingRight;
-	        const height = this._parentNode.offsetHeight - paddingTop - paddingBottom;
-	        const width = this._parentNode.offsetWidth - paddingLeft - paddingRight;
-	        if (!disableHeight && (this.state.height !== height || this.state.scaledHeight !== scaledHeight) || !disableWidth && (this.state.width !== width || this.state.scaledWidth !== scaledWidth)) {
+	        const height = rect.height - paddingTop - paddingBottom;
+	        const width = rect.width - paddingLeft - paddingRight;
+	        if (!disableHeight && this.state.height !== height || !disableWidth && this.state.width !== width) {
 	          this.setState({
 	            height,
-	            width,
-	            scaledHeight,
-	            scaledWidth
+	            width
 	          });
+	          const maybeLogDeprecationWarning = () => {
+	            if (!this._didLogDeprecationWarning) {
+	              this._didLogDeprecationWarning = true;
+	              console.warn("scaledWidth and scaledHeight parameters have been deprecated; use width and height instead");
+	            }
+	          };
 	          if (typeof onResize === "function") {
 	            onResize({
 	              height,
-	              scaledHeight,
-	              scaledWidth,
-	              width
+	              width,
+	              // TODO Remove these params in the next major release
+	              get scaledHeight() {
+	                maybeLogDeprecationWarning();
+	                return height;
+	              },
+	              get scaledWidth() {
+	                maybeLogDeprecationWarning();
+	                return width;
+	              }
 	            });
 	          }
 	        }
@@ -32738,8 +32748,6 @@
 	    } = this.props;
 	    const {
 	      height,
-	      scaledHeight,
-	      scaledWidth,
 	      width
 	    } = this.state;
 
@@ -32760,7 +32768,9 @@
 	      }
 	      outerStyle.height = 0;
 	      childParams.height = height;
-	      childParams.scaledHeight = scaledHeight;
+
+	      // TODO Remove this in the next major release
+	      childParams.scaledHeight = height;
 	    }
 	    if (!disableWidth) {
 	      if (width === 0) {
@@ -32768,7 +32778,9 @@
 	      }
 	      outerStyle.width = 0;
 	      childParams.width = width;
-	      childParams.scaledWidth = scaledWidth;
+
+	      // TODO Remove this in the next major release
+	      childParams.scaledWidth = width;
 	    }
 	    if (doNotBailOutOnEmptyChildren) {
 	      bailoutOnChildren = false;
@@ -33864,26 +33876,34 @@
 	    throw new Error("Option \"".concat(usedForbiddenOptions.join(', '), "\" is not applicable for existing objects."));
 	  }
 	  reactExports.useEffect(() => {
-	    function storeModel(m) {
-	      if (modelStore.get(m.id)) {
-	        return;
-	      }
-	      // Nebula gets the model from this store in some of its
-	      // core functions, so it must always be stored here.
-	      modelStore.set(m.id, m);
-	      m.once('closed', () => {
-	        modelStore.clear(m.id);
-	      });
-	    }
+	    let isCleaned = false;
+	    let cleanupFn = () => {};
 	    async function fetchObject(modelId) {
 	      const m = modelStore.get(modelId) || (await app.getObject(modelId));
 	      return m;
 	    }
-	    const p = Promise.resolve(sessionModel || fetchObject(qId));
-	    p.then(m => {
-	      storeModel(m);
+	    async function fetchModel() {
+	      const m = await Promise.resolve(sessionModel || fetchObject(qId));
+	      if (isCleaned) {
+	        return;
+	      }
+	      if (!modelStore.get(m.id)) {
+	        modelStore.set(m.id, m);
+	        const onClosed = () => {
+	          modelStore.clear(m.id);
+	        };
+	        m.once('closed', onClosed);
+	        cleanupFn = () => {
+	          m.removeListener('closed', onClosed);
+	        };
+	      }
 	      setModel(m);
-	    });
+	    }
+	    fetchModel();
+	    return () => {
+	      isCleaned = true;
+	      cleanupFn();
+	    };
 	  }, []);
 	  return model;
 	}
@@ -35937,11 +35957,6 @@
 	    }
 	  };
 	});
-	const ITEM_WIDTH = 32;
-	const ITEM_SPACING = 4;
-	const DIVIDER = 1;
-	const NUMBER_OF_ITEMS = 6;
-	const MIN_WIDTH = (ITEM_WIDTH + ITEM_SPACING) * NUMBER_OF_ITEMS + DIVIDER + ITEM_SPACING;
 
 	/**
 	 * @interface
@@ -35975,8 +35990,6 @@
 	  const showSubtitle = layout.showTitles && !!layout.subtitle;
 	  const showInSelectionActions = layout.qSelectionInfo && layout.qSelectionInfo.qInSelections;
 	  const [actions, setActions] = reactExports.useState([]);
-	  const [containerRef, containerRect] = useRect$1();
-	  const [shouldShowPopoverToolbar, setShouldShowPopoverToolbar] = reactExports.useState(false);
 	  reactExports.useEffect(() => {
 	    if (!sn || !sn.component || !sn.component.isHooked) {
 	      return;
@@ -35985,19 +35998,11 @@
 	      setActions([...a, ...(sn && sn.selectionToolbar && sn.selectionToolbar.items || [])]);
 	    });
 	  }, [sn]);
-	  reactExports.useEffect(() => {
-	    if (!containerRect) return;
-	    const {
-	      width
-	    } = containerRect;
-	    setShouldShowPopoverToolbar(width < MIN_WIDTH);
-	  }, [containerRect]);
 	  const showTitles = showTitle || showSubtitle;
 	  const cls = [classes$1.containerStyle, ...(showTitles ? [classes$1.containerTitleStyle] : [])];
-	  const showPopoverToolbar = (hovering || showInSelectionActions) && (shouldShowPopoverToolbar || !showTitles);
-	  const showToolbar = showTitles && !showPopoverToolbar && !shouldShowPopoverToolbar;
+	  const showPopoverToolbar = hovering || showInSelectionActions;
 	  const Toolbar = /*#__PURE__*/React.createElement(ActionsToolbar, {
-	    show: showToolbar,
+	    show: false,
 	    selections: {
 	      show: showInSelectionActions,
 	      api: sn.component.selections,
@@ -36012,7 +36017,6 @@
 	    layout: layout
 	  });
 	  return /*#__PURE__*/React.createElement(StyledGrid$1, {
-	    ref: containerRef,
 	    item: true,
 	    container: true,
 	    wrap: "nowrap",
@@ -36266,20 +36270,46 @@
 	  }));
 	}
 
+	const THEME_OBJECT_TYPE_MAP = {
+	  linechart: 'lineChart',
+	  barchart: 'barChart',
+	  combochart: 'comboChart',
+	  scatterplot: 'scatterPlot',
+	  piechart: 'pieChart',
+	  straightable: 'straightTable',
+	  pivottable: 'pivotTable',
+	  table: 'straightTable',
+	  'pivot-table': 'pivotTable',
+	  listbox: 'listBox',
+	  referenceline: 'referenceLine',
+	  datacolors: 'dataColors',
+	  'text-image': 'textImage',
+	  boxplot: 'boxPlot',
+	  map: 'mapChart',
+	  mapchart: 'mapChart',
+	  bulletchart: 'bulletChart'
+	};
+	const getThemeObjectType = visualization => {
+	  if (THEME_OBJECT_TYPE_MAP[visualization.toLowerCase()]) {
+	    return THEME_OBJECT_TYPE_MAP[visualization.toLowerCase()];
+	  }
+	  return visualization;
+	};
 	const useStyling = (layout, theme, app, themeName) => {
 	  const styling = reactExports.useMemo(() => {
 	    if (layout && theme) {
 	      const generalComp = layout.components ? layout.components.find(comp => comp.key === 'general') : null;
+	      const objectType = getThemeObjectType(layout.visualization);
 	      const titleStyles = {
-	        main: resolveTextStyle(generalComp, 'main', theme, layout.visualization),
-	        footer: resolveTextStyle(generalComp, 'footer', theme, layout.visualization),
-	        subTitle: resolveTextStyle(generalComp, 'subTitle', theme, layout.visualization)
+	        main: resolveTextStyle(generalComp, 'main', theme, objectType),
+	        footer: resolveTextStyle(generalComp, 'footer', theme, objectType),
+	        subTitle: resolveTextStyle(generalComp, 'subTitle', theme, objectType)
 	      };
-	      const bgColor = resolveBgColor(generalComp, theme, layout.visualization);
+	      const bgColor = resolveBgColor(generalComp, theme, objectType);
 	      const bgImage = resolveBgImage(generalComp, app);
-	      const border = resolveBorder(generalComp, theme, layout.visualization);
-	      const borderRadius = resolveBorderRadius(generalComp, theme, layout.visualization);
-	      const boxShadow = resolveBoxShadow(generalComp, theme, layout.visualization);
+	      const border = resolveBorder(generalComp, theme, objectType);
+	      const borderRadius = resolveBorderRadius(generalComp, theme, objectType);
+	      const boxShadow = resolveBoxShadow(generalComp, theme, objectType);
 	      return {
 	        titleStyles,
 	        bgColor,
@@ -37042,9 +37072,9 @@
 	    model.removeListener('closed', unmount);
 	  };
 	  model.on('closed', unmount);
-	  root.add(portal);
+	  root.add(portal, unmount);
 	  // Cannot use model.id as it is not unique in a given mashup
-	  root.addCell(currentId, cellRef, unmount);
+	  root.addCell(currentId, cellRef);
 	  return [unmount, cellRef];
 	}
 
@@ -39413,10 +39443,6 @@
 	     * @type {SnComponent}
 	     */
 	    component: sn.component || {},
-	    /**
-	     * @type {EXT}
-	     */
-	    ext: sn.ext,
 	    /**
 	     * @param {object} p
 	     * @param {EnigmaAppModel} p.app
@@ -40283,7 +40309,7 @@
 	    onError: onError
 	  }), element, model.id);
 	  navigation.setSheetRef(sheetRef);
-	  root.add(portal);
+	  root.add(portal, unmount);
 	  return [unmount, sheetRef];
 	}