@sprinklrjs/spaceweb 12.33.2 → 14.11.0

package/esm/search/cvaConfigs.js

@@ -0,0 +1,53 @@
+import { cvaWrapper } from '../style/cvaWrapper';
+export var rootCVA = cvaWrapper('search', 'root', [
+    'border-solid border outline-none box-border',
+    {
+        variants: {
+            $size: {
+                xxxs: 'px-0.5 h-6 rounded-5',
+                xxs: 'px-1.25 h-7 rounded-6',
+                xs: 'px-1.25 h-8 rounded-7',
+                sm: 'px-1.5 h-9 rounded-8',
+                md: 'px-1.5 h-10 rounded-8',
+                lg: 'px-1.5 h-10 rounded-8',
+                small: 'px-1.75 h-6 rounded-4',
+                medium: 'px-2.75 h-8 rounded-8',
+                large: 'px-2.75 h-10 rounded-8',
+                'x-large': 'px-5 h-16 rounded-8',
+            },
+            $shape: {
+                pill: 'rounded-[--sw-rounded]',
+            },
+            $variant: {
+                default: 'border-transparent hover:spr-border-06 spr-ui-02',
+                light: 'spr-border-primary spr-bg-primary',
+            },
+            $disabled: {
+                true: 'forced-colors:border-disabled spr-bg-secondary',
+            },
+            $isFocused: {
+                true: 'spr-border-quinary',
+            },
+        },
+        defaultVariants: {
+            $size: 'md',
+            $deprecatedAIThemeEnabled: false,
+            // CVA compound variant requires boolean
+            $disabled: false,
+            $isFocused: false,
+            $variant: 'default',
+            $shape: 'default',
+            $intent: 'default',
+        },
+        compoundVariants: [
+            { $intent: 'ai', $isFocused: true, $deprecatedAIThemeEnabled: false, className: 'spr-border-06' },
+            {
+                $intent: 'default',
+                $variant: 'light',
+                $isFocused: false,
+                $disabled: false,
+                className: 'hover:spr-border-quaternary',
+            },
+        ],
+    },
+]);

package/esm/search/search.d.ts

@@ -3,6 +3,7 @@ import { IconButtonProps } from '../button/IconButton';
 import { SearchProps } from './types';
 export declare const ClearIconButton: ({ overrides, ...props }: IconButtonProps) => ReactElement;
 export declare const Search: {
-    ({ size: _size, debounceInterval, placeholder, overrides, className, style, variant, ...props }: SearchProps): ReactElement;
+    ({ size: _size, debounceInterval, placeholder, overrides, className, style, variant, shape, intent, ...props }: SearchProps): ReactElement;
     displayName: string;
+    __standard: string;
 };

package/esm/search/search.js

@@ -10,66 +10,88 @@ import ClearIcon from '../icon/components/close';
 import DefaultSearchIcon from '../icon/components/search';
 import { Input } from '../input';
 import { mergeOverrides, useOverrides } from '../overrides';
-import { getInputContainerStyles, getRootStyles, getSearchSizeTheme } from './styled-components';
+import { getInputClassNames, getRootStyles, getSearchSizeTheme } from './styled-components';
 import { useLocale } from '../locale';
 import { useStyle } from '../style';
-import { getDefaultSize } from '../helpers/themeHelpers';
+import { getComponentSizeTheme, getDefaultSize } from '../helpers/themeHelpers';
 var SearchIconContainer = function (_a) {
     var _b;
-    var size = _a.size, marginX = _a.marginX, className = _a.className, overrides = _a.overrides, props = __rest(_a, ["size", "marginX", "className", "overrides"]);
+    var size = _a.size, className = _a.className, overrides = _a.overrides, $size = _a.$size, props = __rest(_a, ["size", "className", "overrides", "$size"]);
     var _c = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.SearchIcon, DefaultSearchIcon), 2), SearchIcon = _c[0], searchIconProps = _c[1];
     var sharedProps = _pick(props, ['$isFocused', '$disabled', '$required', '$bordered', '$variant', '$intent']);
-    return (_jsx(Box, __assign({}, props, { className: ['flex items-center', { marginLeft: marginX, marginRight: marginX }, className] }, { children: _jsx(SearchIcon, __assign({ size: size }, sharedProps, searchIconProps, { className: ['spr-icon-03', (_b = searchIconProps) === null || _b === void 0 ? void 0 : _b.className] }), void 0) }), void 0));
+    var theme = useStyle().theme;
+    var themeOverrideMarginX = (_b = getComponentSizeTheme(theme, 'search', $size, getDefaultSize(theme))) === null || _b === void 0 ? void 0 : _b.searchIconMarginX;
+    var marginX = 'mx-1.75';
+    if ($size === 'xxxs' || $size === 'xxs') {
+        marginX = 'mx-1';
+    }
+    if ($size === 'xs') {
+        marginX = 'mx-1.25';
+    }
+    if ($size === 'small') {
+        marginX = 'ml-0 mr-1';
+    }
+    if ($size === 'medium' || $size === 'large' || $size === 'x-large') {
+        marginX = 'ml-0 mr-2';
+    }
+    return (_jsx(Box, __assign({}, props, { className: [
+            'flex items-center',
+            marginX,
+            className,
+            //@ts-ignore -- Style type mismatch
+            function () {
+                return themeOverrideMarginX
+                    ? { marginInlineStart: themeOverrideMarginX, marginInlineEnd: themeOverrideMarginX }
+                    : {};
+            },
+        ] }, { children: _jsx(SearchIcon, __assign({ size: size }, sharedProps, searchIconProps, { className: ['spr-icon-primary', searchIconProps === null || searchIconProps === void 0 ? void 0 : searchIconProps.className] })) })));
 };
 export var ClearIconButton = function (_a) {
     var overrides = _a.overrides, props = __rest(_a, ["overrides"]);
     var mergedOverrides = useMemo(function () {
         return mergeOverrides({
             BaseButton: {
-                style: [
-                    'h-5 w-5 spr-text-02 hover:spr-text-01 focus:spr-text-01 hover:spr-ui-03 focus:spr-ui-03 bg-transparent',
-                    function (_a) {
-                        var px2rem = _a.px2rem;
-                        return ({ minWidth: px2rem(20) });
-                    },
+                className: [
+                    'h-5 w-5 spr-text-02 hover:spr-text-01 focus:spr-text-01 hover:spr-ui-03 focus:spr-ui-03 bg-transparent min-w-5',
                 ],
                 props: { type: 'button' },
             },
         }, overrides);
     }, [overrides]);
-    return (_jsx(IconButton, __assign({}, props, { overrides: mergedOverrides }, { children: _jsx(ClearIcon, { "data-testid": "search-clear", size: 10 }, void 0) }), void 0));
+    return (_jsx(IconButton, __assign({}, props, { overrides: mergedOverrides }, { children: _jsx(ClearIcon, { "data-testid": "search-clear", size: 10 }) })));
 };
 export var Search = function (_a) {
-    var _size = _a.size, _b = _a.debounceInterval, debounceInterval = _b === void 0 ? 200 : _b, placeholder = _a.placeholder, overrides = _a.overrides, className = _a.className, style = _a.style, _c = _a.variant, variant = _c === void 0 ? 'default' : _c, props = __rest(_a, ["size", "debounceInterval", "placeholder", "overrides", "className", "style", "variant"]);
+    var _size = _a.size, _b = _a.debounceInterval, debounceInterval = _b === void 0 ? 200 : _b, placeholder = _a.placeholder, overrides = _a.overrides, className = _a.className, style = _a.style, _c = _a.variant, variant = _c === void 0 ? 'default' : _c, _d = _a.shape, shape = _d === void 0 ? 'default' : _d, intent = _a.intent, props = __rest(_a, ["size", "debounceInterval", "placeholder", "overrides", "className", "style", "variant", "shape", "intent"]);
     var theme = useStyle().theme;
     var size = _size !== null && _size !== void 0 ? _size : getDefaultSize(theme);
-    var searchIconMarginX = getSearchSizeTheme(theme, size, 'searchIconMarginX');
     var searchIconSize = getSearchSizeTheme(theme, size, 'iconSize');
-    var fontSize = getSearchSizeTheme(theme, size, 'fontSize');
-    var lineHeight = getSearchSizeTheme(theme, size, 'lineHeight');
     var locale = useLocale();
     var mergedOverrides = React.useMemo(function () {
-        var sharedProps = add$props({ size: size, variant: variant });
+        var sharedProps = add$props({ size: size, variant: variant, intent: intent, shape: shape });
         return mergeOverrides({
             Root: {
-                style: [getRootStyles, className, style],
+                className: [getRootStyles, className],
+                style: style,
                 props: sharedProps,
             },
             InputContainer: {
-                style: getInputContainerStyles,
+                className: 'outline-none box-border border-transparent bg-transparent hover:bg-transparent border-none rounded-0',
                 props: sharedProps,
             },
             Input: {
-                style: ['px-0 py-0', { fontSize: fontSize, lineHeight: lineHeight !== null && lineHeight !== void 0 ? lineHeight : '18px' }],
+                className: getInputClassNames,
                 props: sharedProps,
             },
             Before: {
                 component: SearchIconContainer,
-                props: __assign(__assign({ size: searchIconSize, marginX: searchIconMarginX }, sharedProps), { overrides: overrides }),
+                props: __assign(__assign({ size: searchIconSize }, sharedProps), { overrides: overrides }),
             },
             ClearIcon: ClearIconButton,
         }, overrides);
-    }, [overrides, size, className, style, variant, fontSize, searchIconSize, searchIconMarginX, lineHeight]);
-    return (_jsx(Input, __assign({ "data-spaceweb": "Search", placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : locale.search.searchPlaceholder, overrides: mergedOverrides, debounceInterval: debounceInterval }, props), void 0));
+    }, [overrides, size, className, style, variant, searchIconSize, intent, shape]);
+    return (_jsx(Input, __assign({ "data-spaceweb": "Search", placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : locale.search.searchPlaceholder, overrides: mergedOverrides, debounceInterval: debounceInterval, 
+        // @ts-ignore -- Style type mismatch
+        style: shape === 'pill' ? { '--sw-rounded': '96px' } : undefined }, props)));
 };
 Search.displayName = 'Search';
+Search.__standard = 'Component';

package/esm/search/stateful-search.js

@@ -11,5 +11,5 @@ export var StatefulSearch = function (_a) {
             onChange(e);
         }
     }, [onChange]);
-    return _jsx(Search, __assign({ value: query, onChange: handleChange }, restProps), void 0);
+    return _jsx(Search, __assign({ value: query, onChange: handleChange }, restProps));
 };

package/esm/search/styled-components.d.ts

@@ -1,4 +1,4 @@
-import { Styles } from '../types';
+import { ClassName } from '../types';
 export declare const getSearchSizeTheme: (theme: any, size: any, prop: any) => any;
-export declare const getInputContainerStyles: Styles;
-export declare const getRootStyles: Styles;
+export declare const getInputClassNames: ClassName;
+export declare const getRootStyles: ClassName;

package/esm/search/styled-components.js

@@ -1,107 +1,81 @@
 import { __assign } from "tslib";
-import { borderColor as borderColorLongHand, borderRadius, borderStyle, borderWidth } from '../helpers/longHandHelpers';
 import { getComponentSizeTheme, getDefaultSize } from '../helpers/themeHelpers';
-var VARIANTS_TOKENS_MAP = {
-    default: {
-        backgroundColor: 'ui02',
-        disabledBackgroundColor: 'ui02',
-        hoverBorderColor: 'border06',
-        focusBorderColor: 'interactive01',
-    },
-    light: {
-        backgroundColor: 'ui01',
-        disabledBackgroundColor: 'ui02',
-        hoverBorderColor: 'border06',
-        focusBorderColor: 'interactive01',
-        borderColor: 'border03',
-    },
-};
-var getSearchComponentTokens = function (variant) { var _a; return (_a = VARIANTS_TOKENS_MAP[variant !== null && variant !== void 0 ? variant : 'default']) !== null && _a !== void 0 ? _a : {}; };
+import { rootCVA } from './cvaConfigs';
 var SIZES_STYLES_MAP = {
     xxxs: {
-        paddingX: '2px',
-        searchIconMarginX: '4px',
-        height: '24px',
-        fontSize: '13px',
         iconSize: 10,
-        borderRadius: '5px',
-        lineHeight: '16px',
     },
     xxs: {
-        paddingX: '5px',
-        searchIconMarginX: '4px',
-        height: '28px',
-        fontSize: '14px',
         iconSize: 10,
-        borderRadius: '6px',
     },
     xs: {
-        paddingX: '5px',
-        searchIconMarginX: '5px',
-        height: '32px',
-        fontSize: '14px',
         iconSize: 12,
-        borderRadius: '7px',
     },
     sm: {
-        paddingX: '6px',
-        searchIconMarginX: '7px',
-        height: '36px',
-        fontSize: '14px',
         iconSize: 12,
-        borderRadius: '8px',
     },
     md: {
-        paddingX: '6px',
-        searchIconMarginX: '7px',
-        height: '40px',
-        fontSize: '14px',
         iconSize: 12,
-        borderRadius: '8px',
     },
     lg: {
-        paddingX: '6px',
-        searchIconMarginX: '7px',
-        height: '40px',
-        fontSize: '14px',
         iconSize: 12,
-        borderRadius: '8px',
+    },
+    small: {
+        iconSize: 12,
+    },
+    medium: {
+        iconSize: 12,
+    },
+    large: {
+        iconSize: 14,
+    },
+    'x-large': {
+        iconSize: 14,
     },
 };
 export var getSearchSizeTheme = function (theme, size, prop) { var _a; return ((_a = getComponentSizeTheme(theme, 'search', size, getDefaultSize(theme))) === null || _a === void 0 ? void 0 : _a[prop]) || SIZES_STYLES_MAP[size][prop]; };
-var rootBackgroundColor = function (_a, _b) {
+var getThemeOverrideInputStyles = function (_a, _b) {
     var theme = _a.theme;
-    var $isFocused = _b.$isFocused, $disabled = _b.$disabled, _c = _b.$variant, $variant = _c === void 0 ? 'default' : _c;
-    var _d = getSearchComponentTokens($variant), backgroundColor = _d.backgroundColor, disabledBackgroundColor = _d.disabledBackgroundColor, borderColor = _d.borderColor;
-    return {
-        backgroundColor: $disabled ? theme.spr[disabledBackgroundColor] : theme.spr[backgroundColor],
-    };
+    var $size = _b.$size;
+    var themeOverrideStyles = getComponentSizeTheme(theme, 'search', $size, getDefaultSize(theme));
+    return __assign(__assign({}, ((themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.fontSize) && {
+        fontSize: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.fontSize,
+    })), ((themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.lineHeight) && {
+        lineHeight: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.lineHeight,
+    }));
 };
-var rootBorderColor = function (utils, props) {
-    var theme = utils.theme;
-    var $isFocused = props.$isFocused, $disabled = props.$disabled, $variant = props.$variant;
-    var _a = getSearchComponentTokens($variant), hoverBorderColor = _a.hoverBorderColor, focusBorderColor = _a.focusBorderColor, borderColor = _a.borderColor;
-    if ($disabled) {
-        return borderColorLongHand(theme.input.disabledBorderColor);
-    }
-    if ($isFocused) {
-        return borderColorLongHand(theme.spr[focusBorderColor]);
-    }
-    return __assign(__assign({}, borderColorLongHand(borderColor ? theme.spr[borderColor] : 'transparent')), { ':hover': borderColorLongHand(theme.spr[hoverBorderColor]) });
+export var getInputClassNames = [
+    'p-0',
+    function (_, _a) {
+        var $size = _a.$size;
+        if ($size === 'xxxs')
+            return 'text-13 leading-4';
+        if ($size === 'small' || $size === 'medium')
+            return 'text-14 leading-150';
+        if ($size === 'large')
+            return 'text-14 leading-150 font-regular placeholder:spr-text-placeholder';
+        if ($size === 'x-large')
+            return 'text-16 leading-150 font-regular placeholder:spr-text-placeholder';
+        return 'text-14 leading-4.5';
+    },
+    // @ts-ignore -- Style type mismatch
+    getThemeOverrideInputStyles,
+];
+var getThemeOverrideRootStyles = function (_a, _b) {
+    var theme = _a.theme;
+    var $size = _b.$size;
+    var themeOverrideStyles = getComponentSizeTheme(theme, 'search', $size, getDefaultSize(theme));
+    return __assign(__assign(__assign({}, ((themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.paddingX) && {
+        paddingInlineStart: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.paddingX,
+        paddingInlineEnd: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.paddingX,
+    })), ((themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.height) && {
+        height: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.height,
+    })), ((themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.borderRadius) && {
+        borderRadius: themeOverrideStyles === null || themeOverrideStyles === void 0 ? void 0 : themeOverrideStyles.borderRadius,
+    }));
 };
-export var getInputContainerStyles = __assign(__assign(__assign(__assign({ outline: 'none', boxSizing: 'border-box' }, borderColorLongHand('transparent')), { backgroundColor: 'transparent', ':hover': { backgroundColor: 'transparent' } }), borderStyle('none')), borderRadius('0'));
 export var getRootStyles = [
-    borderStyle('solid'),
-    borderWidth('1px'),
-    rootBorderColor,
-    rootBackgroundColor,
-    function (_a, _b) {
-        var theme = _a.theme;
-        var $size = _b.$size;
-        var paddingX = getSearchSizeTheme(theme, $size, 'paddingX');
-        var height = getSearchSizeTheme(theme, $size, 'height');
-        var _borderRadius = getSearchSizeTheme(theme, $size, 'borderRadius');
-        return __assign({ height: height, paddingLeft: paddingX, paddingRight: paddingX }, borderRadius(_borderRadius));
-    },
-    { outline: 'none', boxSizing: 'border-box' },
+    rootCVA,
+    // @ts-ignore -- TS2322: Type '({ theme }: StyleUtils, { $size }: SharedProps) => StyleObject' ...
+    getThemeOverrideRootStyles,
 ];

package/esm/search/types.d.ts

@@ -1,25 +1,34 @@
-import { InputProps, SharedProps as InputSharedProps } from '../input/types';
+import { InputOverrides, InputProps, SharedProps as InputSharedProps } from '../input/types';
 import { Override } from '../overrides';
-/**
- * lg size is deprecated. Please use md.
- */
-export declare type Size = 'xxxs' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg';
-export declare type Variant = 'default' | 'light';
-export declare type SearchProps = Omit<InputProps, 'size' | 'type' | 'required' | 'variant' | 'intent' | 'startEnhancer' | 'endEnhancer'> & {
+/** @deprecated */
+type DeprecatedSize = 'xxxs' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg';
+export type Size = DeprecatedSize | 'small' | 'medium' | 'large' | 'x-large';
+/** @deprecated */
+export type Variant = 'default' | 'light';
+export type Intent = 'default'
+/** @deprecated Use 'default' instead. */
+ | 'ai';
+export type Shape = 'default' | 'pill';
+export type SearchProps = Omit<InputProps, 'size' | 'type' | 'required' | 'variant' | 'intent' | 'startEnhancer' | 'endEnhancer' | 'overrides'> & {
     size?: Size;
     bordered?: boolean;
     debounceInterval?: number;
     debouncedOnChange?: InputProps['onChange'];
     variant?: Variant;
+    intent?: Intent;
+    shape?: Shape;
     overrides?: {
+        [key in keyof InputOverrides]?: Override<SharedProps & Record<string, any>>;
+    } & {
         SearchIcon?: Override<Record<string, any>>;
     };
 };
-export declare type SharedProps = Omit<InputSharedProps, '$size'> & {
+export type SharedProps = Omit<InputSharedProps, '$size'> & {
     $size: Size;
     $bordered: boolean;
     $variant: Variant;
 };
-export declare type StatefulSearchProps = Omit<SearchProps, 'value'> & {
+export type StatefulSearchProps = Omit<SearchProps, 'value'> & {
     initialState?: string;
 };
+export {};

package/esm/select/SelectIdsContext.d.ts

@@ -0,0 +1,17 @@
+import { ReactElement } from 'react';
+export type SelectIdsContextValue = {
+    listboxId: string;
+    menuDescriptionId: string;
+    noResultsId: string;
+    inputId: string;
+};
+export declare const SelectIdsContext: import("react").Context<Partial<SelectIdsContextValue>>;
+export declare const useSelectIds: () => Partial<SelectIdsContextValue>;
+export type SelectIdsProviderProps = Partial<SelectIdsContextValue> & {
+    children: (ids: SelectIdsContextValue) => ReactElement;
+};
+/**
+ * Provides stable IDs for the Select component's accessibility attributes.
+ * Uses props when provided, then context from parent SelectIdsProvider, otherwise falls back to React's useId hook.
+ */
+export declare const SelectIdsProvider: ({ listboxId: listboxIdProp, menuDescriptionId: menuDescriptionIdProp, noResultsId: noResultsIdProp, inputId: inputIdProp, children, }: SelectIdsProviderProps) => ReactElement;

package/esm/select/SelectIdsContext.js

@@ -0,0 +1,27 @@
+import { __assign } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import useUniqueId from '../hooks/useUniqueId';
+import { createSingletonContext } from '@sprinklrjs/spaceweb/singleton/createSingletonContext';
+import { useContext, useMemo } from 'react';
+var defaultValue = {};
+export var SelectIdsContext = createSingletonContext(defaultValue, 'SelectIdsContext');
+export var useSelectIds = function () { return useContext(SelectIdsContext); };
+/**
+ * Provides stable IDs for the Select component's accessibility attributes.
+ * Uses props when provided, then context from parent SelectIdsProvider, otherwise falls back to React's useId hook.
+ */
+export var SelectIdsProvider = function (_a) {
+    var _b, _c, _d, _e;
+    var listboxIdProp = _a.listboxId, menuDescriptionIdProp = _a.menuDescriptionId, noResultsIdProp = _a.noResultsId, inputIdProp = _a.inputId, children = _a.children;
+    var fromContext = useSelectIds();
+    var generatedListboxId = useUniqueId();
+    var generatedMenuDescriptionId = useUniqueId();
+    var generatedNoResultsId = useUniqueId();
+    var generatedInputId = useUniqueId();
+    var listboxId = (_b = listboxIdProp !== null && listboxIdProp !== void 0 ? listboxIdProp : fromContext.listboxId) !== null && _b !== void 0 ? _b : generatedListboxId;
+    var menuDescriptionId = (_c = menuDescriptionIdProp !== null && menuDescriptionIdProp !== void 0 ? menuDescriptionIdProp : fromContext.menuDescriptionId) !== null && _c !== void 0 ? _c : generatedMenuDescriptionId;
+    var noResultsId = (_d = noResultsIdProp !== null && noResultsIdProp !== void 0 ? noResultsIdProp : fromContext.noResultsId) !== null && _d !== void 0 ? _d : generatedNoResultsId;
+    var inputId = (_e = inputIdProp !== null && inputIdProp !== void 0 ? inputIdProp : fromContext.inputId) !== null && _e !== void 0 ? _e : generatedInputId;
+    var contextValue = useMemo(function () { return ({ listboxId: listboxId, menuDescriptionId: menuDescriptionId, noResultsId: noResultsId, inputId: inputId }); }, [listboxId, menuDescriptionId, noResultsId, inputId]);
+    return _jsx(SelectIdsContext.Provider, __assign({ value: contextValue }, { children: children(contextValue) }));
+};

package/esm/select/base-select.d.ts

@@ -1,19 +1,17 @@
 /// <reference types="lodash" />
 import type { OnChangeParams as BaseOnChangeParams } from '../baseui/select';
+import type { FocusEvent, ClipboardEvent, ChangeEvent, ReactElement } from 'react';
 import { Component } from 'react';
-import * as React from 'react';
-import { Overrides } from '../overrides';
-import { Locale } from '../locale';
+import { type Overrides } from '../overrides';
+import { type Locale } from '../locale';
 import defaultProps from './default-props';
-import { BaseSelectProps, Option, Options, Value } from './types';
-declare class BaseSelect extends Component<BaseSelectProps & typeof defaultProps, {
-    isContainerFocused: boolean;
-}> {
+import { type BaseSelectProps, type Option, type Options, type Value } from './types';
+declare class BaseSelect extends Component<BaseSelectProps & typeof defaultProps> {
+    static __standard: string;
     static defaultProps: {
         autoFocus: boolean;
         backspaceRemoves: boolean;
         clearable: boolean;
-        closeOnSelect: boolean;
         creatable: boolean;
         deleteRemoves: boolean;
         disabled: boolean;
@@ -23,6 +21,7 @@ declare class BaseSelect extends Component<BaseSelectProps & typeof defaultProps
         filterOptions: ((options: Value, filterValue: string, excludeOptions: Value | null | undefined, a: {
             valueKey: string;
             labelKey: string;
+            filterOnlyCreated?: boolean | undefined;
         }) => Value) | null | undefined;
         filterOutSelected: boolean;
         isLoading: boolean;
@@ -48,35 +47,40 @@ declare class BaseSelect extends Component<BaseSelectProps & typeof defaultProps
         placement: "auto" | "bottom" | "left" | "right" | "top" | "topLeft" | "topRight" | "rightTop" | "rightBottom" | "bottomRight" | "bottomLeft" | "leftBottom" | "leftTop" | undefined;
         virtual: boolean;
         popoverMinWidth: string;
+        expandLimitTagsOnFocus: boolean;
     };
     state: {
-        isContainerFocused: boolean;
+        inputElement: HTMLInputElement | null;
     };
     lastSelectedValue: Value;
     id: any;
-    menuId: any;
     createdOptions: Options | undefined;
+    setInputElement: (el: HTMLInputElement | null) => void;
     getMemoizedNormalizedOptions: (valueKey: string, options1?: Options, options2?: Options) => Value;
     getValueByIdMap: (value: Value, valueKey: string) => import("lodash").Dictionary<Readonly<{
         [x: string]: any;
-        id?: string | number | undefined;
-        label?: React.ReactNode;
+        id?: import("./types").Id | undefined;
+        label?: import("react").ReactNode;
         disabled?: boolean | undefined;
+        disabledTooltipConfig?: Omit<import("../tooltip").ActionableTooltipProps, "children"> | undefined;
         clearableValue?: boolean | undefined;
         isCreatable?: boolean | undefined;
         __optgroup?: string | undefined;
         searchTags?: string[] | undefined;
+        tooltipContent?: import("react").ReactNode | import("../baseui/popover").ContentRenderProp;
+        __closeOnSelect?: boolean | undefined;
+        __onSelectResetsInput?: boolean | undefined;
+        __groupSelectAll?: boolean | undefined;
     }>>;
     getSelectOverrides: () => Overrides<any>;
-    getOptions: (locale: Locale, createdOptions: Options | undefined, options?: Options, shouldPrependClearOption?: boolean | undefined) => Value;
+    getOptions: (locale: Locale, createdOptions: Options | undefined, options?: Options, shouldPrependClearOption?: boolean) => Value;
     defaultCreateOption: (label: string) => Options;
     getCreatedOptions: (option: Option) => Promise<Options>;
-    getCreatedValues: (options: Options) => Options;
-    handleBlur: (e: React.FocusEvent | MouseEvent) => void;
+    handleBlur: (e: FocusEvent | MouseEvent) => void;
     handleChange: (params: BaseOnChangeParams) => Promise<void>;
-    handlePaste: (e: React.ClipboardEvent) => void;
-    handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => Promise<void>;
-    inputRef: React.RefObject<HTMLInputElement>;
-    render(): React.ReactElement;
+    handlePaste: (e: ClipboardEvent) => void;
+    handleInputChange: (e: ChangeEvent<HTMLInputElement>) => Promise<void>;
+    scrollContainer: HTMLElement | null;
+    render(): ReactElement;
 }
 export default BaseSelect;