@nebula.js/stardust 3.1.2 → 3.1.3

package/core/package.json

@@ -1,7 +1,7 @@
 {
   "module": "esm/index.js",
   "peerDependencies": {
-    "@mui/material": "^5.11.4",
+    "@mui/material": "^5.11.7",
     "@mui/icons-material": "^5.11.0",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",

package/dist/stardust.dev.js

@@ -1,5 +1,5 @@
 /*
-* @nebula.js/stardust v3.1.2
+* @nebula.js/stardust v3.1.3
 * Copyright (c) 2023 QlikTech International AB
 * Released under the MIT license.
 */
@@ -9542,7 +9542,7 @@
 	      }
 
 	      // Make sure the next tab starts from the right place.
-	      // doc.activeElement referes to the origin.
+	      // doc.activeElement refers to the origin.
 	      if (doc.activeElement === rootRef.current && nativeEvent.shiftKey) {
 	        // We need to ignore the next contain as
 	        // it will try to move the focus back to the rootRef element.
@@ -13889,8 +13889,6 @@
 	      color: (theme.vars || theme).palette.action.disabled
 	    }, ownerState.variant === 'outlined' && {
 	      border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`
-	    }, ownerState.variant === 'outlined' && ownerState.color === 'secondary' && {
-	      border: `1px solid ${(theme.vars || theme).palette.action.disabled}`
 	    }, ownerState.variant === 'contained' && {
 	      color: (theme.vars || theme).palette.action.disabled,
 	      boxShadow: (theme.vars || theme).shadows[0],
@@ -14362,7 +14360,7 @@
 	  return cache[key];
 	}
 
-	const NEBULA_VERSION_HASH = "1f4e" ;
+	const NEBULA_VERSION_HASH = "b117" ;
 	ClassNameGenerator$1.configure(componentName => {
 	  return "njs-".concat(NEBULA_VERSION_HASH, "-").concat(componentName.replace('Mui', ''));
 	});
@@ -14881,7 +14879,7 @@
 	  const appRef = React.createRef();
 	  const element = document.createElement('div');
 	  element.style.display = 'none';
-	  element.setAttribute('data-nebulajs-version', "3.1.2" );
+	  element.setAttribute('data-nebulajs-version', "3.1.3" );
 	  element.setAttribute('data-app-id', app.id);
 	  document.body.appendChild(element);
 	  ReactDOM.render( /*#__PURE__*/React.createElement(NebulaApp, {
@@ -16490,7 +16488,7 @@
 	      onChange,
 	      onFocus,
 	      readOnly,
-	      required,
+	      required = false,
 	      tabIndex,
 	      type,
 	      value
@@ -17324,7 +17322,7 @@
 	...GRID_SIZES.map(size => `grid-xs-${size}`), ...GRID_SIZES.map(size => `grid-sm-${size}`), ...GRID_SIZES.map(size => `grid-md-${size}`), ...GRID_SIZES.map(size => `grid-lg-${size}`), ...GRID_SIZES.map(size => `grid-xl-${size}`)]);
 
 	const _excluded$j = ["className", "columns", "columnSpacing", "component", "container", "direction", "item", "rowSpacing", "spacing", "wrap", "zeroMinWidth"];
-	function getOffset(val) {
+	function getOffset$1(val) {
 	  const parse = parseFloat(val);
 	  return `${parse}${String(val).replace(String(parse), '') || 'px'}`;
 	}
@@ -17372,7 +17370,7 @@
 	      if (ownerState.container && ownerState.item && ownerState.columnSpacing !== 0) {
 	        const themeSpacing = theme.spacing(ownerState.columnSpacing);
 	        if (themeSpacing !== '0px') {
-	          const fullWidth = `calc(${width} + ${getOffset(themeSpacing)})`;
+	          const fullWidth = `calc(${width} + ${getOffset$1(themeSpacing)})`;
 	          more = {
 	            flexBasis: fullWidth,
 	            maxWidth: fullWidth
@@ -17472,9 +17470,9 @@
 	      const themeSpacing = theme.spacing(propValue);
 	      if (themeSpacing !== '0px') {
 	        return {
-	          marginTop: `-${getOffset(themeSpacing)}`,
+	          marginTop: `-${getOffset$1(themeSpacing)}`,
 	          [`& > .${gridClasses.item}`]: {
-	            paddingTop: getOffset(themeSpacing)
+	            paddingTop: getOffset$1(themeSpacing)
 	          }
 	        };
 	      }
@@ -17519,10 +17517,10 @@
 	      const themeSpacing = theme.spacing(propValue);
 	      if (themeSpacing !== '0px') {
 	        return {
-	          width: `calc(100% + ${getOffset(themeSpacing)})`,
-	          marginLeft: `-${getOffset(themeSpacing)}`,
+	          width: `calc(100% + ${getOffset$1(themeSpacing)})`,
+	          marginLeft: `-${getOffset$1(themeSpacing)}`,
 	          [`& > .${gridClasses.item}`]: {
-	            paddingLeft: getOffset(themeSpacing)
+	            paddingLeft: getOffset$1(themeSpacing)
 	          }
 	        };
 	      }
@@ -19854,6 +19852,10 @@
 	}));
 	let hystersisOpen = false;
 	let hystersisTimer = null;
+	let cursorPosition = {
+	  x: 0,
+	  y: 0
+	};
 	function composeEventHandler(handler, eventHandler) {
 	  return event => {
 	    if (eventHandler) {
@@ -20078,17 +20080,13 @@
 	  if (!title && title !== 0) {
 	    open = false;
 	  }
-	  const positionRef = reactExports.useRef({
-	    x: 0,
-	    y: 0
-	  });
 	  const popperRef = reactExports.useRef();
 	  const handleMouseMove = event => {
 	    const childrenProps = children.props;
 	    if (childrenProps.onMouseMove) {
 	      childrenProps.onMouseMove(event);
 	    }
-	    positionRef.current = {
+	    cursorPosition = {
 	      x: event.clientX,
 	      y: event.clientY
 	    };
@@ -20179,10 +20177,10 @@
 	      placement: placement,
 	      anchorEl: followCursor ? {
 	        getBoundingClientRect: () => ({
-	          top: positionRef.current.y,
-	          left: positionRef.current.x,
-	          right: positionRef.current.x,
-	          bottom: positionRef.current.y,
+	          top: cursorPosition.y,
+	          left: cursorPosition.x,
+	          right: cursorPosition.x,
+	          bottom: cursorPosition.y,
 	          width: 0,
 	          height: 0
 	        })
@@ -21114,7 +21112,9 @@
 	  let {
 	    select,
 	    confirm,
-	    cancel
+	    cancel,
+	    setScrollPosition,
+	    focusListItems
 	  } = _ref;
 	  const getElement = function (elm) {
 	    let next = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -21129,7 +21129,8 @@
 	    let elementToFocus;
 	    const {
 	      keyCode,
-	      shiftKey = false
+	      shiftKey = false,
+	      ctrlKey = false
 	    } = event.nativeEvent;
 	    switch (keyCode) {
 	      case KEYS.SHIFT:
@@ -21168,6 +21169,22 @@
 	        cancel();
 	        return;
 	      // let it propagate to top-level
+	      case KEYS.HOME:
+	        focusListItems.setFirst(true);
+	        if (ctrlKey) {
+	          setScrollPosition === null || setScrollPosition === void 0 ? void 0 : setScrollPosition('overflowStart');
+	          break;
+	        }
+	        setScrollPosition === null || setScrollPosition === void 0 ? void 0 : setScrollPosition('start');
+	        break;
+	      case KEYS.END:
+	        focusListItems.setLast(true);
+	        if (ctrlKey) {
+	          setScrollPosition === null || setScrollPosition === void 0 ? void 0 : setScrollPosition('overflowEnd');
+	          break;
+	        }
+	        setScrollPosition === null || setScrollPosition === void 0 ? void 0 : setScrollPosition('end');
+	        break;
 	      default:
 	        return;
 	      // don't stop propagation since we want to outsource keydown to other handlers.
@@ -21445,15 +21462,26 @@
 	    showGray = true,
 	    columnCount = 1,
 	    rowCount = 1,
-	    layoutOrder
+	    layoutOrder,
+	    dataOffset,
+	    focusListItems,
+	    listCount
 	  } = data;
 	  let cellIndex;
 	  let styles;
+	  const count = {
+	    max: null,
+	    currentIndex: null
+	  };
 	  if (typeof rowIndex === 'number' && typeof columnIndex === 'number') {
 	    if (layoutOrder === 'row') {
 	      cellIndex = rowIndex * columnCount + columnIndex;
+	      count.max = rowCount;
+	      count.currentIndex = rowIndex;
 	    } else {
 	      cellIndex = columnIndex * rowCount + rowIndex;
+	      count.max = columnCount;
+	      count.currentIndex = columnIndex;
 	    }
 	    const padding = 0;
 	    styles = _objectSpread2(_objectSpread2({}, style), {}, {
@@ -21463,9 +21491,27 @@
 	    });
 	  } else {
 	    cellIndex = index;
+	    count.max = listCount;
+	    count.currentIndex = index;
 	    styles = _objectSpread2({}, style);
 	  }
-	  const handleKeyDownCallback = reactExports.useCallback(getFieldKeyboardNavigation(actions), [actions]);
+	  cellIndex += dataOffset;
+	  const rowRef = reactExports.useRef(null);
+	  reactExports.useEffect(() => {
+	    if (rowRef.current !== null) {
+	      if (count.currentIndex === 0 && focusListItems.first) {
+	        rowRef.current.focus();
+	        focusListItems.setFirst(false);
+	      }
+	      if (count.currentIndex === count.max - 1 && focusListItems.last) {
+	        rowRef.current.focus();
+	        focusListItems.setLast(false);
+	      }
+	    }
+	  }, [rowRef.current]);
+	  const handleKeyDownCallback = reactExports.useCallback(getFieldKeyboardNavigation(_objectSpread2(_objectSpread2({}, actions), {}, {
+	    focusListItems
+	  })), [actions]);
 	  const [isSelected, setSelected] = reactExports.useState(false);
 	  const [cell, setCell] = reactExports.useState();
 	  const [classArr, setClassArr] = reactExports.useState([]);
@@ -21640,6 +21686,7 @@
 	    flexBasisProp: flexBasisVal,
 	    dense: dense
 	  }, /*#__PURE__*/React.createElement(Grid$1, {
+	    ref: rowRef,
 	    container: true,
 	    gap: 0,
 	    className: joinClassNames(['value', ...classArr]),
@@ -23219,11 +23266,18 @@
 	}
 
 	const getIndex = (renderProps, isColumnLayout) => {
-	  if (renderProps !== null && renderProps !== void 0 && renderProps.visibleRowStopIndex || renderProps.visibleColumnStopIndex) {
+	  if ((renderProps === null || renderProps === void 0 ? void 0 : renderProps.visibleRowStopIndex) !== undefined || renderProps.visibleColumnStopIndex !== undefined) {
 	    return isColumnLayout ? renderProps.visibleColumnStopIndex : renderProps.visibleRowStopIndex;
 	  }
 	  return renderProps.visibleStopIndex;
 	};
+	const getIsScrollTop = (renderProps, isColumnLayout) => {
+	  if ((renderProps === null || renderProps === void 0 ? void 0 : renderProps.visibleRowStartIndex) !== undefined || renderProps.visibleColumnStartIndex !== undefined) {
+	    return isColumnLayout ? renderProps.visibleColumnStartIndex === 0 : renderProps.visibleRowStartIndex === 0;
+	  }
+	  return renderProps.visibleStartIndex === 0;
+	};
+	const getIsEndOfData = (qCardinal, index, count, dataOffset) => qCardinal === index * count + dataOffset + count;
 	function handleSetOverflowDisclaimer(_ref) {
 	  let {
 	    renderProps,
@@ -23231,14 +23285,18 @@
 	    maxCount,
 	    columnCount,
 	    rowCount,
-	    overflowDisclaimer
+	    overflowDisclaimer,
+	    qCardinal,
+	    dataOffset
 	  } = _ref;
 	  const isColumnLayout = (layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.layoutOrder) === 'column' && layoutOptions.dataLayout !== 'singleColumn';
 	  const index = getIndex(renderProps, isColumnLayout);
 	  const stopIndex = isColumnLayout ? maxCount.column : maxCount.row;
 	  const count = isColumnLayout ? columnCount : rowCount;
 	  const overflowPossible = count >= stopIndex;
-	  const show = overflowPossible && index >= stopIndex - 1 || overflowDisclaimer.state.show;
+	  const isEndOfData = getIsEndOfData(qCardinal, index, isColumnLayout ? rowCount : columnCount, dataOffset);
+	  const isTopOfOverflowData = !!dataOffset && getIsScrollTop(renderProps, isColumnLayout);
+	  const show = overflowPossible && !isEndOfData && index >= stopIndex - 1 || isTopOfOverflowData || overflowDisclaimer.state.show; // If its shown once, the user have to dismiss to hide it.
 	  overflowDisclaimer.set(show);
 	}
 
@@ -23269,7 +23327,9 @@
 	    listLayout,
 	    sizes,
 	    listCount,
-	    overflowDisclaimer
+	    overflowDisclaimer,
+	    setScrollPosition,
+	    focusListItems
 	  } = _ref;
 	  const {
 	    layoutOptions = {},
@@ -23312,12 +23372,15 @@
 	    actions: {
 	      select,
 	      confirm: () => selections === null || selections === void 0 ? void 0 : selections.confirm.call(selections),
-	      cancel: () => selections === null || selections === void 0 ? void 0 : selections.cancel.call(selections)
+	      cancel: () => selections === null || selections === void 0 ? void 0 : selections.cancel.call(selections),
+	      setScrollPosition
 	    },
 	    frequencyMax,
 	    histogram,
 	    keyboard,
-	    showGray
+	    showGray,
+	    dataOffset: local.current.dataOffset,
+	    focusListItems
 	  });
 	  const List = _ref2 => {
 	    let {
@@ -23334,9 +23397,12 @@
 	      width: width,
 	      itemCount: listCount,
 	      layout: listLayout,
-	      itemData: _objectSpread2({}, commonItemData),
+	      itemData: _objectSpread2(_objectSpread2({}, commonItemData), {}, {
+	        listCount
+	      }),
 	      itemSize: itemSize,
 	      onItemsRendered: renderProps => {
+	        var _layout$qListObject, _layout$qListObject$q;
 	        if (scrollState) {
 	          scrollState.setScrollPos(renderProps.visibleStopIndex);
 	        }
@@ -23346,7 +23412,9 @@
 	          maxCount: sizes.maxCount,
 	          columnCount,
 	          rowCount,
-	          overflowDisclaimer
+	          overflowDisclaimer,
+	          qCardinal: layout === null || layout === void 0 ? void 0 : (_layout$qListObject = layout.qListObject) === null || _layout$qListObject === void 0 ? void 0 : (_layout$qListObject$q = _layout$qListObject.qDimensionInfo) === null || _layout$qListObject$q === void 0 ? void 0 : _layout$qListObject$q.qCardinal,
+	          dataOffset: local.current.dataOffset
 	        });
 	        onItemsRendered(_objectSpread2({}, renderProps));
 	      },
@@ -23370,6 +23438,7 @@
 	    // eslint-disable-next-line no-param-reassign
 	    local.current.listRef = ref;
 	    const handleGridItemsRendered = renderProps => {
+	      var _layout$qListObject2, _layout$qListObject2$;
 	      const renderOptions = deriveRenderOptions({
 	        renderProps,
 	        scrollState,
@@ -23383,7 +23452,9 @@
 	        maxCount: sizes.maxCount,
 	        columnCount,
 	        rowCount,
-	        overflowDisclaimer
+	        overflowDisclaimer,
+	        qCardinal: layout === null || layout === void 0 ? void 0 : (_layout$qListObject2 = layout.qListObject) === null || _layout$qListObject2 === void 0 ? void 0 : (_layout$qListObject2$ = _layout$qListObject2.qDimensionInfo) === null || _layout$qListObject2$ === void 0 ? void 0 : _layout$qListObject2$.qCardinal,
+	        dataOffset: local.current.dataOffset
 	      });
 	      onItemsRendered(renderOptions);
 	    };
@@ -23554,9 +23625,10 @@
 	  const [pages, setPages] = reactExports.useState([]);
 	  let [minimumBatchSize] = reactExports.useState(0);
 	  const loadMoreItems = (startIndex, stopIndex) => {
+	    const offset = local.current.dataOffset;
 	    local.current.queue.push({
-	      start: startIndex,
-	      stop: stopIndex
+	      start: startIndex + offset,
+	      stop: stopIndex + offset
 	    });
 	    const isScrolling = loaderRef.current ?
 	    // eslint-disable-next-line no-underscore-dangle
@@ -23799,6 +23871,47 @@
 	  }, /*#__PURE__*/React.createElement(SmallCloseIcon, null))));
 	}
 
+	const getOffset = (layout, listCount) => {
+	  const totalLength = layout.qListObject.qDimensionInfo.qCardinal;
+	  const offset = totalLength - listCount;
+	  return offset;
+	};
+	function getScrollIndex(_ref) {
+	  let {
+	    position,
+	    isRow,
+	    sizes,
+	    layout,
+	    offset
+	  } = _ref;
+	  let scrollIndex;
+	  let triggerRerender = false;
+	  let newOffset = offset !== null && offset !== void 0 ? offset : 0;
+	  switch (position) {
+	    case 'start':
+	      scrollIndex = 0;
+	      break;
+	    case 'end':
+	      scrollIndex = isRow ? sizes.rowCount : sizes.columnCount;
+	      break;
+	    case 'overflowStart':
+	      newOffset = 0;
+	      scrollIndex = 0;
+	      triggerRerender = true;
+	      break;
+	    case 'overflowEnd':
+	      newOffset = getOffset(layout, sizes.listCount);
+	      scrollIndex = layout.qListObject.qDimensionInfo.qCardinal;
+	      triggerRerender = true;
+	      break;
+	  }
+	  return {
+	    scrollIndex,
+	    offset: newOffset,
+	    triggerRerender
+	  };
+	}
+
 	const _excluded$4 = ["isLoadingData"];
 	const DEFAULT_MIN_BATCH_SIZE = 100;
 	function ListBox(_ref) {
@@ -23831,7 +23944,8 @@
 	  const loaderRef = reactExports.useRef(null);
 	  const local = reactExports.useRef({
 	    queue: [],
-	    validPages: false
+	    validPages: false,
+	    dataOffset: 0
 	  });
 	  const listData = reactExports.useRef({
 	    pages: []
@@ -23889,6 +24003,23 @@
 	    doc: document,
 	    isSingleSelect
 	  });
+	  const {
+	    layoutOptions = {}
+	  } = layout || {};
+	  let isRow = true;
+	  if (layoutOptions.dataLayout) {
+	    isRow = layoutOptions.dataLayout === 'singleColumn' ? true : (layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.layoutOrder) === 'row';
+	  }
+	  const isGrid = (layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.dataLayout) === 'grid';
+	  const scrollToIndex = index => {
+	    const gridIndex = _objectSpread2({}, isRow ? {
+	      rowIndex: index
+	    } : {
+	      columnIndex: index
+	    });
+	    const scrollIndex = isGrid ? gridIndex : index;
+	    loaderRef.current._listRef.scrollToItem(scrollIndex);
+	  };
 	  const fetchData = () => {
 	    local.current.queue = [];
 	    local.current.validPages = false;
@@ -23898,7 +24029,8 @@
 	      if (layout && layout.qSelectionInfo.qInSelections) {
 	        return;
 	      }
-	      loaderRef.current._listRef.scrollToItem(0);
+	      local.current.dataOffset = 0;
+	      scrollToIndex(0);
 	    }
 	  };
 	  if (update) {
@@ -23919,14 +24051,11 @@
 	  }, [loaderRef.current]);
 	  reactExports.useEffect(() => {
 	    fetchData();
-	  }, [layout]);
+	  }, [layout, local.current.dataOffset]);
 	  const textWidth = useTextWidth({
 	    text: getMeasureText(layout),
 	    font: '14px Source sans pro'
 	  });
-	  const {
-	    layoutOptions = {}
-	  } = layout || {};
 	  let minimumBatchSize = DEFAULT_MIN_BATCH_SIZE;
 	  const isVertical = layoutOptions.dataLayout ? layoutOptions.dataLayout === 'singleColumn' : listLayout !== 'horizontal';
 	  const count = layout === null || layout === void 0 ? void 0 : (_layout$qListObject$q = layout.qListObject.qSize) === null || _layout$qListObject$q === void 0 ? void 0 : _layout$qListObject$q.qcy;
@@ -23950,9 +24079,41 @@
 	    listCount
 	  } = sizes;
 	  setStoreValue('listCount', listCount);
+	  const setScrollPosition = position => {
+	    const {
+	      scrollIndex,
+	      offset,
+	      triggerRerender
+	    } = getScrollIndex({
+	      position,
+	      isRow,
+	      sizes,
+	      layout,
+	      offset: local.current.dataOffset
+	    });
+	    local.current.dataOffset = offset;
+	    if (triggerRerender) {
+	      setPages(currentPages => [...currentPages]);
+	    }
+	    scrollToIndex(scrollIndex);
+	  };
 	  const {
 	    textAlign
 	  } = (layout === null || layout === void 0 ? void 0 : layout.qListObject.qDimensionInfo) || {};
+	  const [focusListItem, setFocusListItem] = reactExports.useState({
+	    first: false,
+	    last: false
+	  });
+	  const getFocusState = () => ({
+	    first: focusListItem.first,
+	    setFirst: first => setFocusListItem(prevState => _objectSpread2(_objectSpread2({}, prevState), {}, {
+	      first
+	    })),
+	    last: focusListItem.last,
+	    setLast: last => setFocusListItem(prevState => _objectSpread2(_objectSpread2({}, prevState), {}, {
+	      last
+	    }))
+	  });
 	  const {
 	    List,
 	    Grid
@@ -23981,7 +24142,9 @@
 	    overflowDisclaimer: {
 	      state: overflowDisclaimer,
 	      set: showOverflowDisclaimer
-	    }
+	    },
+	    setScrollPosition,
+	    focusListItems: getFocusState()
 	  });
 	  const {
 	    columnWidth,
@@ -24579,6 +24742,7 @@
 	var SearchIcon = (props => SvgIcon(search(props)));
 
 	const TREE_PATH = '/qListObjectDef';
+	const WILDCARD = '**';
 	const StyledInputAdornment = styled$1(InputAdornment$1)(_ref => {
 	  var _theme$listBox, _theme$listBox$conten;
 	  let {
@@ -24603,12 +24767,15 @@
 	    model,
 	    keyboard,
 	    dense = false,
-	    visible = true
+	    visible = true,
+	    wildCardSearch = true
 	  } = _ref3;
 	  const {
 	    translator
 	  } = reactExports.useContext(InstanceContext);
 	  const [value, setValue] = reactExports.useState('');
+	  const [wildcardOn, setWildcardOn] = reactExports.useState(false);
+	  const inputRef = reactExports.useRef();
 	  const theme = useTheme$1();
 	  const {
 	    getStoreValue
@@ -24635,6 +24802,13 @@
 	      selections.removeListener && selections.removeListener('deactivated', abortSearch);
 	    };
 	  }, []);
+	  reactExports.useEffect(() => {
+	    if (wildcardOn && inputRef.current) {
+	      const cursorPos = value.length - 1;
+	      inputRef.current.setSelectionRange(cursorPos, cursorPos); // place the cursor in the wildcard
+	      setWildcardOn(false);
+	    }
+	  }, [wildcardOn, inputRef.current]);
 	  const onChange = async e => {
 	    setValue(e.target.value);
 	    if (!e.target.value.length) {
@@ -24643,6 +24817,10 @@
 	    return model.searchListObjectFor(TREE_PATH, e.target.value);
 	  };
 	  const handleFocus = () => {
+	    if (wildCardSearch) {
+	      setValue(WILDCARD);
+	      setWildcardOn(true);
+	    }
 	    if (!selections.isModal()) {
 	      selections.begin(['/qListObjectDef']);
 	    }
@@ -24706,6 +24884,7 @@
 	        paddingBottom: '5px'
 	      }
 	    }],
+	    inputRef: inputRef,
 	    size: "small",
 	    fullWidth: true,
 	    placeholder: translator.get('Listbox.Search'),
@@ -26507,6 +26686,7 @@
 	  const searchHeight = dense ? 27 : 40;
 	  const extraheight = dense ? 39 : 49;
 	  const minHeight = 49 + (searchVisible ? searchHeight : 0) + extraheight;
+	  const wildCardSearch = layout === null || layout === void 0 ? void 0 : layout.wildCardSearch;
 	  const onShowSearch = () => {
 	    const newValue = !showSearch;
 	    setShowSearch(newValue);
@@ -26603,7 +26783,8 @@
 	    dense: dense,
 	    keyboard: keyboard,
 	    visible: searchVisible,
-	    searchContainerRef: searchContainerRef
+	    searchContainerRef: searchContainerRef,
+	    wildCardSearch: wildCardSearch
 	  })), /*#__PURE__*/React.createElement(Grid$1, {
 	    item: true,
 	    xs: true
@@ -26948,6 +27129,9 @@
 	  const [showState, setShowstate] = reactExports.useState(!!options.show);
 	  const handleCloseShowState = () => {
 	    setShowstate(false);
+	    if (options.onPopoverClose) {
+	      options.onPopoverClose();
+	    }
 	  };
 	  return /*#__PURE__*/React.createElement(ListBoxPopover, {
 	    show: showState,
@@ -33948,6 +34132,23 @@
 	    let selectionsApi = null;
 	    let selectionsComponentReference = null;
 
+	    /**
+	     * @ignore
+	     * @typedef { 'fieldPopoverClose' } EmbedEventTypes
+	     */
+
+	    /**
+	     * Event listener function on instance
+	     *
+	     * @ignore
+	     * @method
+	     * @name Embed#on
+	     * @param {EmbedEventTypes} eventType event type that function needs to listen
+	     * @param {Function} callback a callback function to run when event emits
+	     * @example
+	     * api.on('someEvent', () => {...});
+	     */
+
 	    /**
 	     * @class
 	     * @alias Embed
@@ -34182,7 +34383,10 @@
 	            root.remove(api._popoverInstance);
 	            api._popoverInstance = null;
 	          }
-	          const opts = getOptions(options);
+	          const onPopoverClose = () => api.emit('fieldPopoverClose');
+	          const opts = getOptions(_objectSpread2({
+	            onPopoverClose
+	          }, options));
 	          api._popoverInstance = React.createElement(ListBoxPopoverWrapper, {
 	            element: anchorElement,
 	            key: uid(),
@@ -34197,6 +34401,7 @@
 	    };
 	    halo.public.nebbie = api;
 	    halo.types = types;
+	    eventmixin(api);
 	    return api;
 	  }