@sprinklrjs/spaceweb 10.1.0 → 11.0.0

package/select/types.d.ts

@@ -1,17 +1,23 @@
 import * as React from 'react';
-import { DropdownOverrides as BaseuiDropdownOverrides, DropdownProps as BaseDropdownProps, OnChangeParams as BaseOnChangeParams, Option, OptionsT, SelectOverrides as BaseuiSelectOverrides, SelectProps as BaseuiSelectProps, State, StateReducer } from 'baseui/select';
+import { OverridesDropdown as BaseuiDropdownOverrides, DropdownProps as BaseDropdownProps, Option, Options, SelectOverrides as BaseuiSelectOverrides, SelectProps as BaseuiSelectProps, State, StateReducer } from 'baseui/select';
 import { STATE_CHANGE_TYPE } from './constants';
 import { Override } from '../overrides';
 import { TagProps } from '../tag';
 import { Intent, SpacewebComponentProps } from '../types';
 import { PopoverProps } from '../popover/types';
 import { ValueOf } from '../utility-types';
+import { Value } from 'baseui/select/types';
 export declare type Size = 'sm' | 'md' | 'lg';
 export declare type Type = 'select' | 'search';
 declare type OverridableComponent = keyof Omit<BaseuiSelectOverrides, 'Dropdown' | 'DropdownListItem' | 'DropdownOption'> | 'Menu' | 'MenuItem' | 'NoResults' | 'Divider' | 'ListItemText' | 'OverlayContentContainer';
 export declare type SelectActions = {
     setDropdownOpen?: (shouldOpen: boolean) => void;
 };
+export declare type OnChangeParams = {
+    value: Value;
+    option?: Option;
+    type?: ValueOf<typeof STATE_CHANGE_TYPE>;
+};
 export declare type BaseSelectProps = SpacewebComponentProps<Omit<BaseuiSelectProps, 'overrides' | 'size' | 'type' | 'onChange' | 'positive' | 'error'>> & {
     onChange?: (params: OnChangeParams) => unknown;
     intent?: Intent;
@@ -24,9 +30,10 @@ export declare type BaseSelectProps = SpacewebComponentProps<Omit<BaseuiSelectPr
     captureScroll?: boolean;
     placement?: PopoverProps['placement'];
     popoverMinWidth?: string;
-    methodsRef?: React.MutableRefObject<SelectActions>;
-    createOption?: (label: string) => OptionsT | Promise<OptionsT>;
-    onPaste?: (event: React.ClipboardEvent) => OptionsT | undefined;
+    createOption?: (label: string) => Options | Promise<Options>;
+    onPaste?: (event: React.ClipboardEvent) => Options | undefined;
+    virtual?: boolean;
+    ignoreBoundary?: boolean;
 };
 declare type Merge<A, B> = Omit<A, keyof B> & B;
 export declare type OverlaySelectProps = Merge<BaseSelectProps, {
@@ -63,6 +70,7 @@ export declare type SharedProps = {
     $selected?: boolean;
     $isEmpty?: boolean;
     $size?: Size;
+    $selectSize?: Size;
 };
 export declare type DropdownProps = Omit<BaseDropdownProps, 'overrides' | 'size' | 'type'> & {
     overrides?: {
@@ -70,9 +78,6 @@ export declare type DropdownProps = Omit<BaseDropdownProps, 'overrides' | 'size'
     };
     type?: Type;
 };
-export declare type OnChangeParams = BaseOnChangeParams & {
-    type?: ValueOf<typeof STATE_CHANGE_TYPE>;
-};
 export declare const SELECT_ALL_ID = "__selectAll";
 declare type RemoveValue = () => void;
 export declare type MultiValueProps = Omit<TagProps, 'overrides'> & SharedProps & {
@@ -88,4 +93,4 @@ export declare type MultiValueProps = Omit<TagProps, 'overrides'> & SharedProps
         } & Record<string, any>>;
     };
 };
-export type { TYPE, Option, Value, OptionsT, OptgroupsT, StateReducer, AutosizeInputProps, StatefulContainerProps, SelectState, AutosizeInputState, State as StatefulContainerState, } from 'baseui/select';
+export type { Option, Value, Options, Optgroups, StateReducer, ControlRef, ImperativeMethods, AutosizeInputProps, StatefulContainerProps, SelectState, AutosizeInputState, State as StatefulContainerState, } from 'baseui/select';

package/slider/mark.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
-declare const Mark: React.ForwardRefExoticComponent<import("baseui/slider").SharedProps & {
+declare const Mark: React.ForwardRefExoticComponent<import("baseui/slider").StyleProps & {
     $intent?: boolean | undefined;
     $step: number;
 } & {
     $markIndex: number;
     overrides?: {
-        MarkLabel?: import("../overrides").Override<import("baseui/slider").SharedProps & {
+        MarkLabel?: import("../overrides").Override<import("baseui/slider").StyleProps & {
             $intent?: boolean | undefined;
             $step: number;
         } & Record<string, any>> | undefined;
     } | undefined;
-    getMarkLabel: (props: import("baseui/slider").SharedProps & {
+    getMarkLabel: (props: import("baseui/slider").StyleProps & {
         $intent?: boolean | undefined;
         $step: number;
     } & {

package/slider/slider.js

@@ -7,10 +7,11 @@ var useConvertOverrides_1 = require("../helpers/baseui/useConvertOverrides");
 var mark_1 = (0, tslib_1.__importDefault)(require("./mark"));
 var styled_components_1 = require("./styled-components");
 var utils_1 = require("../spacewebProvider/utils");
+// @ts-ignore
 slider_1.Slider.displayName = 'BaseSlider';
 var defaultMarkLabel = function (_a) {
     var $markIndex = _a.$markIndex, $min = _a.$min, $step = _a.$step;
-    return "".concat($min + $markIndex * $step);
+    return "".concat(($min || 0) + $markIndex * $step);
 };
 var Slider = function (_a) {
     var overrides = _a.overrides, markLabel = _a.markLabel, _b = _a.intent, intent = _b === void 0 ? 'default' : _b, _c = _a.getMarkLabel, getMarkLabel = _c === void 0 ? defaultMarkLabel : _c, className = _a.className, style = _a.style, restProps = (0, tslib_1.__rest)(_a, ["overrides", "markLabel", "intent", "getMarkLabel", "className", "style"]);

package/slider/stateful-slider.js

@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
 var stateful_slider_container_1 = (0, tslib_1.__importDefault)(require("./stateful-slider-container"));
 var slider_1 = (0, tslib_1.__importDefault)(require("./slider"));
-var StatefulSlider = function (props) { return ((0, jsx_runtime_1.jsx)(stateful_slider_container_1.default, (0, tslib_1.__assign)({}, props, { children: function (sliderProps) { return (0, jsx_runtime_1.jsx)(slider_1.default, (0, tslib_1.__assign)({}, sliderProps), void 0); } }), void 0)); };
+var StatefulSlider = function (props) { return ((0, jsx_runtime_1.jsx)(stateful_slider_container_1.default, (0, tslib_1.__assign)({}, props, { children: function (sliderProps) { return (0, jsx_runtime_1.jsx)(slider_1.default, (0, tslib_1.__assign)({}, sliderProps, { overrides: props.overrides }), void 0); } }), void 0)); };
 StatefulSlider.displayName = 'StatefulSlider';
 exports.default = StatefulSlider;

package/slider/types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { SliderProps as BaseSliderProps, StatefulContainerProps as BaseStatefulContainerProps, StatefulSliderProps as BaseStatefulSliderProps, SharedProps as BaseSharedProps } from 'baseui/slider';
+import { SharedProps as BaseSharedProps, SliderProps as BaseSliderProps, StatefulContainerProps as BaseStatefulContainerProps, StatefulSliderProps as BaseStatefulSliderProps } from 'baseui/slider';
 import { Intent, SpacewebComponentProps } from '../types';
 import { Override } from '../overrides';
 declare type GetMarkLabelFn = (props: SharedProps & {
@@ -26,7 +26,14 @@ export declare type SharedProps = BaseSharedProps & {
     $step: number;
 };
 export declare type SliderProps = SpacewebComponentProps<Omit<BaseSliderProps, 'overrides'>> & CommonSliderProps;
-export declare type StatefulContainerProps = SpacewebComponentProps<Omit<BaseStatefulContainerProps, 'overrides'>> & CommonSliderProps;
+export declare type StatefulContainerProps = SpacewebComponentProps<Omit<BaseStatefulContainerProps, 'overrides' | 'stateReducer' | 'min' | 'max' | 'step' | 'onChange' | 'onFinalChange'>> & CommonSliderProps & {
+    stateReducer?: BaseStatefulContainerProps['stateReducer'];
+    min?: BaseStatefulContainerProps['min'];
+    max?: BaseStatefulContainerProps['max'];
+    step?: BaseStatefulContainerProps['step'];
+    onChange?: BaseStatefulContainerProps['onChange'];
+    onFinalChange?: BaseStatefulContainerProps['onFinalChange'];
+};
 export declare type StatefulSliderProps = SpacewebComponentProps<Omit<BaseStatefulSliderProps, 'overrides'>> & CommonSliderProps;
 export declare type MarkProps = SharedProps & {
     $markIndex: number;

package/spacewebProvider/CustomBaseProvider.js

@@ -5,6 +5,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var useConvertOverrides_1 = require("../helpers/baseui/useConvertOverrides");
 var React = (0, tslib_1.__importStar)(require("react"));
 var baseui_1 = require("baseui");
+// @ts-ignore
 baseui_1.BaseProvider.displayName = 'BaseUIProvider';
 // NOTE: Reason https://baseweb.design/components/layer/#layersmanager
 var BaseProviderOverrides = {

package/spacewebProvider/SpacewebProvider.d.ts

@@ -1,6 +1,6 @@
 import { ReactElement, ReactNode } from 'react';
 import * as React from 'react';
-import { StandardEngine } from 'styletron-react';
+import { StandardEngine } from 'styletron-standard';
 import { Direction, ThemeModule } from '@sprinklrjs/spaceweb-themes/types';
 import { Override } from '../overrides';
 import { LocaleProvider } from '../locale';

package/style/_parseStyle.js

@@ -8,7 +8,6 @@ var tslib_1 = require("tslib");
 /* eslint @typescript-eslint/no-use-before-define: 0, @typescript-eslint/no-explicit-any: 0 */
 var flattenDeep_1 = (0, tslib_1.__importDefault)(require("lodash/flattenDeep"));
 var merge_1 = (0, tslib_1.__importDefault)(require("lodash/merge"));
-var _escapeClassName_1 = (0, tslib_1.__importDefault)(require("./_escapeClassName"));
 exports.PSEUDO_SELECTORS = {
     hover: ':hover',
     focus: ':focus',
@@ -42,18 +41,19 @@ var _parseStyle = function (utils, props) {
                     var _a = (0, tslib_1.__read)(className.split(':'), 2), prefix = _a[0], prefixedClassName = _a[1];
                     if (utils.theme.screens[prefix]) {
                         var mediaQuery = "@media screen and (min-width: ".concat(utils.theme.screens[prefix], ")");
-                        mergedStyleObject[mediaQuery] = Object.assign(mergedStyleObject[mediaQuery] || {}, utils.classes[(0, _escapeClassName_1.default)(prefixedClassName)]);
+                        mergedStyleObject[mediaQuery] = Object.assign(mergedStyleObject[mediaQuery] || {}, utils.classes[prefixedClassName]);
                         isInvalidClassName = false;
                     }
                     if (exports.PSEUDO_SELECTORS[prefix]) {
                         var prefixKey = exports.PSEUDO_SELECTORS[prefix];
-                        mergedStyleObject[prefixKey] = Object.assign(mergedStyleObject[prefixKey] || {}, utils.classes[(0, _escapeClassName_1.default)(prefixedClassName)]);
+                        mergedStyleObject[prefixKey] = Object.assign(mergedStyleObject[prefixKey] || {}, utils.classes[prefixedClassName]);
                         isInvalidClassName = false;
                     }
                 }
-                var utilityStyle = utils.classes[(0, _escapeClassName_1.default)(className)];
-                if (utilityStyle)
+                var utilityStyle = utils.classes[className];
+                if (utilityStyle) {
                     Object.assign(mergedStyleObject, utilityStyle);
+                }
                 else if (isInvalidClassName)
                     invalidArgs.push(className);
             });

package/style/useMemoizedStyletron.d.ts

@@ -1,5 +1,5 @@
 /**
  * styletron returns new `styletronCSS` function each time the hook is called. This hook memorizes the css function and returns same reference every time.
  */
-declare const useMemoizedStyletron: () => [(arg: import("styletron-standard").StyleObject) => string, import("baseui").Theme];
+declare const useMemoizedStyletron: () => [(a: import("styletron-standard").StyleObject) => string, import("baseui").Theme];
 export default useMemoizedStyletron;

package/styleEngine/styleEngine.d.ts

@@ -1,6 +1,5 @@
 import { PropsWithChildren, ReactElement } from 'react';
-import { Sheet } from 'styletron-engine-atomic';
-import { StandardEngine } from '../types';
+import { StandardEngine, Sheet } from '../types';
 export declare type ProviderProps = {
     styleEngine?: StandardEngine;
     debug?: boolean;

package/switch/__test__/switch.spec.js

@@ -7,6 +7,7 @@ require("@testing-library/jest-dom/extend-expect");
 var index_1 = require("../index");
 var test_provider_1 = require("../../test-utils/test-provider");
 var enzyme_1 = require("enzyme");
+var React = (0, tslib_1.__importStar)(require("react"));
 var renderSwitch = function (_a) {
     var _b = _a.size, size = _b === void 0 ? 'md' : _b, _c = _a.intent, intent = _c === void 0 ? 'default' : _c, rest = (0, tslib_1.__rest)(_a, ["size", "intent"]);
     return (0, react_1.render)((0, jsx_runtime_1.jsx)(test_provider_1.TestProvider, { children: (0, jsx_runtime_1.jsx)(index_1.Switch, (0, tslib_1.__assign)({ size: size, intent: intent }, rest, { children: "Switch Label" }), void 0) }, void 0));
@@ -93,4 +94,16 @@ describe('Switch', function () {
             });
         });
     });
+    describe('inputRef', function () {
+        test('refObject should have the reference of input.', function () {
+            var inputRef = React.createRef();
+            var container = renderSwitch({ inputRef: inputRef }).container;
+            expect(inputRef.current).toBe(container.querySelector('input'));
+        });
+        test('refCallback should be called with input ref.', function () {
+            var inputRefCallback = jest.fn();
+            var container = renderSwitch({ inputRef: inputRefCallback }).container;
+            expect(inputRefCallback).toHaveBeenCalledWith(container.querySelector('input'));
+        });
+    });
 });

package/switch/styled-components.js

@@ -5,10 +5,9 @@ var tslib_1 = require("tslib");
 var helpers_1 = require("../helpers");
 var longHandHelpers_1 = require("../helpers/longHandHelpers");
 var intentHelper_1 = require("../helpers/intentHelper");
-var commonStyles_1 = require("../helpers/commonStyles");
 var getTrackBackgroundColor = function (utils, props) {
     var theme = utils.theme;
-    var $disabled = props.$disabled, $checked = props.$checked, $isFocusVisible = props.$isFocusVisible, $isHovered = props.$isHovered;
+    var $disabled = props.$disabled, $checked = props.$checked;
     if ($disabled) {
         if ($checked) {
             return (0, helpers_1.hex2rgb)((0, intentHelper_1.intentColor)(utils, props), '0.5');
@@ -18,19 +17,12 @@ var getTrackBackgroundColor = function (utils, props) {
     if ($checked) {
         return (0, intentHelper_1.intentColor)(utils, props);
     }
-    if ($isHovered || $isFocusVisible) {
-        return (0, helpers_1.hex2rgb)(theme.spr.interactive01, '0.2');
-    }
-    return theme.spr.ui03;
+    return theme.spr.icon03;
 };
 var getToggleTrackOverrides = function (utils, props) {
-    var px2rem = utils.px2rem;
-    var $size = props.$size, $isFocusVisible = props.$isFocusVisible;
-    var styles = (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ boxSizing: 'border-box', height: px2rem(16), width: px2rem(28), backgroundColor: getTrackBackgroundColor(utils, props) }, (0, longHandHelpers_1.borderRadius)(px2rem(27))), (0, longHandHelpers_1.margin)(0)), ($isFocusVisible
-        ? (0, tslib_1.__assign)({}, (0, commonStyles_1.getOutlineStyles)(utils, {
-            $outlineOffset: '2px',
-            $outlineWidth: '2px',
-        })) : {}));
+    var px2rem = utils.px2rem, getStyle = utils.getStyle;
+    var $size = props.$size, $isFocusVisible = props.$isFocusVisible, $isHovered = props.$isHovered, $checked = props.$checked, $disabled = props.$disabled;
+    var styles = (0, tslib_1.__assign)((0, tslib_1.__assign)({ height: px2rem(16), width: px2rem(28), backgroundColor: getTrackBackgroundColor(utils, props) }, (0, longHandHelpers_1.borderRadius)(px2rem(27))), { boxShadow: 'none' });
     switch ($size) {
         case 'lg':
             styles.height = px2rem(20);
@@ -43,17 +35,18 @@ var getToggleTrackOverrides = function (utils, props) {
         default:
             break;
     }
-    return styles;
+    return getStyle([
+        'box-border border-1 m-0 border-transparent border-solid',
+        ($isHovered || $isFocusVisible) && !$checked && !$disabled ? 'spr-border-06' : '',
+        $isFocusVisible ? 'outline-01' : '',
+        styles,
+    ]);
 };
 exports.getToggleTrackOverrides = getToggleTrackOverrides;
 var getToggleOverrides = function (utils, props) {
-    var px2rem = utils.px2rem, direction = utils.direction, theme = utils.theme;
+    var px2rem = utils.px2rem, direction = utils.direction, theme = utils.theme, getStyle = utils.getStyle;
     var $size = props.$size, $checked = props.$checked, $disabled = props.$disabled, $isFocusVisible = props.$isFocusVisible;
-    var styles = (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ boxSizing: 'border-box', backgroundColor: $disabled ? theme.spr.ui03 : theme.spr.ui01, alignItems: 'center', display: 'flex', height: px2rem(12), width: px2rem(12) }, (0, longHandHelpers_1.margin)(px2rem(2))), (0, longHandHelpers_1.borderRadius)('50%')), { transform: $checked ? "translateX(".concat(direction === 'rtl' ? '-100%' : '100%', ")") : '', transition: 'transform 200ms' }), ($isFocusVisible
-        ? {
-            boxShadow: 'none',
-        }
-        : {}));
+    var styles = (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ backgroundColor: $disabled ? theme.spr.ui03 : theme.spr.ui01, height: px2rem(12), width: px2rem(12) }, (0, longHandHelpers_1.margin)(px2rem(1))), (0, longHandHelpers_1.borderRadius)('50%')), { transform: $checked ? "translateX(".concat(direction === 'rtl' ? '-100%' : '100%', ")") : '', transition: 'transform 200ms', boxShadow: 'none' });
     switch ($size) {
         case 'lg':
             styles.height = styles.width = px2rem(16);
@@ -64,7 +57,7 @@ var getToggleOverrides = function (utils, props) {
         default:
             break;
     }
-    return styles;
+    return getStyle(['flex items-center box-border', styles]);
 };
 exports.getToggleOverrides = getToggleOverrides;
 var getLabelOverrides = function (_a, _b) {

package/switch/switch.js

@@ -6,15 +6,18 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var checkbox_1 = require("../checkbox");
 var checkbox_2 = require("baseui/checkbox");
 var basewebAdapter_1 = require("./basewebAdapter");
+var useCombinedRef_1 = require("../hooks/useCombinedRef");
 var Switch = function (props) {
     var _a = (0, basewebAdapter_1.useSwitchAdapter)(props), overrides = _a.overrides, restProps = (0, tslib_1.__rest)(_a, ["overrides"]);
-    return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, (0, tslib_1.__assign)({ overrides: overrides, "data-spaceweb": "Switch", checkmarkType: checkbox_2.STYLE_TYPE.toggle_round, labelPlacement: "right" }, restProps), void 0));
+    var inputRefObj = (0, useCombinedRef_1.useCombineRefObjects)(props.inputRef);
+    return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, (0, tslib_1.__assign)({ overrides: overrides, "data-spaceweb": "Switch", checkmarkType: checkbox_2.STYLE_TYPE.toggle_round, labelPlacement: "right" }, restProps, { inputRef: inputRefObj }), void 0));
 };
 exports.Switch = Switch;
 exports.Switch.displayName = 'Switch';
 var StatefulSwitch = function (props) {
     var _a = (0, basewebAdapter_1.useSwitchAdapter)(props), overrides = _a.overrides, restProps = (0, tslib_1.__rest)(_a, ["overrides"]);
-    return ((0, jsx_runtime_1.jsx)(checkbox_1.StatefulCheckbox, (0, tslib_1.__assign)({ overrides: overrides, "data-spaceweb": "StatefulSwitch", checkmarkType: checkbox_2.STYLE_TYPE.toggle_round, labelPlacement: "right" }, restProps), void 0));
+    var inputRefObj = (0, useCombinedRef_1.useCombineRefObjects)(props.inputRef);
+    return ((0, jsx_runtime_1.jsx)(checkbox_1.StatefulCheckbox, (0, tslib_1.__assign)({ overrides: overrides, "data-spaceweb": "StatefulSwitch", checkmarkType: checkbox_2.STYLE_TYPE.toggle_round, labelPlacement: "right" }, restProps, { inputRef: inputRefObj }), void 0));
 };
 exports.StatefulSwitch = StatefulSwitch;
 exports.StatefulSwitch.displayName = 'StatefulSwitch';

package/switch/types.d.ts

@@ -1,8 +1,7 @@
-import { CheckboxProps as BaseSwitchProps, StatefulCheckboxProps as BaseStatefulSwitchProps } from 'baseui/checkbox';
+import { CheckboxProps as BaseSwitchProps, StatefulCheckboxProps as BaseStatefulSwitchProps } from '../checkbox';
 import { SharedProps as BaseSharedProps } from 'baseui/input';
-import { OutlineProps } from '../helpers/commonStyles';
 import { Override } from '../overrides';
-import { Intent, SpacewebComponentProps } from '../types';
+import { Intent } from '../types';
 export declare type SwitchSize = 'sm' | 'md' | 'lg';
 export declare type LabelPlacement = 'left' | 'right' | 'top' | 'bottom';
 export declare type SharedProps = BaseSharedProps & {
@@ -12,17 +11,15 @@ export declare type SharedProps = BaseSharedProps & {
     $isHovered: boolean;
     $size: SwitchSize;
 };
-export declare type SwitchProps = SpacewebComponentProps<Omit<BaseSwitchProps, 'overrides' | 'size' | 'intent'>> & {
+export declare type SwitchProps = Omit<BaseSwitchProps, 'overrides' | 'size'> & {
     size?: SwitchSize;
-    intent?: Intent;
     overrides?: {
-        [key in keyof BaseSwitchProps['overrides']]?: Override<SharedProps>;
+        [key in keyof Required<BaseSwitchProps>['overrides']]?: Override<SharedProps>;
     };
-} & OutlineProps;
-export declare type StatefulSwitchProps = SpacewebComponentProps<Omit<BaseStatefulSwitchProps, 'overrides' | 'size' | 'intent'>> & {
+};
+export declare type StatefulSwitchProps = Omit<BaseStatefulSwitchProps, 'overrides' | 'size'> & {
     size?: SwitchSize;
-    intent?: Intent;
     overrides?: {
-        [key in keyof BaseStatefulSwitchProps['overrides']]?: Override<SharedProps>;
+        [key in keyof Required<BaseStatefulSwitchProps>['overrides']]?: Override<SharedProps>;
     };
-} & OutlineProps;
+};

package/textarea/basewebAdapters.js

@@ -25,10 +25,10 @@ function useTextareaAdapter(props) {
         },
         Input: {
             style: styled_components_1.getTextareaInputStyles,
-            props: (0, tslib_1.__assign)({ onChange: handleChange, $autoSize: autoSize }, sharedProps),
+            props: (0, tslib_1.__assign)({ $autoSize: autoSize }, sharedProps),
         },
     }, restProps.overrides);
     var rows = autoSize && !restProps.rows ? 1 : restProps.rows;
-    return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, restProps), { overrides: overrides, rows: rows });
+    return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, restProps), { overrides: overrides, rows: rows, onChange: handleChange });
 }
 exports.default = useTextareaAdapter;

package/textarea/styled-components.d.ts

@@ -1,4 +1,4 @@
-export declare const getTextareaInputStyles: (import("..").StyleFn<import("../input").SharedProps> | (({}: {}, { $autoSize }: {
+export declare const getTextareaInputStyles: (import("..").StyleFn<Partial<Pick<import("../input").SharedProps, "$disabled" | "$size" | "$variant">>> | (({}: {}, { $autoSize }: {
     $autoSize: any;
 }) => "overflow-hidden" | "resize") | (({ theme }: {
     theme: any;

package/textarea/textarea.js

@@ -9,6 +9,7 @@ var useAutoFocus_1 = (0, tslib_1.__importDefault)(require("../hooks/useAutoFocus
 var useAutoSizeTextarea_1 = (0, tslib_1.__importDefault)(require("./useAutoSizeTextarea"));
 // @ts-ignore
 textarea_1.Textarea.displayName = 'BaseUITextarea';
+// @ts-ignore
 textarea_1.StatefulTextarea.displayName = 'BaseUIStatefulTextarea';
 var Textarea = function (props) {
     var autoFocus = props.autoFocus, restProps = (0, tslib_1.__rest)(props, ["autoFocus"]);
@@ -26,13 +27,8 @@ exports.Textarea.displayName = 'Textarea';
 var StatefulTextarea = function (props) {
     var autoFocus = props.autoFocus, restProps = (0, tslib_1.__rest)(props, ["autoFocus"]);
     var autoFocusRef = (0, useAutoFocus_1.default)({ autoFocus: autoFocus, inputRef: restProps.inputRef });
-    var inputRef = (0, useAutoSizeTextarea_1.default)({
-        value: restProps.value,
-        autoSize: restProps.autoSize,
-        inputRef: autoFocusRef,
-    });
     var adaptedProps = (0, basewebAdapters_1.default)(restProps);
-    return (0, jsx_runtime_1.jsx)(textarea_1.StatefulTextarea, (0, tslib_1.__assign)({}, adaptedProps, { inputRef: inputRef }), void 0);
+    return (0, jsx_runtime_1.jsx)(textarea_1.StatefulTextarea, (0, tslib_1.__assign)({}, adaptedProps, { inputRef: autoFocusRef }), void 0);
 };
 exports.StatefulTextarea = StatefulTextarea;
 exports.StatefulTextarea.displayName = 'StatefulTextarea';

package/textarea/types.d.ts

@@ -1,8 +1,9 @@
+import { Ref } from 'react';
 import { TextareaProps as BaseTextareaProps, StatefulTextareaProps as BaseStatefulTextareaProps } from 'baseui/textarea';
 import { InputSize, InputVariant, FocusPosition } from '../input';
 import { Intent, SpacewebComponentProps } from '../types';
 import { Override } from '../overrides';
-export declare type TextareaProps = SpacewebComponentProps<Omit<BaseTextareaProps, 'size' | 'overrides' | 'autoFocus'>> & {
+export declare type TextareaProps = SpacewebComponentProps<Omit<BaseTextareaProps, 'size' | 'overrides' | 'autoFocus' | 'inputRef'>> & {
     size?: InputSize;
     variant?: InputVariant;
     overrides?: {
@@ -13,8 +14,9 @@ export declare type TextareaProps = SpacewebComponentProps<Omit<BaseTextareaProp
     debounceInterval?: number;
     autoFocus?: FocusPosition;
     autoSize?: boolean;
+    inputRef?: Ref<HTMLTextAreaElement>;
 };
-export declare type StatefulTextareaProps = SpacewebComponentProps<Omit<BaseStatefulTextareaProps, 'size' | 'overrides' | 'autoFocus'>> & {
+export declare type StatefulTextareaProps = SpacewebComponentProps<Omit<BaseStatefulTextareaProps, 'size' | 'overrides' | 'autoFocus' | 'inputRef'>> & {
     size?: InputSize;
     variant?: InputVariant;
     overrides?: {
@@ -23,5 +25,5 @@ export declare type StatefulTextareaProps = SpacewebComponentProps<Omit<BaseStat
     debouncedOnChange?: BaseStatefulTextareaProps['onChange'];
     debounceInterval?: number;
     autoFocus?: FocusPosition;
-    autoSize?: boolean;
+    inputRef?: Ref<HTMLTextAreaElement>;
 };

package/themes/index.js

@@ -18,6 +18,6 @@ var SPACEWEB_THEME_VS_BASEUI_THEME = {
 };
 exports.default = SPACEWEB_THEME_VS_BASEUI_THEME;
 function createTheme(theme, overrides) {
-    return (0, merge_1.default)(theme, overrides);
+    return (0, merge_1.default)({}, theme, overrides);
 }
 exports.createTheme = createTheme;

package/themes/responsive-theme.d.ts

@@ -7,7 +7,7 @@ declare const responsiveTheme: {
         medium: number;
         large: number;
     };
-    mediaQuery: Record<"medium" | "large" | "small", string>;
+    mediaQuery: Record<"large" | "medium" | "small", string>;
 };
 export declare const withResponsiveTheme: <T extends object>(theme: T) => T & {
     breakpoints: {
@@ -15,6 +15,6 @@ export declare const withResponsiveTheme: <T extends object>(theme: T) => T & {
         medium: number;
         large: number;
     };
-    mediaQuery: Record<"medium" | "large" | "small", string>;
+    mediaQuery: Record<"large" | "medium" | "small", string>;
 };
 export {};

package/time-picker/TimePicker.d.ts

@@ -1,8 +1,3 @@
 import { ReactElement } from 'react';
 import { TimePickerProps } from './types';
-export declare const TimePicker: {
-    (props: TimePickerProps): ReactElement;
-    defaultProps: {
-        size: "md";
-    };
-};
+export declare const TimePicker: (props: TimePickerProps) => ReactElement;

package/time-picker/TimePicker.js

@@ -8,7 +8,7 @@ var select_1 = require("../select");
 var context_1 = require("../form-control/context");
 var useConvertOverrides_1 = require("../helpers/baseui/useConvertOverrides");
 var useTimePickerBasewebAdapter = function (props) {
-    var _a = (0, context_1.useContextualFormProps)(props), size = _a.size, className = _a.className, style = _a.style, intent = _a.intent, overrides = _a.overrides, clearable = _a.clearable, restProps = (0, tslib_1.__rest)(_a, ["size", "className", "style", "intent", "overrides", "clearable"]);
+    var _a = (0, context_1.useContextualFormProps)(props), _b = _a.size, size = _b === void 0 ? 'md' : _b, className = _a.className, style = _a.style, intent = _a.intent, overrides = _a.overrides, clearable = _a.clearable, restProps = (0, tslib_1.__rest)(_a, ["size", "className", "style", "intent", "overrides", "clearable"]);
     var convertedOverrides = (0, useConvertOverrides_1.useConvertOverrides)({
         Select: {
             component: select_1.Select,
@@ -27,6 +27,3 @@ var TimePicker = function (props) {
     return (0, jsx_runtime_1.jsx)(timepicker_1.TimePicker, (0, tslib_1.__assign)({}, adaptedProps), void 0);
 };
 exports.TimePicker = TimePicker;
-exports.TimePicker.defaultProps = {
-    size: 'md',
-};

package/time-picker/types.d.ts

@@ -2,10 +2,12 @@ import { Intent, Styles } from '../types';
 import { Override } from '../overrides/types';
 import { SharedProps, Size } from '../select/types';
 import { TimePickerProps as BaseTimePickerProps, TimePickerOverrides as BaseTimePickerOverrides } from 'baseui/timepicker';
+import { DateIOAdapter } from 'baseui/datepicker/utils/types';
 export declare type TimePickerOverrides = {
     [key in keyof BaseTimePickerOverrides]?: Override<SharedProps>;
 };
-export declare type TimePickerProps = Omit<BaseTimePickerProps, 'error' | 'positive' | 'overrides' | 'size' | 'nullable'> & {
+export declare type TimePickerProps = Omit<BaseTimePickerProps, 'error' | 'positive' | 'overrides' | 'size' | 'nullable' | 'adapter'> & {
+    adapter?: DateIOAdapter<Date>;
     intent?: Intent;
     className?: Styles;
     style?: Styles;

package/time-range-picker/RangeSelector.js

@@ -9,9 +9,10 @@ var Calendar_1 = (0, tslib_1.__importDefault)(require("../date-picker/Calendar")
 var overrides_1 = require("../overrides");
 var utils_1 = require("./utils");
 var RangeSelector = function (_a) {
-    var _b;
+    var _b, _c;
     var timeRange = _a.timeRange, preset = _a.preset, onChange = _a.onChange, formatString = _a.formatString, props = (0, tslib_1.__rest)(_a, ["timeRange", "preset", "onChange", "formatString"]);
-    var _c = (0, tslib_1.__read)((0, overrides_1.useOverrides)((_b = props.overrides) === null || _b === void 0 ? void 0 : _b.TimeRangeList, TimeRangeList_1.default), 2), TimeRangeList = _c[0], timeRangeListProps = _c[1];
+    var _d = (0, tslib_1.__read)((0, overrides_1.useOverrides)((_b = props.overrides) === null || _b === void 0 ? void 0 : _b.TimeRangeList, TimeRangeList_1.default), 2), TimeRangeList = _d[0], timeRangeListProps = _d[1];
+    var _e = (0, tslib_1.__read)((0, overrides_1.useOverrides)((_c = props.overrides) === null || _c === void 0 ? void 0 : _c.Calendar, Calendar_1.default), 2), Calendar = _e[0], calendarProps = _e[1];
     var height = (0, utils_1.getHeight)({
         monthsShown: props.monthsShown,
         timeSelect: props.timeSelect,
@@ -19,9 +20,9 @@ var RangeSelector = function (_a) {
     return ((0, jsx_runtime_1.jsxs)(box_1.Box, (0, tslib_1.__assign)({ className: [
             'flex border-t-1 border-b-1 border-r-0 border-l-0 border-solid spr-border-01',
             { height: "".concat(height, "px") },
-        ] }, { children: [props.timeRangePresets.length !== 1 ? ((0, jsx_runtime_1.jsx)(TimeRangeList, (0, tslib_1.__assign)({ onChange: onChange, timeRange: timeRange, preset: preset, timeRangePresets: props.timeRangePresets }, timeRangeListProps), void 0)) : null, (0, jsx_runtime_1.jsx)(box_1.Box, (0, tslib_1.__assign)({ className: "overflow-y-auto" }, { children: (0, jsx_runtime_1.jsx)(Calendar_1.default, { timeSelectEnd: props.timeSelect, timeSelectStart: props.timeSelect, value: timeRange, onChange: onChange, peekNextMonth: props.peekNextMonth, excludeDates: props.excludeDates, filterDate: props.filterDate, minDate: props.minDate, maxDate: props.maxDate, range: true, monthsShown: props.monthsShown, locale: props.locale, formatString: formatString, 
+        ] }, { children: [props.timeRangePresets.length !== 1 ? ((0, jsx_runtime_1.jsx)(TimeRangeList, (0, tslib_1.__assign)({ onChange: onChange, timeRange: timeRange, preset: preset, timeRangePresets: props.timeRangePresets }, timeRangeListProps), void 0)) : null, (0, jsx_runtime_1.jsx)(box_1.Box, (0, tslib_1.__assign)({ className: "overflow-y-auto" }, { children: (0, jsx_runtime_1.jsx)(Calendar, (0, tslib_1.__assign)({ timeSelectEnd: props.timeSelect, timeSelectStart: props.timeSelect, value: timeRange, onChange: onChange, peekNextMonth: props.peekNextMonth, excludeDates: props.excludeDates, filterDate: props.filterDate, minDate: props.minDate, maxDate: props.maxDate, range: true, monthsShown: props.monthsShown, locale: props.locale, formatString: formatString, 
                     // @ts-ignore
-                    overrides: props.overrides, fixedHeight: props.fixedHeight }, void 0) }), void 0)] }), void 0));
+                    overrides: props.overrides, fixedHeight: props.fixedHeight }, calendarProps), void 0) }), void 0)] }), void 0));
 };
 RangeSelector.displayName = 'RangeSelector';
 exports.default = (0, react_1.memo)(RangeSelector);