@sprinklrjs/spaceweb 12.14.4 → 12.33.2

package/date-picker/TimeInput.js

@@ -70,6 +70,6 @@ var TimeInput = function (_a) {
         }, overrides);
     }, [error, value, overrides, time, minTime, maxTime, dateHelpers]);
     var _d = (0, tslib_1.__read)((0, overrides_1.useOverrides)(mergedOverrides === null || mergedOverrides === void 0 ? void 0 : mergedOverrides.TimePicker, time_picker_1.TimePicker), 2), TimePicker = _d[0], timeSelectProps = _d[1];
-    return ((0, jsx_runtime_1.jsx)(TimePicker, (0, tslib_1.__assign)({ adapter: adapter, size: "sm", value: value, onChange: handleChange, creatable: true, clearable: true, disabled: disabled, minTime: minTime && dateHelpers.isSameDay(value, minTime) ? roundUpTime(minTime) : undefined, maxTime: dateHelpers.isSameDay(value, maxTime) ? maxTime : undefined }, timeSelectProps), void 0));
+    return ((0, jsx_runtime_1.jsx)(TimePicker, (0, tslib_1.__assign)({ adapter: adapter, value: value, onChange: handleChange, creatable: true, clearable: true, disabled: disabled, minTime: minTime && dateHelpers.isSameDay(value, minTime) ? roundUpTime(minTime) : undefined, maxTime: dateHelpers.isSameDay(value, maxTime) ? maxTime : undefined }, timeSelectProps), void 0));
 };
 exports.TimeInput = TimeInput;

package/date-picker/index.d.ts

@@ -1,7 +1,7 @@
 import Calendar from './Calendar';
 import DatePickerInput from './DatePickerInput';
 export { Calendar };
-export { StyledCalendarContainer, StyledCalendarHeader, StyledInputWrapper, StyledMonth, StyledMonthContainer, StyledMonthHeader, StyledMonthYearSelectButton, StyledMonthYearSelectIconContainer, StyledNextButton, StyledPrevButton, StyledRoot, StyledSelectorContainer, StyledWeek, StyledWeekdayHeader, } from 'baseui/datepicker/styled-components';
+export { StyledCalendarContainer, StyledCalendarHeader, StyledInputWrapper, StyledMonth, StyledMonthContainer, StyledMonthHeader, StyledMonthYearSelectButton, StyledMonthYearSelectIconContainer, StyledNextButton, StyledPrevButton, StyledRoot, StyledSelectorContainer, StyledWeek, StyledWeekdayHeader, } from '../baseui/datepicker/styled-components';
 export { DatePicker } from './DatePicker';
 export { DatePickerInput };
 export { StatelessDatePicker } from './StatelessDatePicker';

package/date-picker/index.js

@@ -6,7 +6,7 @@ var Calendar_1 = (0, tslib_1.__importDefault)(require("./Calendar"));
 exports.Calendar = Calendar_1.default;
 var DatePickerInput_1 = (0, tslib_1.__importDefault)(require("./DatePickerInput"));
 exports.DatePickerInput = DatePickerInput_1.default;
-var styled_components_1 = require("baseui/datepicker/styled-components");
+var styled_components_1 = require("../baseui/datepicker/styled-components");
 Object.defineProperty(exports, "StyledCalendarContainer", { enumerable: true, get: function () { return styled_components_1.StyledCalendarContainer; } });
 Object.defineProperty(exports, "StyledCalendarHeader", { enumerable: true, get: function () { return styled_components_1.StyledCalendarHeader; } });
 Object.defineProperty(exports, "StyledInputWrapper", { enumerable: true, get: function () { return styled_components_1.StyledInputWrapper; } });

package/date-picker/stateful-container.d.ts

@@ -3,7 +3,7 @@ import { StatefulContainerProps } from './types';
 declare const StatefulContainer: {
     ({ adapter, onChange, value, startOpen, ...props }: StatefulContainerProps): ReactElement;
     defaultProps: {
-        adapter: import("baseui/datepicker/utils/types").DateIOAdapter<Date>;
+        adapter: import("../baseui/datepicker/utils/types").DateIOAdapter<Date>;
     };
 };
 export default StatefulContainer;

package/date-picker/stateful-container.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var React = (0, tslib_1.__importStar)(require("react"));
-var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
+var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-fns-adapter"));
 var useDatePickerState_1 = require("./useDatePickerState");
 var utils_1 = require("../time-range-picker/utils");
 var StatefulContainer = function (_a) {

package/date-picker/styled-components.js

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCalendarContainerStyles = exports.StyledFooterBeforeEnhancer = exports.StyledFooter = exports.getDayStyles = exports.StyledInputWrapper = void 0;
 var tslib_1 = require("tslib");
-var day_state_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/day-state"));
-var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
+var day_state_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/day-state"));
+var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-fns-adapter"));
 var style_1 = require("../style");
 exports.StyledInputWrapper = (0, style_1.styled)('div');
 var getEdgeDayBeforeStyle = function (code, firstChild, peekNextMonth) {
@@ -105,12 +105,13 @@ var getTempRTLAdaptedStyles = function (code) {
     return dayStyles[code] || {};
 };
 var getDayStyles = function (todaySOD) { return [
-    'text-12 leading-8 w-9',
+    'text-12 leading-8 w-9 flex items-center justify-center',
     function (_a, props) {
         var theme = _a.theme, px2rem = _a.px2rem;
-        var $isHighlighted = props.$isHighlighted, $hasRangeHighlighted = props.$hasRangeHighlighted, $date = props.$date, $selected = props.$selected, $isHovered = props.$isHovered, $range = props.$range, $outsideMonthWithinRange = props.$outsideMonthWithinRange, $startOfMonth = props.$startOfMonth, $endOfMonth = props.$endOfMonth, $hasDateLabel = props.$hasDateLabel, $month = props.$month;
+        var $isHighlighted = props.$isHighlighted, $hasRangeHighlighted = props.$hasRangeHighlighted, $date = props.$date, $selected = props.$selected, $isHovered = props.$isHovered, $range = props.$range, $outsideMonthWithinRange = props.$outsideMonthWithinRange, $startOfMonth = props.$startOfMonth, $endOfMonth = props.$endOfMonth, $month = props.$month;
         var code = (0, day_state_1.default)(props);
         var $outsideMonth = new Date($date).getMonth() !== $month;
+        var $isCompact = theme.density === 'COMPACT';
         var backgroundColor = 'transparent';
         if ($selected) {
             backgroundColor = theme.spr.ui04;
@@ -121,12 +122,14 @@ var getDayStyles = function (todaySOD) { return [
         else if ($isHovered || $isHighlighted || props.$pseudoHighlighted) {
             backgroundColor = theme.spr.ui05;
         }
-        return (0, tslib_1.__assign)((0, tslib_1.__assign)({ height: $hasDateLabel ? px2rem('60px') : px2rem('36px'), paddingLeft: px2rem('6px'), paddingRight: px2rem('6px'), ':after': (0, tslib_1.__assign)((0, tslib_1.__assign)({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($isHighlighted &&
+        return (0, tslib_1.__assign)((0, tslib_1.__assign)({ 
+            // Todo:- Need to remove this ternary expression and this $hasDatelable prop
+            height: $isCompact ? px2rem('30px') : px2rem('36px'), width: $isCompact ? px2rem('30px') : px2rem('36px'), paddingLeft: px2rem('6px'), paddingRight: px2rem('6px'), ':after': (0, tslib_1.__assign)((0, tslib_1.__assign)({ left: 'unset', height: '100%', width: '100%', borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($isHighlighted &&
                 !$selected &&
                 !$isHovered &&
                 !$hasRangeHighlighted && {
                 backgroundColor: 'transparent',
-            })), { backgroundColor: backgroundColor, height: '100%', top: 0 }), ':before': (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
+            })), { backgroundColor: backgroundColor, top: 0 }), ':before': (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ top: '0px', height: '100%', borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
                 ? {
                     borderTopLeftRadius: '100%',
                     borderBottomLeftRadius: '100%',

package/date-picker/types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { CalendarProps as BaseCalendarProps, DatepickerProps as BaseDatepickerProps, SharedStylePropsT } from 'baseui/datepicker';
+import { CalendarProps as BaseCalendarProps, DatepickerProps as BaseDatepickerProps, SharedStylePropsT } from '../baseui/datepicker';
 import { TimePickerProps } from '../time-picker';
 import { InputSize, InputVariant } from '../input';
 import { Override } from '../overrides/types';
@@ -19,6 +19,7 @@ export declare type DateTimeSelectSharedProps = {
 export declare type DatepickerOverrides<T = SharedStyleProps> = {
     CalendarContainer?: Override<T>;
     CalendarHeader?: Override<T>;
+    TimezonePicker?: Override<T>;
     Calendar?: Override<CalendarProps & Record<string, any>>;
     Day?: Override<T>;
     Input?: Override<T>;

package/date-picker/utils.d.ts

@@ -1,4 +1,4 @@
-import DateHelpers from 'baseui/datepicker/utils/date-helpers';
+import DateHelpers from '../baseui/datepicker/utils/date-helpers';
 import { Locale } from '../locale';
 interface FormatDateParams {
     date: Date | Date[] | undefined;
@@ -12,7 +12,7 @@ export declare const normalizeDashes: (formatString: string) => string;
 export declare const formatDate: ({ showTimezone, ...params }: FormatDateParams) => string;
 export declare const getAriaLabel: (value: Date | Date[] | undefined, formatDisplayValue: (date?: Date | Date[] | undefined) => string, locale: Locale) => string;
 export declare const prepareLocale: (locale?: globalThis.Locale, options?: {
-    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    weekStartsOn?: 0 | 2 | 1 | 3 | 4 | 5 | 6 | undefined;
 } | undefined) => any;
 export declare const isTimeInRange: (date: Date | Array<Date | undefined | null> | null | undefined, { minDate, maxDate, dateHelpers, }: {
     minDate?: Date | null | undefined;

package/date-picker/utils.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.isDayInRange = exports.isTimeInRange = exports.prepareLocale = exports.getAriaLabel = exports.formatDate = exports.normalizeDashes = void 0;
 var tslib_1 = require("tslib");
 var en_US_1 = (0, tslib_1.__importDefault)(require("date-fns/locale/en-US"));
-var i18n_interpolation_1 = (0, tslib_1.__importDefault)(require("baseui/helpers/i18n-interpolation"));
-var date_helpers_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-helpers"));
-var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
+var i18n_interpolation_1 = (0, tslib_1.__importDefault)(require("../baseui/helpers/i18n-interpolation"));
+var date_helpers_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-helpers"));
+var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-fns-adapter"));
 var constants_1 = require("./constants");
 // replacing both hyphens and em-dashes with en-dashes
 var normalizeDashes = function (formatString) { return formatString.replace(/-/g, '–').replace(/—/g, '–'); };

package/esm/ClientOnly.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+declare type ClientOnlyProps = {
+    children: ReactNode;
+};
+export declare const ClientOnly: ({ children }: ClientOnlyProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/esm/ClientOnly.js

@@ -0,0 +1,15 @@
+import { __read } from "tslib";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { useTransitionState } from './hooks/useTransitionState';
+export var ClientOnly = function (_a) {
+    var children = _a.children;
+    var _b = __read(useTransitionState(false), 2), hasMounted = _b[0], setHasMounted = _b[1];
+    useEffect(function () {
+        setHasMounted(true);
+    }, [setHasMounted]);
+    if (!hasMounted) {
+        return null;
+    }
+    return _jsx(_Fragment, { children: children }, void 0);
+};

package/esm/allComponentsAndUtilities.d.ts

@@ -43,7 +43,6 @@ export * as Switch from './switch';
 export * as Tabs from './tabs';
 export * as Tag from './tag';
 export * as TextArea from './textarea';
-export * as Themes from './themes';
 export * as TimePicker from './time-picker';
 export * as TimeRangePicker from './time-range-picker';
 export * as TimeZonePicker from './time-zone-picker';
@@ -54,3 +53,7 @@ export * as PaymentCard from './payment-card';
 export * as PhoneInput from './phone-input';
 export * as DateInput from './date-input';
 export * as Breadcrumb from './breadcrumb';
+export * as Transition from './transitions/transition';
+export * as Collapse from './transitions/collapse';
+export * as Grow from './transitions/grow';
+export * as Fade from './transitions/fade';

package/esm/allComponentsAndUtilities.js

@@ -82,8 +82,6 @@ import * as Tag_1 from './tag';
 export { Tag_1 as Tag };
 import * as TextArea_1 from './textarea';
 export { TextArea_1 as TextArea };
-import * as Themes_1 from './themes';
-export { Themes_1 as Themes };
 import * as TimePicker_1 from './time-picker';
 export { TimePicker_1 as TimePicker };
 import * as TimeRangePicker_1 from './time-range-picker';
@@ -104,3 +102,11 @@ import * as DateInput_1 from './date-input';
 export { DateInput_1 as DateInput };
 import * as Breadcrumb_1 from './breadcrumb';
 export { Breadcrumb_1 as Breadcrumb };
+import * as Transition_1 from './transitions/transition';
+export { Transition_1 as Transition };
+import * as Collapse_1 from './transitions/collapse';
+export { Collapse_1 as Collapse };
+import * as Grow_1 from './transitions/grow';
+export { Grow_1 as Grow };
+import * as Fade_1 from './transitions/fade';
+export { Fade_1 as Fade };

package/esm/asyncSelect/asyncSelect.d.ts

@@ -3,7 +3,7 @@
  */
 import { ReactElement, ReactNode } from 'react';
 import { AsyncSelectProps } from './types';
-declare const AsyncSelect: ({ loadOptions, initialOptions, resolveSelectedOptions, value, ...restProps }: AsyncSelectProps & {
+declare const AsyncSelect: ({ loadOptions, initialOptions, resolveSelectedOptions, value, hideSelectAll, ...restProps }: AsyncSelectProps & {
     children?: ReactNode;
 }) => ReactElement;
 export { AsyncSelect };

package/esm/asyncSelect/asyncSelect.js

@@ -3,14 +3,15 @@ import { jsx as _jsx } from "react/jsx-runtime";
 /**
  *  Created by Aneree on 03/11/20.
  */
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { Select } from '../select';
 import { useAsyncSelect } from './hooks/useAsyncSelect';
 import { arrayToGroupedOptions } from './helpers';
 import { UNGROUPED_ID } from '../select/constants';
 var UNGROUP_GROUP_CONFIG = [{ id: UNGROUPED_ID, label: 'Ungrouped' }];
 var AsyncSelect = function (_a) {
-    var loadOptions = _a.loadOptions, initialOptions = _a.initialOptions, resolveSelectedOptions = _a.resolveSelectedOptions, value = _a.value, restProps = __rest(_a, ["loadOptions", "initialOptions", "resolveSelectedOptions", "value"]);
+    var loadOptions = _a.loadOptions, initialOptions = _a.initialOptions, resolveSelectedOptions = _a.resolveSelectedOptions, value = _a.value, _b = _a.hideSelectAll, hideSelectAll = _b === void 0 ? false : _b, restProps = __rest(_a, ["loadOptions", "initialOptions", "resolveSelectedOptions", "value", "hideSelectAll"]);
+    var _c = __read(useState(true), 2), hasMore = _c[0], setHasMore = _c[1];
     var adaptedLoadOptions = useCallback(function (input, groupFilters) { return __awaiter(void 0, void 0, void 0, function () {
         var _a, filter, _b, options, complete;
         return __generator(this, function (_c) {
@@ -23,6 +24,7 @@ var AsyncSelect = function (_a) {
                     return [4 /*yield*/, loadOptions(input, filter.pageNumber)];
                 case 1:
                     _b = _c.sent(), options = _b.options, complete = _b.complete;
+                    setHasMore(!complete);
                     return [2 /*return*/, {
                             groups: [{ group: filter.group, options: options, complete: complete }],
                         }];
@@ -49,7 +51,7 @@ var AsyncSelect = function (_a) {
         var _a;
         return (value ? (_a = {}, _a[UNGROUPED_ID] = value, _a) : value);
     }, [value]);
-    var _b = useAsyncSelect(__assign(__assign({}, restProps), { initialOptions: useMemo(function () { return arrayToGroupedOptions(initialOptions || []); }, [initialOptions]), loadOptions: adaptedLoadOptions, groupConfig: UNGROUP_GROUP_CONFIG, resolveSelectedOptions: resolveSelectedOptions ? adaptedResolveSelectedOptions : undefined, value: adaptedValue })), resultCountMap = _b.resultCountMap, selectProps = __rest(_b, ["resultCountMap"]);
-    return _jsx(Select, __assign({}, selectProps, { hideSelectAll: true }), void 0);
+    var _d = useAsyncSelect(__assign(__assign({}, restProps), { initialOptions: useMemo(function () { return arrayToGroupedOptions(initialOptions || []); }, [initialOptions]), loadOptions: adaptedLoadOptions, groupConfig: UNGROUP_GROUP_CONFIG, resolveSelectedOptions: resolveSelectedOptions ? adaptedResolveSelectedOptions : undefined, value: adaptedValue })), resultCountMap = _d.resultCountMap, selectProps = __rest(_d, ["resultCountMap"]);
+    return _jsx(Select, __assign({}, selectProps, { hideSelectAll: hideSelectAll || hasMore }), void 0);
 };
 export { AsyncSelect };

package/esm/asyncSelect/groupedAsyncSelect.d.ts

@@ -2,4 +2,4 @@ import { GroupedAsyncSelectProps } from './types';
 import { ReactNode } from 'react';
 export declare const GroupedAsyncSelect: ({ onChange, showSelectAll, selectAllSelected, selectOnTab, ...restProps }: GroupedAsyncSelectProps & {
     children?: ReactNode;
-}) => JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/esm/asyncSelect/groupedAsyncSelect.js

@@ -9,8 +9,10 @@ import { arrayToGroupedOptions } from './helpers';
 import _reduce from 'lodash/reduce';
 import _isObject from 'lodash/isObject';
 import defaultProps from '../select/default-props';
+import { useLocale } from '../locale';
 export var GroupedAsyncSelect = function (_a) {
     var onChange = _a.onChange, showSelectAll = _a.showSelectAll, selectAllSelected = _a.selectAllSelected, selectOnTab = _a.selectOnTab, restProps = __rest(_a, ["onChange", "showSelectAll", "selectAllSelected", "selectOnTab"]);
+    var locale = useLocale();
     var adaptedOnChange = useCallback(function (params) {
         var groupedValue = arrayToGroupedOptions(params.value);
         return onChange === null || onChange === void 0 ? void 0 : onChange(__assign(__assign({}, params), { value: groupedValue, valueKeys: _reduce(groupedValue, function (acc, values, groupId) {
@@ -29,9 +31,10 @@ export var GroupedAsyncSelect = function (_a) {
                     groupConfig: restProps.groupConfig.map(function (group) { return (__assign(__assign({}, group), { count: resultCountMap[group.id] })); }),
                     clearAsOption: restProps.clearAsOption,
                     selectOnTab: selectOnTab,
+                    shouldDisplaySelectAll: showSelectAll,
                 },
             },
         }, selectProps.overrides);
-    }, [selectProps.overrides, restProps.groupConfig, resultCountMap, restProps.clearAsOption, selectOnTab]);
-    return (_jsx(Select, __assign({}, selectProps, { overrides: overrides, hideSelectAll: !showSelectAll, __selectAllShouldReturnAllOptions: showSelectAll, __selectAllSelected: selectAllSelected }, ((selectProps === null || selectProps === void 0 ? void 0 : selectProps.type) === 'overlay' ? { scrollContainer: 'menuContainer' } : {})), void 0));
+    }, [selectProps.overrides, restProps.groupConfig, resultCountMap, restProps.clearAsOption, selectOnTab, showSelectAll]);
+    return (_jsx(Select, __assign({}, selectProps, { overrides: overrides, hideSelectAll: !showSelectAll, __selectAllShouldReturnAllOptions: showSelectAll, __selectAllSelected: selectAllSelected }, ((selectProps === null || selectProps === void 0 ? void 0 : selectProps.type) === 'overlay' ? { scrollContainer: 'menuContainer' } : {}), { "aria-label": "".concat(selectProps['aria-label'] || '', " ").concat(locale.select.collapsibleMenuDescription) }), void 0));
 };

package/esm/asyncSelect/helpers.d.ts

@@ -4,15 +4,16 @@
 import { RefObject } from 'react';
 import * as React from 'react';
 import { AllOptionsMap, GroupConfig, GroupedOptions, Option } from './types';
-import { normalizeOptions } from 'baseui/select/utils';
+import { normalizeOptions } from '../baseui/select/utils';
 import { Value } from '../select/types';
-export declare const getNoResultsMsg: ({ isLoading, minimumInput, inputText, noResultsMsg, searchingText, emptyInputMsg, }: {
+export declare const getNoResultsMsg: ({ isLoading, minimumInput, inputText, noResultsMsg, searchingText, emptyInputMsg, searchable, }: {
     isLoading: boolean;
     minimumInput: number;
     inputText: string;
     noResultsMsg?: React.ReactNode;
     searchingText: React.ReactNode;
     emptyInputMsg: string;
+    searchable?: boolean | undefined;
 }) => string | React.ReactNode | undefined;
 export declare const shouldPaginate: (element: HTMLElement, paginationBuffer?: number) => boolean;
 export declare const getInputValue: (inputRef: RefObject<HTMLInputElement>) => string;

package/esm/asyncSelect/helpers.js

@@ -1,8 +1,8 @@
 import { __assign, __read, __spreadArray } from "tslib";
-import { normalizeOptions } from 'baseui/select/utils';
+import { normalizeOptions } from '../baseui/select/utils';
 import { UNGROUPED_ID } from '../select/constants';
 export var getNoResultsMsg = function (_a) {
-    var isLoading = _a.isLoading, minimumInput = _a.minimumInput, inputText = _a.inputText, noResultsMsg = _a.noResultsMsg, searchingText = _a.searchingText, emptyInputMsg = _a.emptyInputMsg;
+    var isLoading = _a.isLoading, minimumInput = _a.minimumInput, inputText = _a.inputText, noResultsMsg = _a.noResultsMsg, searchingText = _a.searchingText, emptyInputMsg = _a.emptyInputMsg, _b = _a.searchable, searchable = _b === void 0 ? true : _b;
     if (isLoading) {
         return searchingText;
     }
@@ -10,6 +10,8 @@ export var getNoResultsMsg = function (_a) {
     if (minimumInput > 0 && inputText.length < minimumInput) {
         return "Type at least ".concat(minimumInput, " characters to search");
     }
+    if (searchable === false)
+        return noResultsMsg;
     return inputText ? noResultsMsg : emptyInputMsg;
 };
 export var shouldPaginate = function (element, paginationBuffer) {

package/esm/asyncSelect/hooks/useAsyncOptionHandlers.d.ts

@@ -4,7 +4,7 @@
 import { MutableRefObject, UIEvent } from 'react';
 import { Options } from '../../select';
 import { SetStateFunc, AllOptionsMap, AsyncSelectProps, LoadOptions, GroupedOptions, GroupConfig } from '../types';
-import { Value } from 'baseui/select/types';
+import { Value } from '../../baseui/select/types';
 interface UseAsyncOptionHandlersArgs {
     valueKey: string;
     isLoading: boolean;
@@ -19,8 +19,9 @@ interface UseAsyncOptionHandlersArgs {
     groupConfig: GroupConfig;
     selectedOptions?: Value;
     moveSelectedOptionsToTop: boolean;
+    sortedOptionsRef: MutableRefObject<GroupedOptions>;
 }
-declare const useAsyncOptionHandlers: ({ inputRef, valueKey, isLoading, setOptions, loadOptions, minimumInput, setIsLoading, paginationBuffer, setAllOptionsMap, createOption: propsCreateOption, groupConfig, selectedOptions, moveSelectedOptionsToTop, }: UseAsyncOptionHandlersArgs) => {
+declare const useAsyncOptionHandlers: ({ inputRef, valueKey, isLoading, setOptions, sortedOptionsRef, loadOptions, minimumInput, setIsLoading, paginationBuffer, setAllOptionsMap, createOption: propsCreateOption, groupConfig, selectedOptions, moveSelectedOptionsToTop, }: UseAsyncOptionHandlersArgs) => {
     onPaginate: (event: UIEvent<HTMLElement>, itemGroup?: string) => void;
     onInputChange: () => void;
     fetchOptions: (itemGroups: {

package/esm/asyncSelect/hooks/useAsyncOptionHandlers.js

@@ -3,12 +3,14 @@ import { __assign, __awaiter, __generator, __read, __spreadArray } from "tslib";
  *  Created by Aneree on 15/01/21.
  */
 import { useRef, useCallback, useState } from 'react';
+//components
+import { LOADING_KEY } from '../../select';
 //hooks
 import { useLatest } from '../../hooks/useLatest';
-import { shouldPaginate, addOptionsInMap, getInputValue, initGroupOptions, arrayToGroupedOptions, } from '../helpers';
+import { shouldPaginate, addOptionsInMap, getInputValue, initGroupOptions, arrayToGroupedOptions } from '../helpers';
 import { UNGROUPED_ID } from '../../select/constants';
 var useAsyncOptionHandlers = function (_a) {
-    var inputRef = _a.inputRef, valueKey = _a.valueKey, isLoading = _a.isLoading, setOptions = _a.setOptions, loadOptions = _a.loadOptions, minimumInput = _a.minimumInput, setIsLoading = _a.setIsLoading, paginationBuffer = _a.paginationBuffer, setAllOptionsMap = _a.setAllOptionsMap, propsCreateOption = _a.createOption, groupConfig = _a.groupConfig, selectedOptions = _a.selectedOptions, moveSelectedOptionsToTop = _a.moveSelectedOptionsToTop;
+    var inputRef = _a.inputRef, valueKey = _a.valueKey, isLoading = _a.isLoading, setOptions = _a.setOptions, sortedOptionsRef = _a.sortedOptionsRef, loadOptions = _a.loadOptions, minimumInput = _a.minimumInput, setIsLoading = _a.setIsLoading, paginationBuffer = _a.paginationBuffer, setAllOptionsMap = _a.setAllOptionsMap, propsCreateOption = _a.createOption, groupConfig = _a.groupConfig, selectedOptions = _a.selectedOptions, moveSelectedOptionsToTop = _a.moveSelectedOptionsToTop;
     var pageRef = useRef({});
     var completeRef = useRef({});
     var isPaginatingRef = useRef({});
@@ -51,11 +53,13 @@ var useAsyncOptionHandlers = function (_a) {
                             var group = _a.group, pageNumber = _a.pageNumber;
                             if (pageNumber) {
                                 updatedOptions[group] = __spreadArray(__spreadArray([], __read(prevOptions[group]), false), __read(groupedOptions_1[group]), false);
+                                sortedOptionsRef.current[group] = __spreadArray(__spreadArray([], __read(sortedOptionsRef.current[group]), false), __read(groupedOptions_1[group]), false);
                             }
                             else {
                                 updatedOptions[group] =
                                     moveSelectedOptionsToTop && selectedOptionsByGroup_1[group]
-                                        ? __spreadArray(__spreadArray([], __read(selectedOptionsByGroup_1[group]), false), __read(groupedOptions_1[group]), false) : groupedOptions_1[group];
+                                        ? __spreadArray(__spreadArray([], __read(selectedOptionsByGroup_1[group].filter(function (selectedOption) { return !selectedOption[LOADING_KEY]; })), false), __read(groupedOptions_1[group]), false) : groupedOptions_1[group];
+                                sortedOptionsRef.current[group] = groupedOptions_1[group];
                             }
                         });
                         return updatedOptions;
@@ -63,10 +67,13 @@ var useAsyncOptionHandlers = function (_a) {
                     itemGroups.forEach(function (_a) {
                         var group = _a.group, pageNumber = _a.pageNumber;
                         pageRef.current[group] = pageNumber;
-                        isPaginatingRef.current[group] = false;
                     });
                     return [3 /*break*/, 4];
                 case 3:
+                    itemGroups.forEach(function (_a) {
+                        var group = _a.group;
+                        isPaginatingRef.current[group] = false;
+                    });
                     clearTimeout(timeoutId);
                     setIsLoading(false);
                     return [7 /*endfinally*/];
@@ -74,14 +81,15 @@ var useAsyncOptionHandlers = function (_a) {
             }
         });
     }); }, [
-        inputRef,
+        setIsLoading,
         loadOptionsRef,
+        inputRef,
+        selectedOptionsRef,
         setAllOptionsMap,
-        setIsLoading,
-        setOptions,
+        sortedOptionsRef,
         updateResultCount,
         valueKeyRef,
-        selectedOptionsRef,
+        moveSelectedOptionsToTop,
     ]);
     var onPaginate = useCallback(function (event, itemGroup) {
         var _a;
@@ -98,7 +106,9 @@ var useAsyncOptionHandlers = function (_a) {
         if (getInputValue(inputRef).length < minimumInputRef.current) {
             //reset state
             setIsLoading(false);
-            setOptions(initGroupOptions(groupConfig));
+            var emptyOptions = initGroupOptions(groupConfig);
+            sortedOptionsRef.current = emptyOptions;
+            setOptions(emptyOptions);
             pageRef.current = {};
             completeRef.current = {};
             setResultCountMap({});

package/esm/asyncSelect/hooks/useAsyncSelect.js

@@ -12,7 +12,7 @@ import { useAsyncOptionHandlers } from './useAsyncOptionHandlers';
 import { useResolveSelectedOptions } from './useResolveSelectedOptions';
 //helpers
 import { getInputValue, getNoResultsMsg, initGroupOptions, mergeOptions } from '../helpers';
-import { normalizeOptions } from 'baseui/select/utils';
+import { normalizeOptions } from '../../baseui/select/utils';
 import { add$props } from '../../helpers';
 //utils
 import { mergeOverrides } from '../../overrides';
@@ -22,31 +22,33 @@ var EMPTY_OBJ = {};
 export var useAsyncSelect = function (params) {
     var loadOptions = params.loadOptions, searchingText = params.searchingText, paginationBuffer = params.paginationBuffer, debounceInterval = params.debounceInterval, resolveSelectedOptions = params.resolveSelectedOptions, _a = params.minimumInput, minimumInput = _a === void 0 ? 0 : _a, _b = params.loadOnMount, loadOnMount = _b === void 0 ? false : _b, _c = params.loadOnFocus, loadOnFocus = _c === void 0 ? false : _c, _d = params.initialOptions, initialOptions = _d === void 0 ? EMPTY_OBJ : _d, _e = params.listenAllInputChanges, listenAllInputChanges = _e === void 0 ? true : _e, groupConfig = params.groupConfig, resolveValuesOnUpdate = params.resolveValuesOnUpdate, hideUnresolvedValues = params.hideUnresolvedValues, _f = params.moveSelectedOptionsToTop, moveSelectedOptionsToTop = _f === void 0 ? false : _f, 
     //selectProps
-    onInputChange = params.onInputChange, noResultsMsg = params.noResultsMsg, overrides = params.overrides, groupedValue = params.value, controlRef = params.controlRef, propsInputRef = params.inputRef, propsCreateOption = params.createOption, _g = params.valueKey, valueKey = _g === void 0 ? defaultProps.valueKey : _g, _h = params.labelKey, labelKey = _h === void 0 ? defaultProps.labelKey : _h, propsOnChange = params.onChange, restSelectProps = __rest(params, ["loadOptions", "searchingText", "paginationBuffer", "debounceInterval", "resolveSelectedOptions", "minimumInput", "loadOnMount", "loadOnFocus", "initialOptions", "listenAllInputChanges", "groupConfig", "resolveValuesOnUpdate", "hideUnresolvedValues", "moveSelectedOptionsToTop", "onInputChange", "noResultsMsg", "overrides", "value", "controlRef", "inputRef", "createOption", "valueKey", "labelKey", "onChange"]);
+    onInputChange = params.onInputChange, noResultsMsg = params.noResultsMsg, overrides = params.overrides, groupedValue = params.value, controlRef = params.controlRef, propsInputRef = params.inputRef, propsCreateOption = params.createOption, _g = params.valueKey, valueKey = _g === void 0 ? defaultProps.valueKey : _g, _h = params.labelKey, labelKey = _h === void 0 ? defaultProps.labelKey : _h, propsOnChange = params.onChange, onOpen = params.onOpen, filterOptions = params.filterOptions, restSelectProps = __rest(params, ["loadOptions", "searchingText", "paginationBuffer", "debounceInterval", "resolveSelectedOptions", "minimumInput", "loadOnMount", "loadOnFocus", "initialOptions", "listenAllInputChanges", "groupConfig", "resolveValuesOnUpdate", "hideUnresolvedValues", "moveSelectedOptionsToTop", "onInputChange", "noResultsMsg", "overrides", "value", "controlRef", "inputRef", "createOption", "valueKey", "labelKey", "onChange", "onOpen", "filterOptions"]);
     var locale = useLocale();
     var loadOnMountRef = useLatest(loadOnMount);
     var _j = __read(useState(function () {
         return mergeOptions(initialOptions, initGroupOptions(groupConfig));
     }), 2), options = _j[0], setOptions = _j[1];
+    var sortedOptionsRef = useRef({});
     var _k = __read(useState(function () {
         return _keyBy(normalizeOptions(initialOptions), valueKey);
     }), 2), allOptionsMap = _k[0], setAllOptionsMap = _k[1];
     var _l = __read(useState(null), 2), inputElement = _l[0], setInputElement = _l[1];
     var inputRef = useLatest(inputElement);
     var combinedRef = useCombinedRefs(setInputElement, propsInputRef);
-    var _m = __read(useState(null), 2), rootRef = _m[0], setRootRef = _m[1];
-    var _o = __read(useState(null), 2), popoverRef = _o[0], setPopoverRef = _o[1];
-    var _p = useResolveSelectedOptions({
+    var rootRef = useRef(null);
+    var popoverRef = useRef(null);
+    var _m = useResolveSelectedOptions({
         groupedValue: groupedValue,
         valueKey: valueKey,
         inputRef: inputRef,
         allOptionsMap: allOptionsMap,
+        sortedOptionsRef: sortedOptionsRef,
         setOptions: setOptions,
         setAllOptionsMap: setAllOptionsMap,
         resolveValuesOnUpdate: resolveValuesOnUpdate,
         resolveSelectedOptions: resolveSelectedOptions,
-    }), unresolvedGroupedValueKeys = _p.unresolvedGroupedValueKeys, isResolvingValues = _p.isResolvingValues;
-    var _q = __read(useState(loadOnMount), 2), _isLoading = _q[0], setIsLoading = _q[1];
+    }), unresolvedGroupedValueKeys = _m.unresolvedGroupedValueKeys, isResolvingValues = _m.isResolvingValues;
+    var _o = __read(useState(loadOnMount), 2), _isLoading = _o[0], setIsLoading = _o[1];
     var isLoading = isResolvingValues || _isLoading;
     var unresolvedValueKeysRef = useRef([]);
     var selectedOptions = useMemo(function () {
@@ -91,7 +93,7 @@ export var useAsyncSelect = function (params) {
         allOptionsMap,
         hideUnresolvedValues,
     ]);
-    var _r = useAsyncOptionHandlers({
+    var _p = useAsyncOptionHandlers({
         valueKey: valueKey,
         isLoading: isLoading,
         minimumInput: minimumInput,
@@ -99,13 +101,14 @@ export var useAsyncSelect = function (params) {
         inputRef: inputRef,
         setAllOptionsMap: setAllOptionsMap,
         setIsLoading: setIsLoading,
+        sortedOptionsRef: sortedOptionsRef,
         setOptions: setOptions,
         loadOptions: loadOptions,
         createOption: propsCreateOption,
         groupConfig: groupConfig,
         selectedOptions: selectedOptions,
         moveSelectedOptionsToTop: moveSelectedOptionsToTop,
-    }), fetchOptions = _r.fetchOptions, onPaginate = _r.onPaginate, inputChangeHandlerToDebounce = _r.onInputChange, createOption = _r.createOption, resultCountMap = _r.resultCountMap;
+    }), fetchOptions = _p.fetchOptions, onPaginate = _p.onPaginate, inputChangeHandlerToDebounce = _p.onInputChange, createOption = _p.createOption, resultCountMap = _p.resultCountMap;
     var _onInputChange = useInputChangeHandler({
         inputElement: inputElement,
         listenAllInputChanges: listenAllInputChanges,
@@ -115,15 +118,18 @@ export var useAsyncSelect = function (params) {
     });
     /************************************************ HANDLING FOCUS ****************************************************/
     var handleFocus = useCallback(function (event) {
+        var _a, _b;
         /**
          * https://developer.mozilla.org/en-US/docs/Web/API/FocusEvent/relatedTarget
          * event.relatedTarget points to last focused element
          */
         var lastFocusedNode = event.relatedTarget;
-        if (loadOnFocus && !(rootRef === null || rootRef === void 0 ? void 0 : rootRef.contains(lastFocusedNode)) && !(popoverRef === null || popoverRef === void 0 ? void 0 : popoverRef.contains(lastFocusedNode))) {
+        if (loadOnFocus &&
+            !((_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.contains(lastFocusedNode)) &&
+            !((_b = popoverRef.current) === null || _b === void 0 ? void 0 : _b.contains(lastFocusedNode))) {
             inputChangeHandlerToDebounce();
         }
-    }, [loadOnFocus, inputChangeHandlerToDebounce, rootRef, popoverRef]);
+    }, [loadOnFocus, inputChangeHandlerToDebounce]);
     /******************************************* HANDLING FETCH ON MOUNT ************************************************/
     useEffect(function () {
         if (loadOnMountRef.current) {
@@ -142,9 +148,10 @@ export var useAsyncSelect = function (params) {
         minimumInput: minimumInput,
         searchingText: searchingText !== null && searchingText !== void 0 ? searchingText : locale.asyncSelect.searchingText,
         emptyInputMsg: locale.asyncSelect.emptyInputMsg,
+        searchable: restSelectProps.searchable,
     });
     var mergedOverrides = useMemo(function () {
-        return mergeOverrides(__assign({ Root: { props: { ref: setRootRef, onFocus: handleFocus } }, Popover: { props: { overrides: { Inner: { props: { ref: setPopoverRef } } } } }, StatefulMenu: { props: { $onPaginate: onPaginate } }, NoResults: { props: add$props({ isLoading: isLoading, inputText: inputText, adaptedNoResultsMsg: adaptedNoResultsMsg }) } }, (params.type === 'overlay'
+        return mergeOverrides(__assign({ Root: { props: { ref: rootRef, onFocus: handleFocus } }, Popover: { props: { overrides: { Inner: { props: { ref: popoverRef } } } } }, StatefulMenu: { props: { $onPaginate: onPaginate } }, NoResults: { props: add$props({ isLoading: isLoading, inputText: inputText, adaptedNoResultsMsg: adaptedNoResultsMsg }) } }, (params.type === 'overlay'
             ? {
                 // In overlaySelect, overflow property is on OverlayContentContainer
                 OverlayContentContainer: { props: { onScroll: onPaginate } },
@@ -171,8 +178,15 @@ export var useAsyncSelect = function (params) {
                         _b);
                 })), false), __read(onChangeParams.value), false) : onChangeParams.value }));
     }, [propsOnChange, valueKey, labelKey]);
-    return __assign(__assign({ children: undefined }, restSelectProps), { options: options, isLoading: isLoading, value: selectedOptions, controlRef: controlRef, inputRef: combinedRef, overrides: mergedOverrides, noResultsMsg: adaptedNoResultsMsg, createOption: createOption, onInputChange: _onInputChange, valueKey: valueKey, labelKey: labelKey, type: restSelectProps.type, resultCountMap: resultCountMap, onChange: onChange, onOpen: function () {
-            moveSelectedOptionsToTop && setOptions(function (prev) { return mergeOptions((selectedOptions || []), prev); });
-            restSelectProps.onOpen && restSelectProps.onOpen();
-        } });
+    return __assign(__assign({ children: undefined }, restSelectProps), { options: options, isLoading: isLoading, value: selectedOptions, controlRef: controlRef, inputRef: combinedRef, overrides: mergedOverrides, noResultsMsg: adaptedNoResultsMsg, createOption: createOption, onInputChange: _onInputChange, valueKey: valueKey, labelKey: labelKey, type: restSelectProps.type, resultCountMap: resultCountMap, onChange: onChange, onOpen: useCallback(function () {
+            moveSelectedOptionsToTop &&
+                setOptions(mergeOptions((selectedOptions || []), sortedOptionsRef.current || []));
+            onOpen && onOpen();
+        }, [moveSelectedOptionsToTop, onOpen, selectedOptions]), filterOptions: useCallback(function () {
+            var param = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                param[_i] = arguments[_i];
+            }
+            return (filterOptions ? filterOptions.apply(void 0, __spreadArray([], __read(param), false)) : param[0]);
+        }, [filterOptions]) });
 };

package/esm/asyncSelect/hooks/useResolveSelectedOptions.d.ts

@@ -13,8 +13,9 @@ interface UseResolveSelectedOptionsArgs {
     inputRef: MutableRefObject<HTMLInputElement | null>;
     setOptions: SetStateFunc<GroupedOptions>;
     setAllOptionsMap: SetStateFunc<AllOptionsMap>;
+    sortedOptionsRef: MutableRefObject<GroupedOptions>;
 }
-declare const useResolveSelectedOptions: ({ groupedValue, valueKey, allOptionsMap, resolveValuesOnUpdate, resolveSelectedOptions, inputRef, setOptions, setAllOptionsMap, }: UseResolveSelectedOptionsArgs) => {
+declare const useResolveSelectedOptions: ({ groupedValue, valueKey, allOptionsMap, resolveValuesOnUpdate, resolveSelectedOptions, inputRef, setOptions, sortedOptionsRef, setAllOptionsMap, }: UseResolveSelectedOptionsArgs) => {
     isResolvingValues: boolean;
     unresolvedGroupedValueKeys: Record<string, Id[]>;
 };

package/esm/asyncSelect/hooks/useResolveSelectedOptions.js

@@ -11,7 +11,7 @@ import { useFirstMountState } from '../../hooks/useFirstMountState';
 //helpers
 import { addOptionsInMap, getInputValue, mergeOptions } from '../helpers';
 var useResolveSelectedOptions = function (_a) {
-    var groupedValue = _a.groupedValue, valueKey = _a.valueKey, allOptionsMap = _a.allOptionsMap, resolveValuesOnUpdate = _a.resolveValuesOnUpdate, resolveSelectedOptions = _a.resolveSelectedOptions, inputRef = _a.inputRef, setOptions = _a.setOptions, setAllOptionsMap = _a.setAllOptionsMap;
+    var groupedValue = _a.groupedValue, valueKey = _a.valueKey, allOptionsMap = _a.allOptionsMap, resolveValuesOnUpdate = _a.resolveValuesOnUpdate, resolveSelectedOptions = _a.resolveSelectedOptions, inputRef = _a.inputRef, setOptions = _a.setOptions, sortedOptionsRef = _a.sortedOptionsRef, setAllOptionsMap = _a.setAllOptionsMap;
     var isFirstMount = useFirstMountState();
     var unresolvedValuesResults = useRef({
         unresolvedGroupedValueKeys: {},
@@ -55,7 +55,8 @@ var useResolveSelectedOptions = function (_a) {
                         //Inject the resolved selected options into the options state
                         // 1. Only if currently shown options are not filtered i.e. user input text is empty (All options need to be shown)
                         if (!getInputValue(inputRef)) {
-                            setOptions(function (prevOptions) { return mergeOptions(prevOptions, options_1); });
+                            sortedOptionsRef.current = mergeOptions(sortedOptionsRef.current, options_1);
+                            setOptions(mergeOptions(sortedOptionsRef.current, options_1));
                         }
                         return [3 /*break*/, 4];
                     case 3:

package/esm/asyncSelect/types.d.ts

@@ -19,12 +19,7 @@ export declare type LoadOptions = (input: string, groupFilters: {
     }>;
 }>;
 export declare type AsyncSelectValue = Array<Id | Option> | Value;
-/**
- * NOTE:
- *   AsyncSelect does not support select all option
- *   removed the support of these props in AsyncSelect
- */
-declare type BaseAsyncSelectProps = Omit<SelectProps, 'isLoading' | 'options' | 'hideSelectAll' | 'value' | 'onChange' | 'scrollContainer'> & {
+declare type BaseAsyncSelectProps = Omit<SelectProps, 'isLoading' | 'options' | 'value' | 'onChange' | 'scrollContainer'> & {
     paginationBuffer?: number;
     searchingText?: ReactNode;
     minimumInput?: number;