@nebula.js/stardust 5.8.0 → 5.8.1

package/core/esm/dev.js

@@ -1,11 +1,11 @@
 /*
-* @nebula.js/stardust v5.8.0
+* @nebula.js/stardust v5.8.1
 * Copyright (c) 2024 QlikTech International AB
 * Released under the MIT license.
 */
 
 import * as React from 'react';
-import React__default, { useState as useState$1, useEffect as useEffect$1, forwardRef, useMemo as useMemo$1, useImperativeHandle as useImperativeHandle$1, useContext, useReducer, useCallback, useLayoutEffect as useLayoutEffect$1, PureComponent, useRef, createElement, Component } from 'react';
+import React__default, { useState as useState$1, useEffect as useEffect$1, forwardRef, useMemo as useMemo$1, useImperativeHandle as useImperativeHandle$1, useContext, useReducer, useCallback, useLayoutEffect as useLayoutEffect$1, PureComponent, useRef as useRef$1, createElement, Component } from 'react';
 import ReactDOM$1 from 'react-dom';
 import { CacheProvider, Global, ThemeContext as ThemeContext$1, css, keyframes } from '@emotion/react';
 import { Checkbox, Radio, Typography, FormControlLabel, Box, Grid, Tooltip, Paper, IconButton, styled as styled$3, Popover, MenuList, MenuItem, ListItemIcon, Divider, OutlinedInput, InputAdornment, Badge, List, ListItem, Button, ButtonBase, CircularProgress, Icon } from '@mui/material';
@@ -10772,7 +10772,7 @@ function create$3(definition) {
   return cache[key];
 }
 
-const NEBULA_VERSION_HASH = "18d6";
+const NEBULA_VERSION_HASH = "c2a3";
 ClassNameGenerator.configure(componentName => {
   return "njs-".concat(NEBULA_VERSION_HASH, "-").concat(componentName.replace('Mui', ''));
 });
@@ -11004,7 +11004,7 @@ function boot(_ref2) {
   const appRef = React__default.createRef();
   const element = document.createElement('div');
   element.style.display = 'none';
-  element.setAttribute('data-nebulajs-version', "5.8.0");
+  element.setAttribute('data-nebulajs-version', "5.8.1");
   element.setAttribute('data-app-id', app.id);
   document.body.appendChild(element);
   if (context) {
@@ -11827,7 +11827,7 @@ function useSelectionsInteractions(_ref) {
     doc = document,
     loaderRef
   } = _ref;
-  const currentSelect = useRef({
+  const currentSelect = useRef$1({
     startElemNumber: undefined,
     elemNumbers: [],
     isRange: false,
@@ -16341,13 +16341,13 @@ function ListBox(_ref) {
     checkboxes = checkboxOption,
     histogram
   } = layout !== null && layout !== void 0 ? layout : {};
-  const loaderRef = useRef(null);
-  const local = useRef({
+  const loaderRef = useRef$1(null);
+  const local = useRef$1({
     queue: [],
     validPages: false,
     dataOffset: 0
   });
-  const listData = useRef({
+  const listData = useRef$1({
     pages: []
   });
 
@@ -17171,8 +17171,8 @@ function ActionsToolbar(_ref3) {
     vertical: 12,
     horizontal: ((_popover$anchorEl$cli = (_popover$anchorEl = popover.anchorEl) === null || _popover$anchorEl === void 0 ? void 0 : _popover$anchorEl.clientWidth) !== null && _popover$anchorEl$cli !== void 0 ? _popover$anchorEl$cli : 0) - 7
   };
-  const actionsRef = useRef();
-  const moreRef = useRef();
+  const actionsRef = useRef$1();
+  const moreRef = useRef$1();
   const theme = useTheme$1();
   const dividerStyle = useMemo$1(() => ({
     margin: theme.spacing(0.5, 0)
@@ -17402,8 +17402,8 @@ function ListBoxSearch(_ref2, ref) {
   } = useContext(InstanceContext);
   const [value, setValue] = useState$1('');
   const [wildcardOn, setWildcardOn] = useState$1(false);
-  const inputRef = useRef();
-  const clearSearchRef = useRef();
+  const inputRef = useRef$1();
+  const clearSearchRef = useRef$1();
   const clearSearchText = translator.get('Listbox.Clear.Search');
   const {
     getStoreValue,
@@ -18562,7 +18562,7 @@ function ListBoxPopover(_ref) {
   const open = show && Boolean(alignTo.current);
   const [listCount, setListCount] = useState$1(0);
   const theme = useTheme$1();
-  const searchInputRef = useRef();
+  const searchInputRef = useRef$1();
   const [model] = useSessionModel({
     qInfo: {
       qType: 'njsListbox'
@@ -18594,8 +18594,8 @@ function ListBoxPopover(_ref) {
     themeApi,
     keyboardNavigation
   } = useContext(InstanceContext);
-  const moreAlignTo = useRef();
-  const containerRef = useRef();
+  const moreAlignTo = useRef$1();
+  const containerRef = useRef$1();
   const [selections] = useObjectSelections(app, model, containerRef);
   const [layout] = useLayout$1(model);
   const [selectionState$1] = useState$1(() => selectionState({
@@ -18756,7 +18756,7 @@ function OneField(_ref) {
   const {
     translator
   } = useContext(InstanceContext);
-  const alignTo = moreAlignTo || useRef();
+  const alignTo = moreAlignTo || useRef$1();
   const theme = useTheme$1();
   const [showListBoxPopover, setShowListBoxPopover] = useState$1(false);
   const handleShowListBoxPopover = e => {
@@ -18953,7 +18953,7 @@ function MultiState(_ref2) {
   const [showStateIx, setShowStateIx] = useState$1(-1);
   // If originated from the `more` item align it
   const [anchorEl, setAnchorEl] = useState$1(moreAlignTo ? moreAlignTo.current : null);
-  const alignTo = moreAlignTo || useRef();
+  const alignTo = moreAlignTo || useRef$1();
   const {
     translator
   } = useContext(InstanceContext);
@@ -19118,7 +19118,7 @@ function More(_ref2) {
   const [showMoreItems, setShowMoreItems] = useState$1(false);
   const [showItemIx, setShowItemIx] = useState$1(-1);
   const [anchorEl, setAnchorEl] = useState$1(null);
-  const alignTo = useRef();
+  const alignTo = useRef$1();
   const handleShowMoreItems = e => {
     if (e.currentTarget.contains(e.target)) {
       // because click in popover will propagate to parent
@@ -20459,7 +20459,7 @@ function ListBoxHeader(_ref2) {
     var _layout$qListObject2;
     setLocked(layout === null || layout === void 0 || (_layout$qListObject2 = layout.qListObject) === null || _layout$qListObject2 === void 0 || (_layout$qListObject2 = _layout$qListObject2.qDimensionInfo) === null || _layout$qListObject2 === void 0 ? void 0 : _layout$qListObject2.qLocked);
   }, [layout === null || layout === void 0 || (_layout$qListObject3 = layout.qListObject) === null || _layout$qListObject3 === void 0 || (_layout$qListObject3 = _layout$qListObject3.qDimensionInfo) === null || _layout$qListObject3 === void 0 ? void 0 : _layout$qListObject3.qLocked]);
-  const titleRef = useRef(null);
+  const titleRef = useRef$1(null);
   const iconData = iconUtils.createDimensionIconData({
     dimInfo: layout === null || layout === void 0 || (_layout$qListObject4 = layout.qListObject) === null || _layout$qListObject4 === void 0 ? void 0 : _layout$qListObject4.qDimensionInfo,
     app,
@@ -20704,12 +20704,12 @@ function ListBoxInline(_ref3) {
   const isDirectQuery = isDirectQueryEnabled({
     appLayout: app === null || app === void 0 ? void 0 : app.layout
   });
-  const containerRef = useRef();
-  const searchInputRef = useRef();
+  const containerRef = useRef$1();
+  const searchInputRef = useRef$1();
   const [containerRectRef, containerRect] = useRect$1();
   const [showToolbar, setShowToolbar] = useState$1(false);
   const [showSearch, setShowSearch] = useState$1(false);
-  const hovering = useRef(false);
+  const hovering = useRef$1(false);
   const [keyScroll, setKeyScroll] = useState$1({
     down: 0,
     up: 0,
@@ -21260,7 +21260,7 @@ function useOnTheFlyModel(_ref) {
       maxRows: 1
     };
   }
-  const id = useRef();
+  const id = useRef$1();
   if (!id.current) {
     id.current = uid();
   }
@@ -21429,7 +21429,7 @@ function ListBoxWrapper(_ref) {
     stateName,
     options
   });
-  const elementRef = useRef(element);
+  const elementRef = useRef$1(element);
   const selections = hasExternalSelectionsApi ? options.selectionsApi : useObjectSelections(app, model, [elementRef, '.njs-action-toolbar-more', '.njs-action-toolbar-popover'], options)[0];
   const opts = useMemo$1(() => _objectSpread2(_objectSpread2({}, options), {}, {
     selections,
@@ -23760,7 +23760,7 @@ const Cell = forwardRef((_ref6, ref) => {
   const cellElementId = "njs-cell-".concat(currentId);
   const [selections] = useObjectSelections(app, model, ["#".concat(cellElementId), '.njs-action-toolbar-popover']); // elements which will not trigger the click out listener
   const [hovering, setHover] = useState$1(false);
-  const hoveringDebouncer = useRef({
+  const hoveringDebouncer = useRef$1({
     enter: null,
     leave: null
   });
@@ -23772,7 +23772,7 @@ const Cell = forwardRef((_ref6, ref) => {
     borderRadius,
     boxShadow
   } = useStyling(layout, halo.public.theme, halo.app, themeName);
-  const focusHandler = useRef({
+  const focusHandler = useRef$1({
     focusToolbarButton(last) {
       // eslint-disable-next-line react/no-this-in-sfc
       this.emit(last ? 'focus_toolbar_last' : 'focus_toolbar_first');
@@ -24933,6 +24933,42 @@ function useMemo(fn, deps) {
   return h.value[1];
 }
 
+/**
+ * Reference object returned from useRef
+ * @interface Ref
+ * @template R
+ * @property {R} current Current value
+ */
+
+/**
+ * Creates a reference to a value not needed for rendering
+ *
+ * While Nebula does not have a virtual DOM, it is still useful
+ * to have a reference to an object that is retained across
+ * renders and in it self does not trigger a render.
+ * @entry
+ * @template R
+ * @param {R} initialValue - The initial value.
+ * @returns {Ref<R>} An object with the current value
+ * @example
+ * import { useRef } from '@nebula.js/stardust';
+ * // ...
+ * // initiate with simple value
+ * const timesRendered = useRef(0);
+ *
+ * useEffect(() => {
+ *  render(layout);
+ *  // increments the render counter, a useState would trigger another render
+ *  timesRendered.current += 1;
+ * },[layout]);
+ *
+ */
+function useRef(initialValue) {
+  return useMemo(() => ({
+    current: initialValue
+  }), []);
+}
+
 /**
  * Runs a callback function when a dependent changes.
  *
@@ -30063,5 +30099,5 @@ const __DO_NOT_USE__ = {
   locale
 };
 
-export { mocker as EnigmaMocker, __DO_NOT_USE__, conversion, index as embed, onContextMenu, onTakeSnapshot, useAction, useApp, useAppLayout, useConstraints, useDeviceType, useEffect, useElement, useEmbed, useEmitter, useGlobal, useImperativeHandle, useInteractionState, useKeyboard, useLayout, useMemo, useModel, useNavigation, useOptions, usePlugins, usePromise, useRect, useRenderState, useSelections, useStaleLayout, useState, useTheme, useTranslator };
+export { mocker as EnigmaMocker, __DO_NOT_USE__, conversion, index as embed, onContextMenu, onTakeSnapshot, useAction, useApp, useAppLayout, useConstraints, useDeviceType, useEffect, useElement, useEmbed, useEmitter, useGlobal, useImperativeHandle, useInteractionState, useKeyboard, useLayout, useMemo, useModel, useNavigation, useOptions, usePlugins, usePromise, useRect, useRef, useRenderState, useSelections, useStaleLayout, useState, useTheme, useTranslator };
 //# sourceMappingURL=dev.js.map