@sprinklrjs/spaceweb 11.0.0 → 12.33.2-rc.1

package/textarea/textarea.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.StatefulTextarea = exports.Textarea = void 0;
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
-var textarea_1 = require("baseui/textarea");
+var textarea_1 = require("../baseui/textarea");
 var basewebAdapters_1 = (0, tslib_1.__importDefault)(require("./basewebAdapters"));
 var useAutoFocus_1 = (0, tslib_1.__importDefault)(require("../hooks/useAutoFocus"));
 var useAutoSizeTextarea_1 = (0, tslib_1.__importDefault)(require("./useAutoSizeTextarea"));
@@ -20,7 +20,7 @@ var Textarea = function (props) {
         inputRef: autoFocusRef,
     });
     var adaptedProps = (0, basewebAdapters_1.default)(restProps);
-    return (0, jsx_runtime_1.jsx)(textarea_1.Textarea, (0, tslib_1.__assign)({}, adaptedProps, { inputRef: inputRef }), void 0);
+    return ((0, jsx_runtime_1.jsx)(textarea_1.Textarea, (0, tslib_1.__assign)({}, adaptedProps, { overrides: adaptedProps.overrides, inputRef: inputRef }), void 0));
 };
 exports.Textarea = Textarea;
 exports.Textarea.displayName = 'Textarea';
@@ -28,7 +28,7 @@ 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 adaptedProps = (0, basewebAdapters_1.default)(restProps);
-    return (0, jsx_runtime_1.jsx)(textarea_1.StatefulTextarea, (0, tslib_1.__assign)({}, adaptedProps, { inputRef: autoFocusRef }), void 0);
+    return ((0, jsx_runtime_1.jsx)(textarea_1.StatefulTextarea, (0, tslib_1.__assign)({}, adaptedProps, { overrides: adaptedProps.overrides, inputRef: autoFocusRef }), void 0));
 };
 exports.StatefulTextarea = StatefulTextarea;
 exports.StatefulTextarea.displayName = 'StatefulTextarea';

package/textarea/types.d.ts

@@ -1,5 +1,5 @@
 import { Ref } from 'react';
-import { TextareaProps as BaseTextareaProps, StatefulTextareaProps as BaseStatefulTextareaProps } from 'baseui/textarea';
+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';
@@ -7,7 +7,7 @@ export declare type TextareaProps = SpacewebComponentProps<Omit<BaseTextareaProp
     size?: InputSize;
     variant?: InputVariant;
     overrides?: {
-        [key in keyof BaseTextareaProps['overrides']]?: Override<any>;
+        [key in keyof Required<BaseTextareaProps>['overrides']]?: Override<any>;
     };
     intent?: Intent;
     debouncedOnChange?: BaseTextareaProps['onChange'];
@@ -20,7 +20,7 @@ export declare type StatefulTextareaProps = SpacewebComponentProps<Omit<BaseStat
     size?: InputSize;
     variant?: InputVariant;
     overrides?: {
-        [key in keyof BaseStatefulTextareaProps['overrides']]?: Override<any>;
+        [key in keyof Required<BaseStatefulTextareaProps>['overrides']]?: Override<any>;
     };
     debouncedOnChange?: BaseStatefulTextareaProps['onChange'];
     debounceInterval?: number;

package/theme/Provider.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren, ReactElement } from 'react';
+import { ThemeProviderT } from './types';
+import type { Density } from '@sprinklrjs/spaceweb-themes/types';
+declare type Props = PropsWithChildren<{
+    theme?: ThemeProviderT;
+    containerElement?: HTMLElement | null;
+    density?: Density;
+}>;
+export declare const ThemeProvider: (props: Props) => ReactElement;
+export {};

package/theme/Provider.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeProvider = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var merge_1 = (0, tslib_1.__importDefault)(require("lodash/merge"));
+var usePrevious_1 = (0, tslib_1.__importDefault)(require("../hooks/usePrevious"));
+var useIsomorphicLayoutEffect_1 = require("../hooks/useIsomorphicLayoutEffect");
+var context_1 = require("./context");
+var THEME_NAMES = ['hyperspace-light', 'space-light', 'space-dark', 'hyperspace-dark'];
+var addDensityToTheme = function (theme, density) {
+    var _a;
+    return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme), { theme: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme.theme), { density: density || ((_a = theme.theme) === null || _a === void 0 ? void 0 : _a.density) }) }));
+};
+var ThemeProvider = function (props) {
+    var theme = props.theme, children = props.children, elementToApplyClass = props.containerElement, density = props.density;
+    var outerTheme = (0, context_1.useTheme)();
+    if (typeof outerTheme === 'undefined' && typeof theme === 'undefined') {
+        throw new Error('No Theme present in context & props');
+    }
+    var Provider = context_1.themeContext.Provider;
+    var value = (0, react_1.useMemo)(function () {
+        var _a, _b;
+        if (theme) {
+            var newTheme = void 0;
+            if (typeof theme === 'function') {
+                newTheme = theme(outerTheme);
+            }
+            else {
+                var newThemeName = (_a = theme.theme) === null || _a === void 0 ? void 0 : _a.name, outerThemeName = (_b = outerTheme === null || outerTheme === void 0 ? void 0 : outerTheme.theme) === null || _b === void 0 ? void 0 : _b.name, 
+                // theme should be merged if both the outerTheme & themeToOverride has same name
+                shouldMergeThemes = !newThemeName || !outerThemeName || newThemeName === outerThemeName;
+                if (shouldMergeThemes) {
+                    newTheme = (0, merge_1.default)({}, outerTheme, theme);
+                }
+                else {
+                    newTheme = (0, tslib_1.__assign)({ direction: outerTheme === null || outerTheme === void 0 ? void 0 : outerTheme.direction }, theme);
+                }
+            }
+            if (typeof newTheme !== 'object') {
+                throw new Error('theme has to be an object of shape {theme : {}, classes : {}}');
+            }
+            return addDensityToTheme(newTheme, density);
+        }
+        return addDensityToTheme(outerTheme, density);
+    }, [theme, outerTheme, density]);
+    var themeName = value.theme.name, prevThemName = (0, usePrevious_1.default)(themeName), containerElement = elementToApplyClass, prevContainerElement = (0, usePrevious_1.default)(containerElement);
+    (0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(function () {
+        prevThemName && (prevContainerElement === null || prevContainerElement === void 0 ? void 0 : prevContainerElement.classList.remove(prevThemName));
+        THEME_NAMES.forEach(function (name) { return containerElement === null || containerElement === void 0 ? void 0 : containerElement.classList.remove(name); });
+        containerElement === null || containerElement === void 0 ? void 0 : containerElement.classList.add(themeName);
+    }, [themeName, prevThemName, containerElement, prevContainerElement]);
+    /**
+     * Box component/styled cannot be used here as styletron might not be initialized when ThemeProvider renders for the first time.
+     */
+    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ "data-testid": "theme-provider-container", style: { display: 'contents' }, className: elementToApplyClass ? undefined : themeName }, { children: (0, jsx_runtime_1.jsx)(Provider, (0, tslib_1.__assign)({ value: value }, { children: children }), void 0) }), void 0));
+};
+exports.ThemeProvider = ThemeProvider;

package/theme/context.d.ts

@@ -1,14 +1,5 @@
-import { ReactElement, PropsWithChildren } from 'react';
+/// <reference types="react" />
 import { ThemeContext } from '../types';
-import { ThemeProviderT } from './types';
-import type { Density } from '@sprinklrjs/spaceweb-themes/types';
 export declare const themeContext: import("react").Context<ThemeContext>;
 export declare const useTheme: () => ThemeContext;
-declare type Props = PropsWithChildren<{
-    theme?: ThemeProviderT;
-    containerElement?: HTMLElement | null;
-    density?: Density;
-}>;
-export declare const ThemeProvider: (props: Props) => ReactElement;
 export declare const ThemeConsumer: import("react").Consumer<ThemeContext>;
-export {};

package/theme/context.js

@@ -1,70 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemeConsumer = exports.ThemeProvider = exports.useTheme = exports.themeContext = void 0;
+exports.ThemeConsumer = exports.useTheme = exports.themeContext = void 0;
 var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var merge_1 = (0, tslib_1.__importDefault)(require("lodash/merge"));
 var light_1 = (0, tslib_1.__importDefault)(require("@sprinklrjs/spaceweb-themes/hyperspace/light"));
-var baseui_1 = require("baseui");
-var usePrevious_1 = (0, tslib_1.__importDefault)(require("../hooks/usePrevious"));
-var useMemoizedStyletron_1 = (0, tslib_1.__importDefault)(require("../style/useMemoizedStyletron"));
-var themes_1 = (0, tslib_1.__importDefault)(require("../themes"));
-var useIsomorphicLayoutEffect_1 = require("../hooks/useIsomorphicLayoutEffect");
-//todo: remove default sprLight, too many tests failing on removal
 exports.themeContext = (0, react_1.createContext)(light_1.default);
 var useTheme = function () { return (0, react_1.useContext)(exports.themeContext); };
 exports.useTheme = useTheme;
-var THEME_NAMES = ['hyperspace-light', 'space-light', 'space-dark', 'hyperspace-dark'];
-var addDensityToTheme = function (theme, density) {
-    var _a;
-    return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme), { theme: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme.theme), { density: density || ((_a = theme.theme) === null || _a === void 0 ? void 0 : _a.density) }) }));
-};
-var ThemeProvider = function (props) {
-    var _a;
-    var theme = props.theme, children = props.children, elementToApplyClass = props.containerElement, density = props.density;
-    var _b = (0, tslib_1.__read)((0, react_1.useState)(null), 2), containerElementRef = _b[0], setContainerElementRef = _b[1];
-    var outerTheme = (0, exports.useTheme)();
-    var _c = (0, tslib_1.__read)((0, useMemoizedStyletron_1.default)(), 2), baseUITheme = _c[1];
-    if (typeof outerTheme === 'undefined' && typeof theme === 'undefined') {
-        throw new Error('No Theme present in context & props');
-    }
-    var Provider = exports.themeContext.Provider;
-    var value = (0, react_1.useMemo)(function () {
-        var _a, _b;
-        if (theme) {
-            var newTheme = void 0;
-            if (typeof theme === 'function') {
-                newTheme = theme(outerTheme);
-            }
-            else {
-                var newThemeName = (_a = theme.theme) === null || _a === void 0 ? void 0 : _a.name, outerThemeName = (_b = outerTheme === null || outerTheme === void 0 ? void 0 : outerTheme.theme) === null || _b === void 0 ? void 0 : _b.name, 
-                // theme should be merged if both the outerTheme & themeToOverride has same name
-                shouldMergeThemes = !newThemeName || !outerThemeName || newThemeName === outerThemeName;
-                if (shouldMergeThemes) {
-                    newTheme = (0, merge_1.default)({}, outerTheme, theme);
-                }
-                else {
-                    newTheme = (0, tslib_1.__assign)({ direction: outerTheme === null || outerTheme === void 0 ? void 0 : outerTheme.direction }, theme);
-                }
-            }
-            if (typeof newTheme !== 'object') {
-                throw new Error('theme has to be an object of shape {theme : {}, classes : {}}');
-            }
-            return addDensityToTheme(newTheme, density);
-        }
-        return addDensityToTheme(outerTheme, density);
-    }, [theme, outerTheme, density]);
-    var themeName = value.theme.name, prevThemName = (0, usePrevious_1.default)(themeName), containerElement = elementToApplyClass !== null && elementToApplyClass !== void 0 ? elementToApplyClass : containerElementRef, prevContainerElement = (0, usePrevious_1.default)(containerElement);
-    (0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(function () {
-        prevThemName && (prevContainerElement === null || prevContainerElement === void 0 ? void 0 : prevContainerElement.classList.remove(prevThemName));
-        THEME_NAMES.forEach(function (name) { return containerElement === null || containerElement === void 0 ? void 0 : containerElement.classList.remove(name); });
-        containerElement === null || containerElement === void 0 ? void 0 : containerElement.classList.add(themeName);
-    }, [themeName, prevThemName, containerElement, prevContainerElement]);
-    /**
-     * Box component/styled cannot be used here as styletron might not be initialized when ThemeProvider renders for the first time.
-     */
-    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ "data-testid": "theme-provider-container", style: { display: 'contents' }, ref: setContainerElementRef }, { children: (0, jsx_runtime_1.jsx)(baseui_1.ThemeProvider, (0, tslib_1.__assign)({ theme: (_a = themes_1.default[themeName]) !== null && _a !== void 0 ? _a : baseUITheme }, { children: (0, jsx_runtime_1.jsx)(Provider, (0, tslib_1.__assign)({ value: value }, { children: children }), void 0) }), void 0) }), void 0));
-};
-exports.ThemeProvider = ThemeProvider;
 exports.ThemeConsumer = exports.themeContext.Consumer;

package/theme/index.d.ts

@@ -1,2 +1,3 @@
+export * from './Provider';
 export * from './context';
 export * from './types';

package/theme/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
+(0, tslib_1.__exportStar)(require("./Provider"), exports);
 (0, tslib_1.__exportStar)(require("./context"), exports);
 (0, tslib_1.__exportStar)(require("./types"), exports);

package/time-picker/TimePicker.js

@@ -3,23 +3,29 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TimePicker = void 0;
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
-var timepicker_1 = require("baseui/timepicker");
+var react_1 = require("react");
+var timepicker_1 = require("../baseui/timepicker");
 var select_1 = require("../select");
 var context_1 = require("../form-control/context");
-var useConvertOverrides_1 = require("../helpers/baseui/useConvertOverrides");
+var themeHelpers_1 = require("../helpers/themeHelpers");
+var style_1 = require("../style");
+var overrides_1 = require("../overrides");
 var useTimePickerBasewebAdapter = function (props) {
-    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,
-            props: {
-                size: size,
-                intent: intent,
-                clearable: !!clearable,
+    var theme = (0, style_1.useStyle)().theme;
+    var _a = (0, context_1.useContextualFormProps)(props), _b = _a.size, size = _b === void 0 ? (0, themeHelpers_1.getDefaultSize)(theme) : _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, react_1.useMemo)(function () {
+        return (0, overrides_1.mergeOverrides)({
+            Select: {
+                component: select_1.Select,
+                props: {
+                    size: size,
+                    intent: intent,
+                    clearable: !!clearable,
+                },
+                style: [className, style],
             },
-            style: [className, style],
-        },
-    }, overrides, [overrides, className, style, size, intent]);
+        }, overrides);
+    }, [overrides, className, style, size, intent]);
     return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, restProps), { nullable: clearable, overrides: convertedOverrides });
 };
 var TimePicker = function (props) {

package/time-picker/types.d.ts

@@ -1,8 +1,8 @@
 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';
+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>;
 };

package/time-range-picker/RangeSelector.js

@@ -7,20 +7,16 @@ var box_1 = require("../box");
 var TimeRangeList_1 = (0, tslib_1.__importDefault)(require("./TimeRangeList"));
 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, _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 _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,
-    });
-    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, (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, 
+    var overrides = timeRangeListProps.overrides, restTimeRangeListProps = (0, tslib_1.__rest)(timeRangeListProps, ["overrides"]);
+    var TIME_RANGE_LIST_OVERRIDES = (0, react_1.useMemo)(function () {
+        return (0, overrides_1.mergeOverrides)({ Menu: { props: { overrides: { List: { props: { overrides: { Root: { style: 'h-0' } } } } } } } }, overrides);
+    }, [overrides]);
+    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" }, { children: [props.timeRangePresets.length !== 1 ? ((0, jsx_runtime_1.jsx)(TimeRangeList, (0, tslib_1.__assign)({ onChange: onChange, timeRange: timeRange, preset: preset, timeRangePresets: props.timeRangePresets, overrides: TIME_RANGE_LIST_OVERRIDES }, restTimeRangeListProps), 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 }, calendarProps), void 0) }), void 0)] }), void 0));
 };

package/time-range-picker/RangeSelectorContainer.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var date_helpers_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-helpers"));
+var date_helpers_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-helpers"));
 var classNames_1 = (0, tslib_1.__importDefault)(require("../classNames"));
 var box_1 = require("../box");
 var RangeSelector_1 = (0, tslib_1.__importDefault)(require("./RangeSelector"));
@@ -97,7 +97,7 @@ var RangeSelectorContainer = function (_a) {
                         });
                     },
                 ] }, void 0), (0, jsx_runtime_1.jsx)(typography_1.Typography, (0, tslib_1.__assign)({ className: "my-0", variant: "bs3" }, { children: errMsg }), void 0)] }), void 0)) : null;
-    return ((0, jsx_runtime_1.jsxs)(box_1.Box, (0, tslib_1.__assign)({ className: "spr-ui-01 rounded-8" }, { children: [(0, jsx_runtime_1.jsxs)(Header, (0, tslib_1.__assign)({ "$setTimezone": setTimezone, "$onClose": props.onClose }, headerProps, { children: [(0, jsx_runtime_1.jsx)(HeaderBeforeEnhancer, (0, tslib_1.__assign)({ variant: "bs1", "$as": "span", weight: "medium", className: "flex items-center" }, headerBeforeEnhancerProps, { children: locale.timeRangePicker.headerLabel }), void 0), disableTimezone ? null : ((0, jsx_runtime_1.jsx)(TimezonePicker, (0, tslib_1.__assign)({ setTimezone: setTimezone, timezone: timezone }, timezonePickerProps), void 0))] }), void 0), (0, jsx_runtime_1.jsx)(RangeSelector_1.default, { overrides: props.overrides, timeSelect: props.timeSelect, timeRangePresets: timeRangePresets, timezone: timezone, timeRange: timeRange, preset: preset, onChange: onDateChange, adapter: adapter, peekNextMonth: props.peekNextMonth, excludeDates: props.excludeDates, filterDate: props.filterDate, minDate: minDate, maxDate: maxDate, formatString: props.formatString, locale: props.locale, fixedHeight: props.fixedHeight, monthsShown: monthsShown }, void 0), (0, jsx_runtime_1.jsxs)(Footer, (0, tslib_1.__assign)({ "$hasError": hasError, "$onSubmit": handleSubmit, "$onClose": props.onClose }, footerProps, { className: "justify-between" }, { children: [(0, jsx_runtime_1.jsx)(FooterBeforeEnhancer, (0, tslib_1.__assign)({}, footerBeforeEnhancerProps), void 0), (0, jsx_runtime_1.jsxs)(stack_1.Stack, (0, tslib_1.__assign)({ direction: monthsShown === 1 ? 'vertical' : 'horizontal', gap: 3, className: [(0, classNames_1.default)({ 'items-center': monthsShown !== 1 }), { maxWidth: 'fit-content' }] }, { children: [monthsShown === 1 ? null : errorEl, (0, jsx_runtime_1.jsxs)(stack_1.StackItem, (0, tslib_1.__assign)({ className: "flex self-end" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, (0, tslib_1.__assign)({ size: "sm", onClick: props.onClose, variant: "secondary", "data-testid": "cancel" }, { children: locale.timeRangePicker.cancelBtnLabel }), void 0), (0, jsx_runtime_1.jsx)(button_1.Button, (0, tslib_1.__assign)({ size: "sm", className: "ml-3", onClick: handleSubmit, disabled: hasError, "data-testid": "save" }, { children: locale.timeRangePicker.saveBtnLabel }), void 0)] }), void 0), monthsShown === 1 ? errorEl : null] }), void 0)] }), void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)(box_1.Box, (0, tslib_1.__assign)({ className: "spr-ui-01 rounded-8" }, { children: [(0, jsx_runtime_1.jsxs)(Header, (0, tslib_1.__assign)({ "$setTimezone": setTimezone, "$onClose": props.onClose }, headerProps, { children: [(0, jsx_runtime_1.jsx)(HeaderBeforeEnhancer, (0, tslib_1.__assign)({ variant: "bs1", "$as": "span", weight: "medium", className: "flex items-center" }, headerBeforeEnhancerProps, { children: locale.timeRangePicker.headerLabel }), void 0), disableTimezone ? null : ((0, jsx_runtime_1.jsx)(TimezonePicker, (0, tslib_1.__assign)({ setTimezone: setTimezone, timezone: timezone }, timezonePickerProps), void 0))] }), void 0), (0, jsx_runtime_1.jsx)(RangeSelector_1.default, { overrides: props.overrides, timeSelect: props.timeSelect, timeRangePresets: timeRangePresets, timezone: timezone, timeRange: timeRange, preset: preset, onChange: onDateChange, adapter: adapter, peekNextMonth: props.peekNextMonth, excludeDates: props.excludeDates, filterDate: props.filterDate, minDate: minDate, maxDate: maxDate, formatString: props.formatString, locale: props.locale, fixedHeight: props.fixedHeight, monthsShown: monthsShown }, void 0), (0, jsx_runtime_1.jsx)(Footer, (0, tslib_1.__assign)({ "$hasError": hasError, "$onSubmit": handleSubmit, "$onClose": props.onClose }, footerProps, { children: (0, jsx_runtime_1.jsxs)(box_1.Box, (0, tslib_1.__assign)({ className: "justify-between w-0 flex-grow flex" }, { children: [(0, jsx_runtime_1.jsx)(FooterBeforeEnhancer, (0, tslib_1.__assign)({}, footerBeforeEnhancerProps), void 0), (0, jsx_runtime_1.jsxs)(stack_1.Stack, (0, tslib_1.__assign)({ direction: monthsShown === 1 ? 'vertical' : 'horizontal', gap: 3, className: [(0, classNames_1.default)({ 'items-center': monthsShown !== 1 }), { maxWidth: 'fit-content' }] }, { children: [monthsShown === 1 ? null : errorEl, (0, jsx_runtime_1.jsxs)(stack_1.StackItem, (0, tslib_1.__assign)({ className: "flex self-end" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, (0, tslib_1.__assign)({ size: "xs", onClick: props.onClose, variant: "secondary", "data-testid": "cancel" }, { children: locale.timeRangePicker.cancelBtnLabel }), void 0), (0, jsx_runtime_1.jsx)(button_1.Button, (0, tslib_1.__assign)({ size: "xs", className: "ml-3", onClick: handleSubmit, disabled: hasError, "data-testid": "save" }, { children: locale.timeRangePicker.saveBtnLabel }), void 0)] }), void 0), monthsShown === 1 ? errorEl : null] }), void 0)] }), void 0) }), void 0)] }), void 0));
 };
 RangeSelectorContainer.displayName = 'RangeSelectorContainer';
 exports.default = RangeSelectorContainer;

package/time-range-picker/TimeRangeList.js

@@ -27,7 +27,7 @@ var TimeRangeList = function (_a) {
             {
                 width: isMobileDevice ? '110px' : '160px',
             },
-        ] }, { children: (0, jsx_runtime_1.jsx)(Menu, (0, tslib_1.__assign)({ "aria-label": locale.timeRangePicker.presetMenuAriaLabel, disableNavigationOnMount: true, resetMenuHighlightOnMouseLeave: true, className: ['focus-visible:-outline-offset-2', menuProps === null || menuProps === void 0 ? void 0 : menuProps.className], role: "listbox", "$showFocusOutline": true }, menuProps, { children: timeRangePresets.map(function (timeRangePreset) { return ((0, jsx_runtime_1.jsx)(MenuItem, (0, tslib_1.__assign)({ onClick: function () { return onItemSelect(timeRangePreset); }, selected: timeRangePreset.id === preset, className: [
+        ] }, { children: (0, jsx_runtime_1.jsx)(Menu, (0, tslib_1.__assign)({ "aria-label": locale.timeRangePicker.presetMenuAriaLabel, disableNavigationOnMount: true, resetMenuHighlightOnMouseLeave: true, className: ['focus-visible:-outline-offset-2 min-w-full', menuProps === null || menuProps === void 0 ? void 0 : menuProps.className], role: "listbox", "$showFocusOutline": true }, menuProps, { children: timeRangePresets.map(function (timeRangePreset) { return ((0, jsx_runtime_1.jsx)(MenuItem, (0, tslib_1.__assign)({ onClick: function () { return onItemSelect(timeRangePreset); }, selected: timeRangePreset.id === preset, className: [
                     'static',
                     function (_a, _b) {
                         var theme = _a.theme;

package/time-range-picker/TimeRangePicker.js

@@ -4,8 +4,8 @@ exports.TimeRangePicker = void 0;
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
-var date_helpers_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-helpers"));
+var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-fns-adapter"));
+var date_helpers_1 = (0, tslib_1.__importDefault)(require("../baseui/datepicker/utils/date-helpers"));
 var RangeSelectorContainer_1 = (0, tslib_1.__importDefault)(require("./RangeSelectorContainer"));
 var utils_1 = require("./utils");
 var date_picker_1 = require("../date-picker");
@@ -14,7 +14,13 @@ var constants_1 = require("../date-picker/constants");
 var overrides_1 = require("../overrides");
 var utils_2 = require("../date-picker/utils");
 var constants_2 = require("./constants");
+var button_1 = require("../button");
+var calendar_solid_1 = (0, tslib_1.__importDefault)(require("../icon/components/calendar-solid"));
 var __DEV__ = process.env.NODE_ENV !== 'production';
+var CalendarIconInputButton = function (_a) {
+    var size = _a.size, value = _a.value, isSelected = _a.isSelected, locale = _a.locale;
+    return ((0, jsx_runtime_1.jsx)(button_1.IconButton, (0, tslib_1.__assign)({ tooltipContent: value !== null && value !== void 0 ? value : locale.calendar.calendarButtonAriaLabel, size: size, bordered: true, shape: "square", isSelected: isSelected }, { children: (0, jsx_runtime_1.jsx)(calendar_solid_1.default, {}, void 0) }), void 0));
+};
 var TimeRangePicker = function (_a) {
     var _b = _a.adapter, adapter = _b === void 0 ? date_fns_adapter_1.default : _b, onSubmit = _a.onSubmit, _timezone = _a.timezone, value = _a.value, formatDisplayValue = _a.formatDisplayValue, timeRangePresets = _a.timeRangePresets, overrides = _a.overrides, timeSelect = _a.timeSelect, peekNextMonth = _a.peekNextMonth, excludeDates = _a.excludeDates, filterDate = _a.filterDate, minDate = _a.minDate, maxDate = _a.maxDate, _c = _a.placeholder, placeholder = _c === void 0 ? "".concat(constants_1.DEFAULT_FORMAT_STRING, "-").concat(constants_1.DEFAULT_FORMAT_STRING) : _c, _d = _a.formatString, formatString = _d === void 0 ? constants_1.DEFAULT_FORMAT_STRING : _d, onClose = _a.onClose, onChange = _a.onChange, showTimezoneInSummary = _a.showTimezoneInSummary, clearable = _a.clearable, onClear = _a.onClear, showFullDateInSummary = _a.showFullDateInSummary, autoSizeInput = _a.autoSizeInput, preset = _a.preset, _e = _a.startOpen, startOpen = _e === void 0 ? false : _e, fixedHeight = _a.fixedHeight, _f = _a.monthsShown, monthsShown = _f === void 0 ? 2 : _f, weekStartsOn = _a.weekStartsOn, _g = _a.disableTimezone, disableTimezone = _g === void 0 ? false : _g, _h = _a.displayVariant, displayVariant = _h === void 0 ? 'default' : _h, props = (0, tslib_1.__rest)(_a, ["adapter", "onSubmit", "timezone", "value", "formatDisplayValue", "timeRangePresets", "overrides", "timeSelect", "peekNextMonth", "excludeDates", "filterDate", "minDate", "maxDate", "placeholder", "formatString", "onClose", "onChange", "showTimezoneInSummary", "clearable", "onClear", "showFullDateInSummary", "autoSizeInput", "preset", "startOpen", "fixedHeight", "monthsShown", "weekStartsOn", "disableTimezone", "displayVariant"]);
     if (__DEV__) {
@@ -44,9 +50,8 @@ var TimeRangePicker = function (_a) {
     ], false); }, [timeRangePresets, locale]);
     var formatDate = (0, react_1.useCallback)(function (date, normalizedFormatString) {
         if (normalizedFormatString === void 0) { normalizedFormatString = (0, utils_2.normalizeDashes)(formatString); }
-        var adaptedSystemTz = new Date((0, utils_1.switchEpochTimezone)(date, timezone, (0, utils_1.getSystemTzName)()));
-        return dateHelpers.formatDate(adaptedSystemTz, normalizedFormatString, dateFnsLocale);
-    }, [formatString, dateHelpers, timezone, dateFnsLocale]);
+        return dateHelpers.formatDate(date, normalizedFormatString, dateFnsLocale);
+    }, [formatString, dateHelpers, dateFnsLocale]);
     var defaultFormatDisplayValue = (0, react_1.useCallback)(function (date, normalizedFormatString) {
         var _a, _b;
         if (normalizedFormatString === void 0) { normalizedFormatString = (0, utils_2.normalizeDashes)(formatString); }
@@ -100,8 +105,8 @@ var TimeRangePicker = function (_a) {
         var timeRange = _a.timeRange, preset = _a.preset, timezone = _a.timezone;
         // value is returned only for backward compatibility will be removed in future version.
         if (preset === 'CUSTOM') {
-            var startMillis = (0, utils_1.switchEpochTimezone)(timeRange[0], (0, utils_1.getSystemTzName)(), timezone);
-            var endMillis = (0, utils_1.switchEpochTimezone)(timeRange[1], (0, utils_1.getSystemTzName)(), timezone);
+            var startMillis = (0, utils_1.convertDateFromTargetTzToSystemTz)(timeRange[0], timezone);
+            var endMillis = (0, utils_1.convertDateFromTargetTzToSystemTz)(timeRange[1], timezone);
             var dates = [new Date(startMillis), new Date(endMillis)];
             onSubmit((0, tslib_1.__assign)({ value: dates, preset: preset, date: dates }, (disableTimezone ? {} : { timezone: timezone })));
         }
@@ -120,12 +125,20 @@ var TimeRangePicker = function (_a) {
         else {
             dates = (_c = (_b = (_a = (0, utils_1.getSelectedTimeRange)(preset !== null && preset !== void 0 ? preset : value, timeRangeList)) === null || _a === void 0 ? void 0 : _a.getTimeRangeLimits) === null || _b === void 0 ? void 0 : _b.call(_a, timezone)) !== null && _c !== void 0 ? _c : [];
         }
-        return (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], (0, tslib_1.__read)((dates[0] ? [(0, utils_1.adaptDateWithSystemTz)(dates[0], timezone)] : [])), false), (0, tslib_1.__read)((dates[1] ? [(0, utils_1.adaptDateWithSystemTz)(dates[1], timezone)] : [])), false);
+        return (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], (0, tslib_1.__read)((dates[0] ? [new Date((0, utils_1.convertDateFromSystemTzToTargetTz)(dates[0], timezone))] : [])), false), (0, tslib_1.__read)((dates[1] ? [new Date((0, utils_1.convertDateFromSystemTzToTargetTz)(dates[1], timezone))] : [])), false);
     }, [value, timeRangeList, timezone, preset]);
     var mergedOverrides = (0, react_1.useMemo)(function () {
         return (0, overrides_1.mergeOverrides)({
-            Input: {
-                props: {
+            Input: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, (displayVariant === 'iconButton'
+                ? {
+                    component: CalendarIconInputButton,
+                    Before: {
+                        component: function () { return null; },
+                    },
+                }
+                : {})), { props: {
+                    isSelected: !!value && value.length > 0,
+                    locale: locale,
                     overrides: (0, tslib_1.__assign)({}, (displayVariant === 'compact'
                         ? {
                             Before: {
@@ -133,8 +146,7 @@ var TimeRangePicker = function (_a) {
                             },
                         }
                         : {})),
-                },
-            },
+                } }),
             InputWrapper: {
                 props: {
                     'data-testid': 'time-range',
@@ -178,6 +190,8 @@ var TimeRangePicker = function (_a) {
         disableTimezone,
         locale.timeRangePicker.popoverAriaLabel,
         displayVariant,
+        locale.calendar.calendarButtonAriaLabel,
+        props.size,
     ]);
     var handleInputChange = (0, react_1.useCallback)(function (_a) {
         var _b = _a.value, _value = _b === void 0 ? [] : _b;
@@ -186,6 +200,6 @@ var TimeRangePicker = function (_a) {
         onSubmit((0, tslib_1.__assign)({ value: _value, preset: 'CUSTOM', date: _value }, (disableTimezone ? {} : { timezone: timezone })));
         onClear === null || onClear === void 0 ? void 0 : onClear();
     }, [onSubmit, timezone, onClear, disableTimezone]);
-    return ((0, jsx_runtime_1.jsx)(date_picker_1.StatelessDatePicker, { value: timeRange, isOpen: isOpen, onFocus: handleOpen, onBlur: handleClose, formatDisplayValue: defaultFormatDisplayValue, trapTabbing: false, intent: props.intent, variant: props.variant, size: props.size, disabled: props.disabled, formatString: formatString, placeholder: placeholder, "aria-label": locale.timeRangePicker.ariaLabelRange, overrides: mergedOverrides, clearable: clearable, onChange: handleInputChange, autoSizeInput: autoSizeInput, locale: dateFnsLocale, mountNode: props.mountNode, minDate: minDate, maxDate: maxDate }, void 0));
+    return ((0, jsx_runtime_1.jsx)(date_picker_1.StatelessDatePicker, { value: timeRange, isOpen: isOpen, onFocus: handleOpen, onBlur: handleClose, formatDisplayValue: defaultFormatDisplayValue, trapTabbing: false, intent: props.intent, variant: props.variant, size: props.size, disabled: props.disabled, formatString: formatString, placeholder: placeholder, "aria-label": locale.timeRangePicker.ariaLabelRange, overrides: mergedOverrides, clearable: clearable, onChange: handleInputChange, autoSizeInput: autoSizeInput, locale: dateFnsLocale, mountNode: props.mountNode, minDate: minDate, maxDate: maxDate, "aria-describedby": props['aria-describedby'], "aria-labelledby": props['aria-labelledby'], required: props.required, id: props.id }, void 0));
 };
 exports.TimeRangePicker = TimeRangePicker;

package/time-range-picker/constants.d.ts

@@ -1,5 +1,3 @@
 export declare const CUSTOM_OPTION: {
     id: string;
 };
-export declare const CALENDAR_HEIGHT = 373;
-export declare const TIME_SELECT_ROW_HEIGHT = 75;

package/time-range-picker/constants.js

@@ -1,8 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TIME_SELECT_ROW_HEIGHT = exports.CALENDAR_HEIGHT = exports.CUSTOM_OPTION = void 0;
+exports.CUSTOM_OPTION = void 0;
 exports.CUSTOM_OPTION = {
     id: 'CUSTOM',
 };
-exports.CALENDAR_HEIGHT = 373;
-exports.TIME_SELECT_ROW_HEIGHT = 75;

package/time-range-picker/index.d.ts

@@ -1,4 +1,4 @@
 export { TimeRangePicker } from './TimeRangePicker';
-export { getDefaultTimeRangePresets, formatSummaryValue } from './utils';
+export { getDefaultTimeRangePresets, formatSummaryValue, convertDateFromSrcTzToTargetTz, convertDateFromSystemTzToTargetTz, convertDateFromTargetTzToSystemTz, } from './utils';
 export type { TimeRangePickerLocale } from './locale';
 export type { TimeRangePickerValue, TimeRangePickerProps, TimeRangePreset, TimeRangePickerOverrides, FormatString, } from './types';

package/time-range-picker/index.js

@@ -1,8 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatSummaryValue = exports.getDefaultTimeRangePresets = exports.TimeRangePicker = void 0;
+exports.convertDateFromTargetTzToSystemTz = exports.convertDateFromSystemTzToTargetTz = exports.convertDateFromSrcTzToTargetTz = exports.formatSummaryValue = exports.getDefaultTimeRangePresets = exports.TimeRangePicker = void 0;
 var TimeRangePicker_1 = require("./TimeRangePicker");
 Object.defineProperty(exports, "TimeRangePicker", { enumerable: true, get: function () { return TimeRangePicker_1.TimeRangePicker; } });
 var utils_1 = require("./utils");
 Object.defineProperty(exports, "getDefaultTimeRangePresets", { enumerable: true, get: function () { return utils_1.getDefaultTimeRangePresets; } });
 Object.defineProperty(exports, "formatSummaryValue", { enumerable: true, get: function () { return utils_1.formatSummaryValue; } });
+Object.defineProperty(exports, "convertDateFromSrcTzToTargetTz", { enumerable: true, get: function () { return utils_1.convertDateFromSrcTzToTargetTz; } });
+Object.defineProperty(exports, "convertDateFromSystemTzToTargetTz", { enumerable: true, get: function () { return utils_1.convertDateFromSystemTzToTargetTz; } });
+Object.defineProperty(exports, "convertDateFromTargetTzToSystemTz", { enumerable: true, get: function () { return utils_1.convertDateFromTargetTzToSystemTz; } });

package/time-range-picker/types.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { DatepickerOverrides, FormatString, StatelessDatePickerProps } from '../date-picker';
 import { Override } from '../overrides';
-import { Option } from 'baseui/select';
+import { Option } from '../baseui/select';
 import { BaseSelectProps } from '../select/types';
 export type { FormatString } from '../date-picker';
 export declare type TimeRangePreset = {
@@ -29,7 +29,6 @@ export declare type TimeRangePickerOverrides = DatepickerOverrides<Record<string
     Header?: Override<Record<string, any>>;
     HeaderBeforeEnhancer?: Override<Record<string, any>>;
     FooterBeforeEnhancer?: Override<Record<string, any>>;
-    TimezonePicker?: Override<Record<string, any>>;
     Calendar?: Override<Record<string, any>>;
 };
 export declare type TimeRangePickerValue = {
@@ -39,7 +38,7 @@ export declare type TimeRangePickerValue = {
     timezone?: string;
 };
 declare type Preset = string;
-export declare type SizeVariant = 'default' | 'compact';
+export declare type SizeVariant = 'default' | 'compact' | 'iconButton';
 export declare type FormatSummaryValueOptions = {
     date: Date[];
     presetId: string;
@@ -60,7 +59,6 @@ export declare type TimeRangePickerProps = Omit<StatelessDatePickerProps, 'value
      */
     value?: Preset | Date[];
     preset?: Preset;
-    timezone?: string;
     timeRangePresets?: TimeRangePreset[];
     onSubmit: (timeRangePickerValue: TimeRangePickerValue) => void;
     overrides?: TimeRangePickerOverrides;

package/time-range-picker/utils.d.ts

@@ -1,20 +1,49 @@
-import DateHelpers from 'baseui/datepicker/utils/date-helpers';
+import DateHelpers from '../baseui/datepicker/utils/date-helpers';
 import { Locale } from '../locale';
-import { FormatSummaryValueOptions, TimeRangePreset } from './types';
+import type { FormatSummaryValueOptions, TimeRangePreset } from './types';
 export declare const getSelectedTimeRange: (selectedTimeRange: string | undefined, timeRangeOptions: Array<TimeRangePreset>) => TimeRangePreset | undefined;
 export declare const getSystemTzName: () => string;
+/**
+  @param date: Date object or epoch in source timezone
+  @param srcTz: source timezone
+  @param targetTz: target timezone
+  This function is used to convert the time from one timezone to another timezone.
+  Example use-case of this function
+  Lets say you want to find out what time it will be in New York when it is 6th Nov, 2022 00:00 in Los Angeles.
+  then you can call like:
+  convertDateFromSrcTzToTargetTz(new Date('6 Nov 2022, 00:00'), "America/Los_Angeles", "America/New_York")
+  this function will return 6 Nov 2022, 2:00 because generally NY is 3 hours ahead of LA but at 2:00AM NY will switch to DST
+  and hence it will be not 3:00AM but 2:00AM.
+*/
+export declare const convertDateFromSrcTzToTargetTz: (date: Date | number, srcTz?: string, targetTz?: string) => number;
+/**
+ * @param date Date object or epoch representing the date in particular timezone
+ * @param timezone timezone of the date
+ * @returns epoch of the same time in system timezone
+ * Use case:
+ * Lets say user selects 6 Nov 2022, 00:00 from Time range picker and selects New York timezone.
+ * Now we want to find out what that time represents in our system timezone(Los Angeles) which in given case is 5 Nov 2022, 21:00
+ */
+export declare const convertDateFromTargetTzToSystemTz: (date: Date | number, timezone?: string) => number;
+/**
+ * @param date date in system timezone
+ * @param timezone timezone in which you want to convert this date to
+ * @returns date in that timezone
+ * Use case:
+ * User will come back with 5 Nov 2022, 21:00 but has selected new york timezone so we want to find out
+ * what time it will be in new york when it is 5 Nov 2022, 21:00 in system timezone(Los Angeles), which is
+ * 6 Nov 2022, 00:00
+ */
+export declare const convertDateFromSystemTzToTargetTz: (date: Date | number, timezone?: string) => number;
 /**
  * returns milliseconds offset from timezone name
  */
 export declare const getTzOffset: (timezone: string, date?: number | Date | undefined) => number;
 /**
+ * @deprecated use convertDateFromTargetTzToSystemTz function to make sure you account for DST cases too
  * convert epoch from one timezone to another
  */
 export declare const switchEpochTimezone: (date: Date | number, tzFrom?: string, tzTo?: string) => number;
-/**
- * adapts date with the system timezone
- */
-export declare const adaptDateWithSystemTz: (date: Date, selectedTimezone: string) => Date;
 /**
  * Adds or subtract the offset according to timezone passed so that we can get correct start date and end date in that timezone.
  * ex. Lets say we are in Asia/Kolakata timezone on 19th Feb and time is 12:30 AM, and selected Asia/Kabul timezone and preset as Today.
@@ -25,10 +54,6 @@ export declare const adaptDateWithSystemTz: (date: Date, selectedTimezone: strin
 export declare const getDateForGivenTimezone: (timezone?: string | undefined) => Date;
 export declare const getDefaultTimeRangePresets: (locale: Locale) => TimeRangePreset[];
 export declare const formatSummaryValue: ({ date, presetId, presetLabel, timezone, formatString, showFullDateInSummary, showTimezoneInSummary, adapter, locale, hidePresetLabel, displayVariant, }: FormatSummaryValueOptions) => string;
-export declare const getHeight: ({ monthsShown, timeSelect }: {
-    monthsShown?: number | undefined;
-    timeSelect?: boolean | undefined;
-}) => number;
 export declare const getRangeError: ({ maxDate, minDate, dateHelpers, timeRange, locale, preset, }: {
     minDate?: Date | null | undefined;
     maxDate?: Date | null | undefined;