@nebula.js/stardust 3.0.2-alpha.0 → 3.0.3

package/dist/stardust.dev.js

@@ -1,5 +1,5 @@
 /*
-* @nebula.js/stardust v3.0.2-alpha.0
+* @nebula.js/stardust v3.0.3
 * Copyright (c) 2022 QlikTech International AB
 * Released under the MIT license.
 */
@@ -17568,7 +17568,7 @@
 	  return cache[key];
 	}
 
-	const NEBULA_VERSION_HASH = "04ac" ;
+	const NEBULA_VERSION_HASH = "8956" ;
 	ClassNameGenerator.configure(componentName => {
 
 	  return "njs-".concat(NEBULA_VERSION_HASH, "-").concat(componentName.replace('Mui', ''));
@@ -18141,7 +18141,7 @@
 	  const appRef = React.createRef();
 	  const element = document.createElement('div');
 	  element.style.display = 'none';
-	  element.setAttribute('data-nebulajs-version', "3.0.2-alpha.0" );
+	  element.setAttribute('data-nebulajs-version', "3.0.3" );
 	  element.setAttribute('data-app-id', app.id);
 	  document.body.appendChild(element);
 	  ReactDOM.render( /*#__PURE__*/React.createElement(NebulaApp, {
@@ -34268,6 +34268,7 @@
 	const TREE_PATH = '/qListObjectDef';
 	function ListBoxSearch(_ref) {
 	  let {
+	    selections,
 	    model,
 	    keyboard,
 	    dense = false,
@@ -34277,44 +34278,68 @@
 	    translator
 	  } = react.exports.useContext(InstanceContext);
 	  const [value, setValue] = react.exports.useState('');
-	  const [isSearching, setIsSearching] = react.exports.useState(false);
 	  const theme = useTheme$1();
 
+	  const cancel = () => selections.isActive() && selections.cancel();
+
 	  const abortSearch = async () => {
-	    await model.abortListObjectSearch(TREE_PATH);
-	    setIsSearching(false);
+	    if (!selections.isModal()) {
+	      return;
+	    }
+
+	    try {
+	      await model.abortListObjectSearch(TREE_PATH);
+	    } finally {
+	      setValue('');
+	    }
 	  };
 
 	  react.exports.useEffect(() => {
-	    if (!visible && isSearching) {
-	      abortSearch();
+	    if (!visible) {
+	      abortSearch(); // abort when toggling off search
 	    }
 	  }, [visible]);
+	  react.exports.useEffect(() => {
+	    selections.on('deactivated', abortSearch);
+	    return () => {
+	      selections.removeListener && selections.removeListener('deactivated', abortSearch);
+	    };
+	  }, []);
 
-	  const onChange = e => {
+	  const onChange = async e => {
 	    setValue(e.target.value);
 
-	    if (e.target.value.length === 0) {
-	      abortSearch();
-	    } else {
-	      model.searchListObjectFor(TREE_PATH, e.target.value);
-	      setIsSearching(true);
+	    if (!e.target.value.length) {
+	      return abortSearch();
+	    }
+
+	    return model.searchListObjectFor(TREE_PATH, e.target.value);
+	  };
+
+	  const handleFocus = () => {
+	    if (!selections.isModal()) {
+	      selections.begin(['/qListObjectDef']);
 	    }
 	  };
 
 	  const onKeyDown = e => {
+	    let response;
+
 	    switch (e.key) {
 	      case 'Enter':
 	        // Maybe we only want to accept if isSearching is true
-	        model.acceptListObjectSearch(TREE_PATH, true);
+	        response = model.acceptListObjectSearch(TREE_PATH, true);
 	        setValue('');
 	        break;
 
 	      case 'Escape':
-	        abortSearch();
-	        setValue('');
+	        response = cancel();
+	        e.preventDefault();
+	        e.stopPropagation();
 	        break;
 	    }
+
+	    return response;
 	  };
 
 	  if (!visible) {
@@ -34351,6 +34376,7 @@
 	    fullWidth: true,
 	    placeholder: translator.get('Listbox.Search'),
 	    value: value,
+	    onFocus: handleFocus,
 	    onChange: onChange,
 	    onKeyDown: onKeyDown,
 	    inputProps: {
@@ -34716,6 +34742,7 @@
 	  }, /*#__PURE__*/React.createElement("div", {
 	    ref: moreAlignTo
 	  }), /*#__PURE__*/React.createElement(ListBoxSearch, {
+	    selections: selections,
 	    model: model,
 	    visible: true
 	  }), /*#__PURE__*/React.createElement(ListBox, {
@@ -36178,15 +36205,25 @@
 	    active: keyboardActive
 	  };
 	  react.exports.useEffect(() => {
-	    const show = () => setShowToolbar(true);
+	    const show = () => {
+	      setShowToolbar(true);
+	    };
 
-	    const hide = () => setShowToolbar(false);
+	    const hide = () => {
+	      setShowToolbar(false);
+
+	      if (search === 'toggle') {
+	        setShowSearch(false);
+	      }
+	    };
 
 	    if (selections) {
-	      if (!selections.isModal(model)) {
+	      if (!selections.isModal()) {
 	        selections.on('deactivated', hide);
 	        selections.on('activated', show);
 	      }
+
+	      setShowToolbar(selections.isActive());
 	    }
 
 	    return () => {
@@ -36196,11 +36233,6 @@
 	      }
 	    };
 	  }, [selections]);
-	  react.exports.useEffect(() => {
-	    if (selections) {
-	      setShowToolbar(selections.isActive());
-	    }
-	  }, [selections]);
 	  const listBoxRef = react.exports.useRef(null);
 	  useConfirmUnfocus(listBoxRef, selections, shouldConfirmOnBlur);
 	  react.exports.useEffect(() => {
@@ -36309,10 +36341,12 @@
 	    item: true,
 	    ref: searchContainerRef
 	  }, /*#__PURE__*/React.createElement(ListBoxSearch, {
+	    selections: selections,
 	    model: model,
 	    dense: dense,
 	    keyboard: keyboard,
-	    visible: searchVisible
+	    visible: searchVisible,
+	    searchContainerRef: searchContainerRef
 	  })), /*#__PURE__*/React.createElement(Grid, {
 	    item: true,
 	    xs: true
@@ -39829,6 +39863,7 @@
 	    },
 	    list: [],
 	    snaps: [],
+	    menus: [],
 	    actions: {
 	      list: []
 	    },
@@ -39946,6 +39981,15 @@
 
 	  return Promise.resolve();
 	}
+	function runMenu(component, menu, event) {
+	  try {
+	    return Promise.all(component.__hooks.menus.map(h => Promise.resolve(h.fn(menu, event)))).then(menus => menus[menus.length - 1]);
+	  } catch (e) {
+	    console.error(e);
+	  }
+
+	  return Promise.resolve();
+	}
 	function getImperativeHandle(component) {
 	  return component.__hooks.imperativeHandle;
 	}
@@ -40022,6 +40066,7 @@
 	    run,
 	    teardown,
 	    runSnaps,
+	    runMenu,
 	    focus,
 	    blur,
 	    observeActions,
@@ -40815,6 +40860,30 @@
 
 	  h.fn = cb;
 	}
+	/**
+	 * Registers a callback that is called when the context menu opens
+	 * @entry
+	 * @param {function(menu, event): void} addItemCallback
+	 * @ignore
+	 * @example
+	 * import { onContextMenu } from '@nebula.js/stardust';
+	 
+	 * onContextMenu((menu, event) => {
+	 *  menu.addItem(item, index);
+	 * });
+	 */
+
+	function onContextMenu(cb) {
+	  const h = getHook(++currentIndex);
+
+	  if (!h.value) {
+	    h.value = 1;
+
+	    currentComponent.__hooks.menus.push(h);
+	  }
+
+	  h.fn = cb;
+	}
 	/**
 	 * @interface RenderState
 	 * @property {any} pending
@@ -41205,6 +41274,10 @@
 	      return generator.component.runSnaps(this, layout);
 	    },
 
+	    onContextMenu(menu, event) {
+	      return generator.component.runMenu(this, menu, event);
+	    },
+
 	    focus() {
 	      generator.component.focus(this);
 	    },
@@ -43936,7 +44009,7 @@
 	var enigmaMocker_dev = {exports: {}};
 
 	/*
-	* @nebula.js/enigma-mocker v3.0.1
+	* @nebula.js/enigma-mocker v3.0.2
 	* Copyright (c) 2022 QlikTech International AB
 	* Released under the MIT license.
 	*/
@@ -44509,6 +44582,7 @@
 	exports.__DO_NOT_USE__ = __DO_NOT_USE__;
 	exports.conversion = conversion;
 	exports.embed = index$1;
+	exports.onContextMenu = onContextMenu;
 	exports.onTakeSnapshot = onTakeSnapshot;
 	exports.useAction = useAction;
 	exports.useApp = useApp;