@sprinklrjs/spaceweb 14.11.4 → 14.12.0

package/esm/baseui/datepicker/calendar-header.js

@@ -143,10 +143,8 @@ var CalendarHeader = /** @class */ (function (_super) {
                     var isLastMonth = order === monthsShown - 1;
                     return !isLastMonth;
                 }
-                else {
-                    var isFirstMonth = order === 0;
-                    return !isFirstMonth;
-                }
+                var isFirstMonth = order === 0;
+                return !isFirstMonth;
             }
             return false;
         };

package/esm/baseui/datepicker/calendar.d.ts

@@ -1,3 +1,3 @@
 import type { CalendarProps } from './types';
-import { ReactElement } from 'react';
+import type { ReactElement } from 'react';
 export default function Calendar<T = Date>(props: CalendarProps<T>): ReactElement;

package/esm/baseui/datepicker/calendar.js

@@ -17,6 +17,7 @@ import DateHelpers from './utils/date-helpers';
 import { getOverrides } from '../../overrides';
 import { DENSITY, ORIENTATION } from './constants';
 import { isServer, useDocument } from '../../spacewebProvider';
+import { Box } from '../../box';
 var BaseCalendar = /** @class */ (function (_super) {
     __extends(BaseCalendar, _super);
     function BaseCalendar(props) {
@@ -261,7 +262,7 @@ var BaseCalendar = /** @class */ (function (_super) {
                     }, role: "grid", "aria-multiselectable": _this.props.range || null, onKeyDown: _this.onKeyDown }, calendarContainerProps, { "$density": _this.props.density }, { children: _jsx(Month, { adapter: _this.props.adapter, date: monthDate, dateLabel: _this.props.dateLabel, density: _this.props.density, excludeDates: _this.props.excludeDates, filterDate: _this.props.filterDate, getTimeRangesForDate: _this.props.getTimeRangesForDate, highlightedDate: _this.state.highlightedDate, includeDates: _this.props.includeDates, focusedCalendar: _this.state.focused, range: _this.props.range, locale: _this.props.locale, maxDate: _this.props.maxDate, minDate: _this.props.minDate, month: _this.dateHelpers.getMonth(_this.state.date), onDayBlur: _this.blurCalendar, onDayFocus: _this.onDayFocus, onDayClick: _this.props.onDayClick, onDayMouseOver: _this.onDayMouseOver, onDayMouseLeave: _this.onDayMouseLeave, onChange: _this.handleDateChange, overrides: overrides, value: _this.props.value, peekNextMonth: _this.props.peekNextMonth, fixedHeight: _this.props.fixedHeight, hasLockedBehavior: !!_this.props.hasLockedBehavior, selectedInput: _this.props.selectedInput }) }), monthKey));
                 monthList.push(
                 // @ts-ignore
-                _jsx("div", __assign({ className: "grow" }, { children: monthSubComponents }), "month-component-".concat(i)));
+                _jsx(Box, __assign({ className: "grow" }, { children: monthSubComponents }), "month-component-".concat(i)));
             }
             return (_jsx(MonthContainer, __assign({ "$orientation": orientation }, monthContainerProps, { children: monthList })));
         };
@@ -305,7 +306,6 @@ var BaseCalendar = /** @class */ (function (_super) {
     BaseCalendar.prototype.componentDidUpdate = function (prevProps) {
         if (this.props.highlightedDate &&
             !this.dateHelpers.isSameDay(this.props.highlightedDate, prevProps.highlightedDate)) {
-            // eslint-disable-next-line react/no-did-update-set-state -- baseui migration
             this.setState({
                 date: this.props.highlightedDate,
             });
@@ -316,7 +316,6 @@ var BaseCalendar = /** @class */ (function (_super) {
         if (prevProps.value !== this.props.value) {
             var nextDate = this.getDateInView();
             if (!this.isInView(nextDate)) {
-                // eslint-disable-next-line react/no-did-update-set-state -- baseui migration
                 this.setState({
                     date: nextDate,
                 });

package/esm/baseui/datepicker/day.d.ts

@@ -26,7 +26,7 @@ export default class Day<T = Date> extends React.Component<DayProps<T>, DayState
     dateHelpers: DateHelpers<T>;
     constructor(props: DayProps<T>);
     componentDidMount(): void;
-    componentDidUpdate(prevProps: DayProps<T>): void;
+    componentDidUpdate(_prevProps: DayProps<T>): void;
     getDateProp: () => T;
     getMonthProp: () => number;
     /**

package/esm/baseui/datepicker/day.js

@@ -173,7 +173,7 @@ var Day = /** @class */ (function (_super) {
             }
         }
     };
-    Day.prototype.componentDidUpdate = function (prevProps) {
+    Day.prototype.componentDidUpdate = function (_prevProps) {
         if (this.dayElm && this.props.focusedCalendar) {
             if (this.props.highlighted || (!this.props.highlightedDate && this.isSelected())) {
                 this.dayElm.focus();

package/esm/baseui/datepicker/styled-components.js

@@ -209,7 +209,7 @@ export var StyledDay = styled('div', 'spr-text-01 box-border relative text-cente
 // @ts-ignore -- CSS-in-JS -- This is never getting fixed
 function (_a, props) {
     var theme = _a.theme;
-    var $disabled = props.$disabled, $peekNextMonth = props.$peekNextMonth, $range = props.$range, $outsideMonth = props.$outsideMonth, $outsideMonthWithinRange = props.$outsideMonthWithinRange, $hasDateLabel = props.$hasDateLabel, $density = props.$density, $hasLockedBehavior = props.$hasLockedBehavior, $selectedInput = props.$selectedInput, $value = props.$value;
+    var $disabled = props.$disabled, $peekNextMonth = props.$peekNextMonth, $range = props.$range, $outsideMonth = props.$outsideMonth, $outsideMonthWithinRange = props.$outsideMonthWithinRange, _$hasDateLabel = props._$hasDateLabel, $density = props.$density, $hasLockedBehavior = props.$hasLockedBehavior, $selectedInput = props.$selectedInput, $value = props.$value;
     var code = getDayStateCode(props);
     var _b = __read(Array.isArray($value) ? $value : [$value, null], 2), startDate = _b[0], endDate = _b[1];
     var oppositeInputIsPopulated = $selectedInput === INPUT_ROLE.startDate

package/esm/baseui/datepicker/utils/date-helpers.js

@@ -179,10 +179,10 @@ var DateHelpers = /** @class */ (function () {
                 var minDates = includeDates.filter(function (includeDate) { return _this.isOnOrAfterDay(includeDate, minDate); });
                 return _this.min(minDates);
             }
-            else if (includeDates && includeDates.length) {
+            if (includeDates && includeDates.length) {
                 return _this.min(includeDates);
             }
-            else if (!(includeDates && includeDates.length) && minDate) {
+            if (!(includeDates && includeDates.length) && minDate) {
                 return minDate;
             }
             // this condition can't ever be reached
@@ -195,10 +195,10 @@ var DateHelpers = /** @class */ (function () {
                 var maxDates = includeDates.filter(function (includeDate) { return _this.isOnOrBeforeDay(includeDate, maxDate); });
                 return _this.max(maxDates);
             }
-            else if (includeDates) {
+            if (includeDates) {
                 return _this.max(includeDates);
             }
-            else if (!includeDates && maxDate) {
+            if (!includeDates && maxDate) {
                 return maxDate;
             }
             // this condition can't ever be reached

package/esm/baseui/datepicker/utils/index.js

@@ -4,7 +4,6 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-/* eslint-disable import/extensions */
 import defaultAdapter from './date-fns-adapter';
 import DateHelpers from './date-helpers';
 var defaultDateHelpers = new DateHelpers(defaultAdapter);
@@ -32,17 +31,13 @@ export var getEffectiveMinDate = defaultDateHelpers.getEffectiveMinDate;
 export var getEffectiveMaxDate = defaultDateHelpers.getEffectiveMaxDate;
 export var applyTimeToDate = defaultDateHelpers.applyTimeToDate;
 export var applyDateToTime = defaultDateHelpers.applyDateToTime;
-var createDirtySetter = function (setter) {
-    return function (dirtyDate, number) { return setter(wrapDate(dirtyDate), number); };
-};
-var createDirtyGetter = function (getter) {
-    return function (dirtyDate) { return getter(wrapDate(dirtyDate)); };
-};
-var createDirtyCompare = function (compare) {
-    return function (fromDirty, toDirty) {
-        return compare(wrapDate(fromDirty), wrapDate(toDirty));
-    };
-};
+var createDirtySetter = function (setter) { return function (dirtyDate, number) {
+    return setter(wrapDate(dirtyDate), number);
+}; };
+var createDirtyGetter = function (getter) { return function (dirtyDate) { return getter(wrapDate(dirtyDate)); }; };
+var createDirtyCompare = function (compare) { return function (fromDirty, toDirty) {
+    return compare(wrapDate(fromDirty), wrapDate(toDirty));
+}; };
 // ** Re-exported from date-fns **
 // these need to be able to accept either number or date
 // to maintain parity with the old exports

package/esm/baseui/helpers/overrides.d.ts

@@ -11,13 +11,13 @@ export type OverrideObject = {
     style?: ConfigurationOverride | null;
     className?: ConfigurationOverride | null;
 };
-export type Override<T = any> = OverrideObject | (React.ComponentType<any> & {
+export type Override<_T = any> = OverrideObject | (React.ComponentType<any> & {
     component?: undefined;
     props?: undefined;
     style?: undefined;
     className?: undefined;
 });
-export type Overrides<T = any> = {
+export type Overrides<_T = any> = {
     [x: string]: Override;
 };
 /**

package/esm/baseui/helpers/overrides.js

@@ -39,10 +39,8 @@ function getOverrideProps(_override, defaultComponent) {
             // @ts-expect-error
             return __assign(__assign(__assign({}, defaultProps), _override.props), { $className: _override.className, $style: _override.style });
         }
-        else {
-            // @ts-expect-error
-            return __assign(__assign({}, defaultProps), { $className: _override.className, $style: _override.style });
-        }
+        // @ts-expect-error
+        return __assign(__assign({}, defaultProps), { $className: _override.className, $style: _override.style });
     }
     // @ts-expect-error
     return defaultProps;
@@ -59,13 +57,12 @@ export function getOverrides(
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 _override, 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
-defaultComponent
-// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
-) {
+defaultComponent) {
     var Component = getOverride(_override) || defaultComponent;
     if (_override && typeof _override === 'object' && typeof _override.props === 'function') {
         // TODO(v11)
         if (__DEV__) {
+            // eslint-disable-next-line no-console -- debug logging
             console.warn('baseui:Overrides Props as a function will be removed in the next major version. Override the whole component instead. ' +
                 'See https://baseweb.design/guides/understanding-overrides/#override-the-entire-subcomponent');
         }

package/esm/baseui/layer/layer.js

@@ -65,6 +65,7 @@ var LayerComponent = /** @class */ (function (_super) {
         var hasLayersManager = layersManagerHost !== undefined;
         if (process.env.NODE_ENV !== 'production') {
             if (!hasLayersManager) {
+                // eslint-disable-next-line no-console -- debug logging
                 console.warn('`LayersManager` was not found. This occurs if you are attempting to use a component requiring `Layer` without using the `BaseProvider` at the root of your app. Please visit https://baseweb.design/components/base-provider/ for more information');
             }
         }
@@ -136,7 +137,7 @@ var LayerComponent = /** @class */ (function (_super) {
             if (mountNode) {
                 return ReactDOM.createPortal(childrenToRender, mountNode);
             }
-            else if (container) {
+            if (container) {
                 return ReactDOM.createPortal(childrenToRender, container);
             }
             return null;

package/esm/baseui/layer/layers-manager.js

@@ -13,6 +13,7 @@ var StyledLayersContainer = styled('div', {});
 var __DEV__ = process.env.NODE_ENV !== 'production';
 function defaultEventHandlerFn() {
     if (__DEV__) {
+        // eslint-disable-next-line no-console -- debug logging
         console.warn('`LayersManager` was not found. This occurs if you are attempting to use a component requiring `Layer` without using the `BaseProvider` at the root of your app. Please visit https://baseweb.design/components/base-provider/ for more information');
     }
 }
@@ -146,7 +147,7 @@ var LayersManager = /** @class */ (function (_super) {
                 var host = _a.host;
                 if (__DEV__) {
                     if (host !== undefined) {
-                        // eslint-disable-next-line no-console
+                        // eslint-disable-next-line no-console -- debug logging
                         console.warn('There is a LayersManager already exists in your application. It is not recommended to have more than one LayersManager in an application.');
                     }
                 }

package/esm/baseui/layer/tether.js

@@ -101,6 +101,7 @@ var Tether = /** @class */ (function (_super) {
                 (prevProps === null || prevProps === void 0 ? void 0 : prevProps.positionFixed) !== this.props.positionFixed)) {
             if (!this.props.anchorRef) {
                 if (process.env.NODE_ENV !== 'production') {
+                    // eslint-disable-next-line no-console -- debug logging
                     console.warn("[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.\n              See how to pass the ref to an anchor element in the Popover example\n              https://baseweb.design/components/popover/#anchor-ref-handling-example");
                 }
             }

package/esm/baseui/layer/types.d.ts

@@ -1,7 +1,7 @@
 import type * as React from 'react';
 import type { TETHER_PLACEMENT } from './constants';
 import type { Override } from '../../overrides';
-import { ClassName } from '../../types';
+import type { ClassName } from '../../types';
 /** LayersManager */
 export type LayersManagerProps = {
     children: React.ReactNode;

package/esm/baseui/modal/close-icon.js

@@ -1,6 +1,14 @@
 import { __assign } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
+/*
+Copyright (c) Uber Technologies, Inc.
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+*/
 // TODO Switch to using Icon component once it exists
 export function CloseIcon() {
-    return (_jsx("svg", __assign({ width: "10", height: "10", viewBox: "0 0 10 10", style: { stroke: 'currentColor' }, xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M9 1L5 5M1 9L5 5M5 5L1 1M5 5L9 9", strokeWidth: "2", strokeLinecap: "round" }) })));
+    return (
+    // eslint-disable-next-line react/forbid-elements -- baseui close glyph must be raw svg
+    _jsx("svg", __assign({ width: "10", height: "10", viewBox: "0 0 10 10", style: { stroke: 'currentColor' }, xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M9 1L5 5M1 9L5 5M5 5L1 1M5 5L9 9", strokeWidth: "2", strokeLinecap: "round" }) })));
 }

package/esm/baseui/modal/modal.d.ts

@@ -18,9 +18,9 @@ declare class Modal extends React.Component<ModalProps, ModalState> {
     };
     componentDidMount(): void;
     componentWillUnmount(): void;
-    componentDidUpdate(prevProps: ModalProps, prevState: ModalState): void;
+    componentDidUpdate(prevProps: ModalProps, _prevState: ModalState): void;
     handleFocus: (event: SyntheticEvent) => void;
-    handleBlur: (event: SyntheticEvent) => void;
+    handleBlur: (_event: SyntheticEvent) => void;
     disableMountNodeScroll(): void;
     resetMountNodeScroll(): void;
     onEscape: () => void;
@@ -33,7 +33,7 @@ declare class Modal extends React.Component<ModalProps, ModalState> {
     triggerClose(source?: CloseSource): void;
     animateOutComplete: () => void;
     getSharedProps(): Omit<SharedStylePropsArg, 'children'>;
-    getMountNode(): HTMLElement;
+    getMountNode(): HTMLElement | null;
     getChildren(): React.ReactNode;
     renderModal(renderedContent: React.ReactNode): import("react/jsx-runtime").JSX.Element;
     render(): import("react/jsx-runtime").JSX.Element | null;

package/esm/baseui/modal/modal.js

@@ -36,7 +36,7 @@ var Modal = /** @class */ (function (_super) {
                 _this.setState({ isFocusVisible: true });
             }
         };
-        _this.handleBlur = function (event) {
+        _this.handleBlur = function (_event) {
             if (_this.state.isFocusVisible !== false) {
                 _this.setState({ isFocusVisible: false });
             }
@@ -87,7 +87,7 @@ var Modal = /** @class */ (function (_super) {
         this.prevMounted = this.mounted;
         this.mounted = false;
     };
-    Modal.prototype.componentDidUpdate = function (prevProps, prevState) {
+    Modal.prototype.componentDidUpdate = function (prevProps, _prevState) {
         var isOpen = this.props.isOpen;
         if (
         // If isOpen is changing *or* we just mounted and modal should be open
@@ -104,6 +104,8 @@ var Modal = /** @class */ (function (_super) {
     };
     Modal.prototype.disableMountNodeScroll = function () {
         var mountNode = this.getMountNode();
+        if (!mountNode)
+            return;
         this.lastMountNodeOverflowStyle = mountNode.style.overflow || '';
         mountNode.style.overflow = 'hidden';
     };
@@ -214,13 +216,9 @@ var Modal = /** @class */ (function (_super) {
             if (mountedAndOpen) {
                 return (_jsx(Layer, __assign({ onEscape: this.onEscape, onDocumentClick: this.onDocumentClick, mountNode: this.props.mountNode }, { children: this.renderModal(renderedContent) })));
             }
-            else {
-                return _jsx(Hidden, { children: renderedContent });
-            }
-        }
-        else {
-            return null;
+            return _jsx(Hidden, { children: renderedContent });
         }
+        return null;
     };
     Modal.defaultProps = {
         animate: true,

package/esm/baseui/popover/popover.js

@@ -17,6 +17,7 @@ import defaultProps from './default-props';
 import { useUID } from 'react-uid';
 import { LayersManager } from '../../layer';
 import { combineRefs } from '../../hooks/useCombinedRef';
+import { Box } from '../../box';
 var __DEV__ = process.env.NODE_ENV !== 'production';
 function getDefaultState(props) {
     return {
@@ -39,7 +40,6 @@ var PopoverInner = /** @class */ (function (_super) {
         _this.anchorRef = React.createRef();
         _this.popperRef = React.createRef();
         _this.arrowRef = React.createRef();
-        /* eslint-enable react/sort-comp */
         /**
          * Yes our "Stateless" popover still has state. This is private state that
          * customers shouldn't have to manage themselves, such as positioning and
@@ -131,6 +131,7 @@ var PopoverInner = /** @class */ (function (_super) {
             }
             catch (err) {
                 if (__DEV__) {
+                    // eslint-disable-next-line no-console -- debug logging
                     console.error(err);
                 }
             }
@@ -151,13 +152,11 @@ var PopoverInner = /** @class */ (function (_super) {
             !this.state.autoFocusAfterPositioning &&
             this.popperRef.current !== null &&
             this.popperRef.current.getBoundingClientRect().top > 0) {
-            // eslint-disable-next-line react/no-did-update-set-state -- conditional setState
             this.setState({ autoFocusAfterPositioning: true });
         }
         // Update placement in state if a new placement value is received from props,
         // since the initial placement from props was only used for state initialization.
         if (prevProps.placement !== this.props.placement) {
-            // eslint-disable-next-line react/no-did-update-set-state -- conditional setState
             this.setState({ placement: (_a = this.props.placement) !== null && _a !== void 0 ? _a : PLACEMENT.auto });
         }
         if (__DEV__) {
@@ -326,7 +325,7 @@ var PopoverInner = /** @class */ (function (_super) {
         }
         return (
         // @ts-ignore
-        _jsx("span", __assign({}, anchorProps, { children: anchor }), "popover-anchor"));
+        _jsx(Box, __assign({ "$as": "span" }, anchorProps, { children: anchor }), "popover-anchor"));
     };
     PopoverInner.prototype.renderPopover = function (renderedContent) {
         var _this = this;

package/esm/baseui/popover/stateful-container.js

@@ -117,7 +117,7 @@ var StatefulContainer = /** @class */ (function (_super) {
     };
     StatefulContainer.prototype.render = function () {
         var _this = this;
-        var _a = this.props, accessibilityType = _a.accessibilityType, autoFocus = _a.autoFocus, animateOutTime = _a.animateOutTime, dismissOnClickOutside = _a.dismissOnClickOutside, dismissOnEsc = _a.dismissOnEsc, focusLock = _a.focusLock, ignoreBoundary = _a.ignoreBoundary, mountNode = _a.mountNode, onBlur = _a.onBlur, onClick = _a.onClick, onFocus = _a.onFocus, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, onMouseEnterDelay = _a.onMouseEnterDelay, onMouseLeaveDelay = _a.onMouseLeaveDelay, overrides = _a.overrides, placement = _a.placement, popperOptions = _a.popperOptions, renderAll = _a.renderAll, returnFocus = _a.returnFocus, showArrow = _a.showArrow, triggerType = _a.triggerType, popoverMargin = _a.popoverMargin, focusOptions = _a.focusOptions, repositionOnResize = _a.repositionOnResize, positionFixed = _a.positionFixed;
+        var _a = this.props, accessibilityType = _a.accessibilityType, autoFocus = _a.autoFocus, animateOutTime = _a.animateOutTime, dismissOnClickOutside = _a.dismissOnClickOutside, focusLock = _a.focusLock, ignoreBoundary = _a.ignoreBoundary, mountNode = _a.mountNode, onBlur = _a.onBlur, onClick = _a.onClick, onFocus = _a.onFocus, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, onMouseEnterDelay = _a.onMouseEnterDelay, onMouseLeaveDelay = _a.onMouseLeaveDelay, overrides = _a.overrides, placement = _a.placement, popperOptions = _a.popperOptions, renderAll = _a.renderAll, returnFocus = _a.returnFocus, showArrow = _a.showArrow, triggerType = _a.triggerType, popoverMargin = _a.popoverMargin, focusOptions = _a.focusOptions, repositionOnResize = _a.repositionOnResize, positionFixed = _a.positionFixed;
         var popoverProps = {
             accessibilityType: accessibilityType,
             animateOutTime: animateOutTime,

package/esm/baseui/popover/utils.js

@@ -110,7 +110,5 @@ export var extractContent = function (content) {
     if (Array.isArray(content) && !content.length) {
         return null;
     }
-    else {
-        return typeof content === 'function' ? content() : content;
-    }
+    return typeof content === 'function' ? content() : content;
 };

package/esm/baseui/select/autosize-input.d.ts

@@ -16,7 +16,7 @@ export default class AutosizeInput extends React.Component<AutosizeInputProps &
         inputWidth: number;
     };
     componentDidMount(): void;
-    componentDidUpdate(prevProps: AutosizeInputProps, prevState: AutosizeInputState): void;
+    componentDidUpdate(_prevProps: AutosizeInputProps, _prevState: AutosizeInputState): void;
     componentWillUnmount(): void;
     sizerRef: (el?: HTMLElement | null) => void;
     updateInputWidth(): void;

package/esm/baseui/select/autosize-input.js

@@ -25,7 +25,7 @@ var AutosizeInput = /** @class */ (function (_super) {
         this.mounted = true;
         this.updateInputWidth();
     };
-    AutosizeInput.prototype.componentDidUpdate = function (prevProps, prevState) {
+    AutosizeInput.prototype.componentDidUpdate = function (_prevProps, _prevState) {
         this.updateInputWidth();
     };
     AutosizeInput.prototype.componentWillUnmount = function () {

package/esm/baseui/select/dropdown.js

@@ -30,7 +30,7 @@ var SelectDropdown = /** @class */ (function (_super) {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any -- required any for option type
         _this.getItemLabel = function (option) {
-            var _a = _this.props, getOptionLabel = _a.getOptionLabel, _b = _a.overrides, overrides = _b === void 0 ? {} : _b, value = _a.value, valueKey = _a.valueKey, selectAllChecked = _a.selectAllChecked;
+            var _a = _this.props, getOptionLabel = _a.getOptionLabel, _b = _a.overrides, overrides = _b === void 0 ? {} : _b, value = _a.value, valueKey = _a.valueKey, _selectAllChecked = _a.selectAllChecked;
             var _c = __read(getOverrides(overrides.OptionContent, StyledOptionContent), 2), OptionContent = _c[0], optionContentProps = _c[1];
             var $selected;
             if (Array.isArray(value)) {

package/esm/baseui/select/select-component.d.ts

@@ -1,7 +1,6 @@
-import { Component, ReactNode, FocusEvent } from 'react';
-import type { SelectProps, SelectState, Value, Option, ChangeAction } from './types';
-import type { SyntheticEvent, ChangeEvent } from 'react';
-import { Options } from './types';
+import { Component } from 'react';
+import type { SelectProps, SelectState, Value, Option, ChangeAction, Options } from './types';
+import type { SyntheticEvent, ChangeEvent, ReactNode, FocusEvent } from 'react';
 type GetOptionLabel = NonNullable<SelectProps['getOptionLabel']>;
 export declare function getOptionLabel({ option }: Parameters<GetOptionLabel>[0], { selectLocale, labelKey }: SelectProps): ReactNode;
 type GetValueLabel = NonNullable<SelectProps['getValueLabel']>;

package/esm/baseui/select/select-component.js

@@ -9,6 +9,7 @@ LICENSE file in the root directory of this source tree.
 import { Component, createRef } from 'react';
 import memoizeOne from 'memoize-one';
 import { getOverrides, mergeOverrides } from '../../overrides';
+import { Box } from '../../box';
 import { Popover, PLACEMENT, ACCESSIBILITY_TYPE } from '../popover';
 import AutosizeInput from './autosize-input';
 import { TYPE, STATE_CHANGE_TYPE, SIZE, SELECT_ALL_ID, GROUP_SELECT_ALL_ID } from './constants';
@@ -249,7 +250,7 @@ var Select = /** @class */ (function (_super) {
                         event.preventDefault();
                         _this.closeMenu();
                         if (_this.state.currentValueTagIdx === -1 && _this.state.isFocused) {
-                            _this.setState(function (preState) { return ({
+                            _this.setState(function (_preState) { return ({
                                 currentValueTagIdx: _this.getRenderedTagsCount() - 1,
                             }); });
                         }
@@ -294,7 +295,7 @@ var Select = /** @class */ (function (_super) {
                 case 'Tab': {
                     //9
                     if (_this.state.currentValueTagIdx !== -1) {
-                        _this.setState(function (prevState) { return ({
+                        _this.setState(function (_prevState) { return ({
                             currentValueTagIdx: -1,
                         }); });
                     }
@@ -396,7 +397,9 @@ var Select = /** @class */ (function (_super) {
                     break;
             }
         };
+        // eslint-disable-next-line class-methods-use-this -- delegates to module-level helper
         _this.getOptionLabel = function (optionData, props) { return getOptionLabel(optionData, props); };
+        // eslint-disable-next-line class-methods-use-this -- delegates to module-level helper
         _this.getValueLabel = function (optionData, props) { return getValueLabel(optionData, props); };
         _this.getMemoizedOptionsMap = memoizeOne(function (options, valueKey) {
             var normalizedOptions = _this.getMemoizedNormalizedOptions(options);
@@ -748,7 +751,7 @@ var Select = /** @class */ (function (_super) {
             return undefined;
         var _a = this.props.overrides, overrides = _a === void 0 ? {} : _a;
         var _b = __read(getOverrides(overrides.LoadingIndicator, function () { return null; }), 2), LoadingIndicator = _b[0], loadingIndicatorProps = _b[1];
-        return (_jsx(LoadingIndicator, __assign({ role: "status" }, loadingIndicatorProps, { children: _jsx("span", __assign({ style: {
+        return (_jsx(LoadingIndicator, __assign({ role: "status" }, loadingIndicatorProps, { children: _jsx(Box, __assign({ "$as": "span", style: {
                     position: 'absolute',
                     width: '1px',
                     height: '1px',
@@ -848,7 +851,7 @@ var Select = /** @class */ (function (_super) {
         var label = "".concat(selectedLabel).concat(this.props['aria-label'] || '');
         var ariaDescribedBy = "".concat((_a = this.props['aria-describedby']) !== null && _a !== void 0 ? _a : '', " ").concat(ariaDescribedByIDs !== null && ariaDescribedByIDs !== void 0 ? ariaDescribedByIDs : '');
         if (!this.props.searchable) {
-            return (_jsx(InputContainer, __assign({ onFocus: this.handleInputFocus, tabIndex: this.props.disabled ? null : 0 }, sharedProps, inputContainerProps, { children: _jsx("input", __assign({ "aria-hidden": true, id: this.props.id || undefined, ref: this.handleInputRef, style: {
+            return (_jsx(InputContainer, __assign({ onFocus: this.handleInputFocus, tabIndex: this.props.disabled ? null : 0 }, sharedProps, inputContainerProps, { children: _jsx(Box, __assign({ "$as": "input", "aria-hidden": true, id: this.props.id || undefined, ref: this.handleInputRef, style: {
                         opacity: 0,
                         width: '0px',
                         overflow: 'hidden',
@@ -866,7 +869,7 @@ var Select = /** @class */ (function (_super) {
         if (!this.props.clearable || this.props.disabled || this.props.isLoading || !isValueEntered) {
             return null;
         }
-        var _b = this.getSharedProps(), $size = _b.$size, sharedProps = __rest(_b, ["$size"]);
+        var _b = this.getSharedProps(), _$size = _b.$size, sharedProps = __rest(_b, ["$size"]);
         var _c = this.props.overrides, overrides = _c === void 0 ? {} : _c;
         var _d = __read(getOverrides(overrides.ClearIcon, function () { return null; }), 2), ClearIcon = _d[0], clearIconProps = _d[1];
         var ariaLabel = this.props.multi ? 'Clear all' : 'Clear value';
@@ -883,7 +886,7 @@ var Select = /** @class */ (function (_super) {
         if (this.props.type !== TYPE.select) {
             return null;
         }
-        var _b = this.getSharedProps(), $size = _b.$size, sharedProps = __rest(_b, ["$size"]);
+        var _b = this.getSharedProps(), _$size = _b.$size, sharedProps = __rest(_b, ["$size"]);
         var _c = this.props.overrides, overrides = _c === void 0 ? {} : _c;
         var _d = __read(getOverrides(overrides.SelectArrow, function () { return null; }), 2), SelectArrow = _d[0], selectArrowProps = _d[1];
         var sizes = (_a = {},
@@ -934,11 +937,11 @@ var Select = /** @class */ (function (_super) {
         }
         // can user create a new option + there's no exact match already
         var filterDoesNotMatchOption = this.props.ignoreCase
-            ? // @ts-ignore
-                function (// @ts-ignore
+            ? // @ts-ignore -- option label key is dynamic string index
+                function (// @ts-ignore -- option label key is dynamic string index
                 opt) { return opt[_this.props.labelKey].toLowerCase() !== filterValue.toLowerCase().trim(); }
-            : // @ts-ignore
-                function (// @ts-ignore
+            : // @ts-ignore -- option label key is dynamic string index
+                function (// @ts-ignore -- option label key is dynamic string index
                 opt) { return opt[_this.props.labelKey] !== filterValue.trim(); };
         if (filterValue &&
             this.props.creatable &&
@@ -983,6 +986,7 @@ var Select = /** @class */ (function (_super) {
         if (__DEV__) {
             // value may be nullish, only warn if value is defined
             if (value && !Array.isArray(value)) {
+                // eslint-disable-next-line no-console -- debug logging
                 console.warn('The Select component expects an array as the value prop. For more information, please visit the docs at https://baseweb.design/components/select/');
             }
         }
@@ -1017,6 +1021,7 @@ var Select = /** @class */ (function (_super) {
         sharedProps.$isOpen = isOpen;
         if (__DEV__) {
             if (this.props.error && this.props.positive) {
+                // eslint-disable-next-line no-console -- debug logging
                 console.warn('[Select] `error` and `positive` are both set to `true`. `error` will take precedence but this may not be what you want.');
             }
         }

package/esm/baseui/select/stateful-select-container.js

@@ -19,24 +19,20 @@ var StatefulSelectContainer = /** @class */ (function (_super) {
         _this.internalSetState = function (params) {
             var stateReducer = _this.props.stateReducer;
             var nextState = { value: params.value };
-            _this.setState(stateReducer(params.type, nextState, _this.state));
+            _this.setState(function (prevState) { return stateReducer(params.type, nextState, prevState); });
         };
         return _this;
     }
     StatefulSelectContainer.prototype.render = function () {
-        var _a = this.props, children = _a.children, 
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        initialState = _a.initialState, // eslint-disable-line no-unused-vars
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        stateReducer = _a.stateReducer, // eslint-disable-line no-unused-vars
-        restProps = __rest(_a, ["children", "initialState", "stateReducer"]);
+        var _a = this.props, children = _a.children, _initialState = _a.initialState, _stateReducer = _a.stateReducer, restProps = __rest(_a, ["children", "initialState", "stateReducer"]);
         return children(__assign(__assign(__assign({}, restProps), this.state), { onChange: this.onChange }));
     };
     StatefulSelectContainer.defaultProps = {
         initialState: {
-            // @ts-ignore
+            // @ts-ignore -- empty Value[] is valid uncontrolled initial state
             value: [],
         },
+        // eslint-disable-next-line @typescript-eslint/no-empty-function -- default no-op onChange
         onChange: function () { },
         overrides: {},
         stateReducer: defaultStateReducer,

package/esm/baseui/select/types.d.ts

@@ -1,13 +1,12 @@
 import type * as React from 'react';
-import { Override } from '../../overrides';
+import type { Override } from '../../overrides';
 import type { STATE_CHANGE_TYPE, SIZE, TYPE } from './constants';
 import type { OnItemSelectFn } from '../menu';
 export type ChangeAction = keyof typeof STATE_CHANGE_TYPE;
 export type Size = keyof typeof SIZE;
 export type Type = keyof typeof TYPE;
-import { SelectLocale } from '../../select/locale';
+import type { SelectLocale } from '../../select/locale';
 import type { ActionableTooltipProps, TooltipProps } from '../../tooltip';
-import { ReactElement } from 'react';
 import type { Intent } from '../../types';
 export type Id = string | number;
 export type Option = Readonly<{
@@ -227,7 +226,7 @@ export type SelectProps = {
     /** expand all the extra tags in case of limit tag */
     expandLimitTagsOnFocus?: boolean;
     /** render Footer for dropdown */
-    dropdownFooter?: (props: DropdownFooterProps) => ReactElement;
+    dropdownFooter?: (props: DropdownFooterProps) => React.ReactElement;
     ownerDocument?: Document;
     listboxId?: string;
     menuDescriptionId?: string;
@@ -293,7 +292,7 @@ export type DropdownProps = {
     width: number | undefined | null;
     keyboardControlNode?: React.Ref<HTMLElement>;
     closeMenu: () => void;
-    dropdownFooter?: (props: DropdownFooterProps) => ReactElement;
+    dropdownFooter?: (props: DropdownFooterProps) => React.ReactElement;
     menuDescriptionId?: string;
 };
 export type DropdownFooterProps = Pick<DropdownProps, 'isLoading' | 'width' | 'closeMenu'>;

package/esm/baseui/select/utils/index.js

@@ -4,9 +4,7 @@ function groupedOptionsToArray(groupedOptions) {
         var optgroupOptions = groupedOptions[optgroup];
         return arr.concat(
         // @ts-ignore
-        optgroupOptions.map(function (option) {
-            return __assign(__assign({}, option), { __optgroup: optgroup });
-        }));
+        optgroupOptions.map(function (option) { return (__assign(__assign({}, option), { __optgroup: optgroup })); }));
     }, []);
 }
 export function normalizeOptions(options) {
@@ -14,9 +12,7 @@ export function normalizeOptions(options) {
         if (Array.isArray(options)) {
             return options;
         }
-        else {
-            return groupedOptionsToArray(options);
-        }
+        return groupedOptionsToArray(options);
     }
     return [];
 }