@vectara/vectara-ui 9.5.2 → 9.5.3

package/lib/components/optionsList/OptionsList.js

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from "classnames";
 import { VuiOptionsListItem } from "./OptionsListItem";
 import { useEffect, useRef } from "react";
@@ -18,6 +18,7 @@ import { VuiFlexItem } from "../flex/FlexItem";
 import { VuiSpinner } from "../spinner/Spinner";
 import { VuiText } from "../typography/Text";
 import { VuiSpacer } from "../spacer/Spacer";
+import { VuiTextColor } from "../typography/TextColor";
 const SIZE = ["s", "m", "l"];
 // https://github.com/typescript-eslint/typescript-eslint/issues/4062
 // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
@@ -54,5 +55,5 @@ export const VuiOptionsList = (_a) => {
                         onClick === null || onClick === void 0 ? void 0 : onClick(value);
                         onSelectOption === null || onSelectOption === void 0 ? void 0 : onSelectOption(value);
                     }, isSelectable: isSelectable, isSelected: isSelected }, rest), label));
-            }), isLoading && (_jsxs(_Fragment, { children: [_jsx(VuiSpacer, { size: "xxs" }), _jsxs(VuiFlexContainer, Object.assign({ alignItems: "center", justifyContent: "center", spacing: "xs" }, { children: [_jsx(VuiFlexItem, Object.assign({ grow: false }, { children: _jsx(VuiSpinner, { size: "xs" }) })), _jsx(VuiFlexItem, Object.assign({ grow: false }, { children: _jsx(VuiText, { children: _jsx("p", { children: "Loading options\u2026" }) }) }))] }))] }))] })));
+            }), isLoading && (_jsxs("div", { children: [_jsx(VuiSpacer, { size: "xxs" }), _jsxs(VuiFlexContainer, Object.assign({ alignItems: "center", justifyContent: "center", spacing: "xs" }, { children: [_jsx(VuiFlexItem, Object.assign({ grow: false }, { children: _jsx(VuiSpinner, { size: "xs" }) })), _jsx(VuiFlexItem, Object.assign({ grow: false }, { children: _jsx(VuiText, { children: _jsx("p", { children: _jsx(VuiTextColor, Object.assign({ color: "subdued" }, { children: "Loading options\u2026" })) }) }) }))] })), _jsx(VuiSpacer, { size: "xxs" })] }))] })));
 };

package/lib/components/searchSelect/SearchSelect.js

@@ -16,6 +16,8 @@ import { VuiPopover } from "../popover/Popover";
 import { VuiTextInput } from "../form";
 import { VuiSpacer } from "../spacer/Spacer";
 import { sortSelectedOptions } from "./sortSelectedOptions";
+import { VuiText } from "../typography/Text";
+import { VuiTextColor } from "../typography/TextColor";
 // https://github.com/typescript-eslint/typescript-eslint/issues/4062
 // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 export const VuiSearchSelect = (_a) => {
@@ -97,5 +99,5 @@ export const VuiSearchSelect = (_a) => {
                             const { value } = event.target;
                             (_a = asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.onSearchChange) === null || _a === void 0 ? void 0 : _a.call(asyncSearch, value);
                             setSearchValue(value);
-                        }, "data-testid": rest["data-testid"] }), _jsx(VuiSpacer, { size: "xxs" })] })), _jsx(VuiOptionsList, { isSelectable: true, isScrollable: true, onScrollToBottom: asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.onLazyLoad, onSelectOption: onSelectOption, selected: selectedOptions, options: visibleOptions, isLoading: asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.isSearching })] })));
+                        }, "data-testid": rest["data-testid"] }), _jsx(VuiSpacer, { size: "xxs" })] })), visibleOptions.length > 0 || (asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.isSearching) ? (_jsx(VuiOptionsList, { isSelectable: true, isScrollable: true, onScrollToBottom: asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.onLazyLoad, onSelectOption: onSelectOption, selected: selectedOptions, options: visibleOptions, isLoading: asyncSearch === null || asyncSearch === void 0 ? void 0 : asyncSearch.isSearching })) : searchValue.trim().length > 0 ? (_jsx(VuiText, Object.assign({ className: "vuiSearchSelect__emptyMessage", align: "center" }, { children: _jsx("p", { children: _jsx(VuiTextColor, Object.assign({ color: "subdued" }, { children: "No results found" })) }) }))) : (_jsx(VuiText, Object.assign({ className: "vuiSearchSelect__emptyMessage", align: "center" }, { children: _jsx("p", { children: _jsx(VuiTextColor, Object.assign({ color: "subdued" }, { children: "No options available" })) }) })))] })));
 };

package/lib/components/searchSelect/_index.scss

@@ -11,3 +11,7 @@
   padding: $sizeXxs $sizeXs;
   border-bottom: 1px solid $borderColor;
 }
+
+.vuiSearchSelect__emptyMessage {
+  padding: $sizeXxs $sizeXs;
+}

package/lib/styles/index.css

@@ -3720,6 +3720,10 @@ h2.react-datepicker__current-month {
   border-bottom: 1px solid #cbd1de;
 }
 
+.vuiSearchSelect__emptyMessage {
+  padding: 4px 8px;
+}
+
 .vuiSpacer {
   flex-shrink: 0;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vectara/vectara-ui",
-  "version": "9.5.2",
+  "version": "9.5.3",
   "homepage": "./",
   "description": "Vectara's design system, codified as a React and Sass component library",
   "author": "Vectara",