@nebula.js/stardust 4.10.0 → 4.11.0

package/core/esm/dev.js

@@ -1,5 +1,5 @@
 /*
-* @nebula.js/stardust v4.10.0
+* @nebula.js/stardust v4.11.0
 * Copyright (c) 2024 QlikTech International AB
 * Released under the MIT license.
 */
@@ -1932,6 +1932,26 @@ var Visualization_UnfulfilledCalculationCondition = {
 		"zh-TW": "不符計算條件"
 	}
 };
+var SelectionToolbar_ClickToLock = {
+	id: "SelectionToolbar.ClickToLock",
+	locale: {
+		"de-DE": "Klicken zum Sperren",
+		"en-US": "Click to lock",
+		"es-ES": "Haga clic para bloquearla",
+		"fr-FR": "Cliquez pour verrouiller",
+		"it-IT": "Fare clic per bloccare",
+		"ja-JP": "クリックしてロック",
+		"ko-KR": "잠그려면 클릭하십시오.",
+		"nl-NL": "Klik om te vergrendelen",
+		"pl-PL": "Aby zablokować, kliknij",
+		"pt-BR": "Clique para travar",
+		"ru-RU": "Щелкните, чтобы заблокировать",
+		"sv-SE": "Klicka för att låsa",
+		"tr-TR": "Kilitlemek için tıklayın",
+		"zh-CN": "单击以锁定",
+		"zh-TW": "按一下鎖定"
+	}
+};
 var all = {
 	Cancel: Cancel$1,
 	CurrentSelections_All: CurrentSelections_All,
@@ -1984,7 +2004,8 @@ var all = {
 	Visualization_Invalid_Dimension: Visualization_Invalid_Dimension,
 	Visualization_Invalid_Measure: Visualization_Invalid_Measure,
 	Visualization_LayoutError: Visualization_LayoutError,
-	Visualization_UnfulfilledCalculationCondition: Visualization_UnfulfilledCalculationCondition
+	Visualization_UnfulfilledCalculationCondition: Visualization_UnfulfilledCalculationCondition,
+	SelectionToolbar_ClickToLock: SelectionToolbar_ClickToLock
 };
 
 function appLocaleFn(language) {
@@ -5177,7 +5198,7 @@ function StyledEngineProvider(props) {
 }
 
 /**
- * @mui/styled-engine v5.15.4
+ * @mui/styled-engine v5.15.7
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -5482,9 +5503,37 @@ function useForkRef(...refs) {
   }, refs);
 }
 
+class Timeout {
+  constructor() {
+    this.currentId = 0;
+    this.clear = () => {
+      if (this.currentId !== 0) {
+        clearTimeout(this.currentId);
+        this.currentId = 0;
+      }
+    };
+    this.disposeEffect = () => {
+      return this.clear;
+    };
+  }
+  static create() {
+    return new Timeout();
+  }
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  start(delay, fn) {
+    this.clear();
+    this.currentId = setTimeout(() => {
+      this.currentId = 0;
+      fn();
+    }, delay);
+  }
+}
+
 let hadKeyboardEvent = true;
 let hadFocusVisibleRecently = false;
-let hadFocusVisibleRecentlyTimeout;
+const hadFocusVisibleRecentlyTimeout = new Timeout();
 const inputTypesWhitelist = {
   text: true,
   search: true,
@@ -5607,10 +5656,9 @@ function useIsFocusVisible() {
       // If we don't see a visibility change within 100ms, it's probably a
       // regular focus change.
       hadFocusVisibleRecently = true;
-      window.clearTimeout(hadFocusVisibleRecentlyTimeout);
-      hadFocusVisibleRecentlyTimeout = window.setTimeout(() => {
+      hadFocusVisibleRecentlyTimeout.start(100, () => {
         hadFocusVisibleRecently = false;
-      }, 100);
+      });
       isFocusVisibleRef.current = false;
       return true;
     }
@@ -5708,10 +5756,7 @@ const createClassNameGenerator = () => {
 };
 const ClassNameGenerator = createClassNameGenerator();
 
-// If GlobalStateSlot is changed, GLOBAL_STATE_CLASSES in
-// \packages\api-docs-builder\utils\parseSlotsAndClasses.ts must be updated accordingly.
-
-const globalStateClassesMapping = {
+const globalStateClasses = {
   active: 'active',
   checked: 'checked',
   completed: 'completed',
@@ -5726,7 +5771,7 @@ const globalStateClassesMapping = {
   selected: 'selected'
 };
 function generateUtilityClass(componentName, slot, globalStatePrefix = 'Mui') {
-  const globalStateClass = globalStateClassesMapping[slot];
+  const globalStateClass = globalStateClasses[slot];
   return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;
 }
 
@@ -5738,6 +5783,10 @@ function generateUtilityClasses(componentName, slots, globalStatePrefix = 'Mui')
   return result;
 }
 
+function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
+  return Math.max(min, Math.min(val, max));
+}
+
 const _excluded$g = ["values", "unit", "step"];
 const sortBreakpointsValues = values => {
   const breakpointsAsArray = Object.keys(values).map(key => ({
@@ -6746,6 +6795,81 @@ function unstable_createStyleFunctionSx() {
 const styleFunctionSx = unstable_createStyleFunctionSx();
 styleFunctionSx.filterProps = ['sx'];
 
+/**
+ * A universal utility to style components with multiple color modes. Always use it from the theme object.
+ * It works with:
+ *  - [Basic theme](https://mui.com/material-ui/customization/dark-mode/)
+ *  - [CSS theme variables](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/)
+ *  - Zero-runtime engine
+ *
+ * Tips: Use an array over object spread and place `theme.applyStyles()` last.
+ *
+ * ✅ [{ background: '#e5e5e5' }, theme.applyStyles('dark', { background: '#1c1c1c' })]
+ *
+ * 🚫 { background: '#e5e5e5', ...theme.applyStyles('dark', { background: '#1c1c1c' })}
+ *
+ * @example
+ * 1. using with `styled`:
+ * ```jsx
+ *   const Component = styled('div')(({ theme }) => [
+ *     { background: '#e5e5e5' },
+ *     theme.applyStyles('dark', {
+ *       background: '#1c1c1c',
+ *       color: '#fff',
+ *     }),
+ *   ]);
+ * ```
+ *
+ * @example
+ * 2. using with `sx` prop:
+ * ```jsx
+ *   <Box sx={theme => [
+ *     { background: '#e5e5e5' },
+ *     theme.applyStyles('dark', {
+ *        background: '#1c1c1c',
+ *        color: '#fff',
+ *      }),
+ *     ]}
+ *   />
+ * ```
+ *
+ * @example
+ * 3. theming a component:
+ * ```jsx
+ *   extendTheme({
+ *     components: {
+ *       MuiButton: {
+ *         styleOverrides: {
+ *           root: ({ theme }) => [
+ *             { background: '#e5e5e5' },
+ *             theme.applyStyles('dark', {
+ *               background: '#1c1c1c',
+ *               color: '#fff',
+ *             }),
+ *           ],
+ *         },
+ *       }
+ *     }
+ *   })
+ *```
+ */
+function applyStyles(key, styles) {
+  // @ts-expect-error this is 'any' type
+  const theme = this;
+  if (theme.vars && typeof theme.getColorSchemeSelector === 'function') {
+    // If CssVarsProvider is used as a provider,
+    // returns '* :where([data-mui-color-scheme="light|dark"]) &'
+    const selector = theme.getColorSchemeSelector(key).replace(/(\[[^\]]+\])/, '*:where($1)');
+    return {
+      [selector]: styles
+    };
+  }
+  if (theme.palette.mode === key) {
+    return styles;
+  }
+  return {};
+}
+
 const _excluded$f = ["breakpoints", "palette", "spacing", "shape"];
 function createTheme$1(options = {}, ...args) {
   const {
@@ -6768,6 +6892,7 @@ function createTheme$1(options = {}, ...args) {
     spacing,
     shape: _extends$3({}, shape$1, shapeInput)
   }, other);
+  muiTheme.applyStyles = applyStyles;
   muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
   muiTheme.unstable_sxConfig = _extends$3({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
   muiTheme.unstable_sx = function sx(props) {
@@ -7144,7 +7269,6 @@ function useThemeProps$1({
   return mergedProps;
 }
 
-/* eslint-disable @typescript-eslint/naming-convention */
 /**
  * Returns a number whose value is limited to the given range.
  * @param {number} value The value to be clamped
@@ -7152,8 +7276,8 @@ function useThemeProps$1({
  * @param {number} max The upper boundary of the output range
  * @returns {number} A number in the range [min, max]
  */
-function clamp(value, min = 0, max = 1) {
-  return Math.min(Math.max(min, value), max);
+function clampWrapper(value, min = 0, max = 1) {
+  return clamp(value, min, max);
 }
 
 /**
@@ -7315,7 +7439,7 @@ function getContrastRatio(foreground, background) {
  */
 function darken(color, coefficient) {
   color = decomposeColor(color);
-  coefficient = clamp(coefficient);
+  coefficient = clampWrapper(coefficient);
   if (color.type.indexOf('hsl') !== -1) {
     color.values[2] *= 1 - coefficient;
   } else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {
@@ -7334,7 +7458,7 @@ function darken(color, coefficient) {
  */
 function lighten(color, coefficient) {
   color = decomposeColor(color);
-  coefficient = clamp(coefficient);
+  coefficient = clampWrapper(coefficient);
   if (color.type.indexOf('hsl') !== -1) {
     color.values[2] += (100 - color.values[2]) * coefficient;
   } else if (color.type.indexOf('rgb') !== -1) {
@@ -8568,7 +8692,7 @@ function create$3(definition) {
   return cache[key];
 }
 
-const NEBULA_VERSION_HASH = "c1b9" ;
+const NEBULA_VERSION_HASH = "339b" ;
 ClassNameGenerator.configure(componentName => {
   return "njs-".concat(NEBULA_VERSION_HASH, "-").concat(componentName.replace('Mui', ''));
 });
@@ -8828,7 +8952,7 @@ function boot(_ref2) {
   const appRef = React__default.createRef();
   const element = document.createElement('div');
   element.style.display = 'none';
-  element.setAttribute('data-nebulajs-version', "4.10.0" );
+  element.setAttribute('data-nebulajs-version', "4.11.0" );
   element.setAttribute('data-app-id', app.id);
   document.body.appendChild(element);
   if (context) {
@@ -18755,16 +18879,15 @@ class AutoSizer extends Component {
         onResize
       } = this.props;
       if (this._parentNode) {
-        var _style$paddingLeft, _style$paddingRight, _style$paddingTop, _style$paddingBottom;
         // Guard against AutoSizer component being removed from the DOM immediately after being added.
         // This can result in invalid style values which can result in NaN values if we don't handle them.
         // See issue #150 for more context.
 
         const style = window.getComputedStyle(this._parentNode) || {};
-        const paddingLeft = parseFloat((_style$paddingLeft = style.paddingLeft) !== null && _style$paddingLeft !== void 0 ? _style$paddingLeft : "0");
-        const paddingRight = parseFloat((_style$paddingRight = style.paddingRight) !== null && _style$paddingRight !== void 0 ? _style$paddingRight : "0");
-        const paddingTop = parseFloat((_style$paddingTop = style.paddingTop) !== null && _style$paddingTop !== void 0 ? _style$paddingTop : "0");
-        const paddingBottom = parseFloat((_style$paddingBottom = style.paddingBottom) !== null && _style$paddingBottom !== void 0 ? _style$paddingBottom : "0");
+        const paddingLeft = parseFloat(style.paddingLeft || "0");
+        const paddingRight = parseFloat(style.paddingRight || "0");
+        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;
@@ -23525,7 +23648,8 @@ function initiate(component) {
     },
     accessibility: {
       setter: null
-    }
+    },
+    contraintsWarning: true
   };
 }
 function teardown(component) {
@@ -24345,8 +24469,11 @@ function useAction(fn, deps) {
  */
 function useConstraints() {
   {
-    // eslint-disable-next-line no-console
-    console.warn('useContraints has been deprecated, please change to useInteractions instead. Note that interactions uses inverted values compared to contraints.');
+    if (currentComponent.__hooks.contraintsWarning) {
+      // eslint-disable-next-line no-console
+      console.warn('useContraints has been deprecated, please change to useInteractions instead. Note that interactions uses inverted values compared to contraints.');
+      currentComponent.__hooks.contraintsWarning = false;
+    }
   }
   return useInternalContext('constraints');
 }