@sprinklrjs/spaceweb 10.1.0 → 12.14.4

package/date-picker/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatDate = exports.useDatePickerState = exports.StatelessDatePicker = exports.DatePickerInput = exports.DatePicker = exports.StyledWeekdayHeader = exports.StyledWeek = exports.StyledSelectorContainer = exports.StyledRoot = exports.StyledPrevButton = exports.StyledNextButton = exports.StyledMonthYearSelectIconContainer = exports.StyledMonthYearSelectButton = exports.StyledMonthHeader = exports.StyledMonthContainer = exports.StyledMonth = exports.StyledInputWrapper = exports.StyledCalendarHeader = exports.StyledCalendarContainer = exports.Calendar = void 0;
+exports.DateTimeRangeInputs = exports.formatDate = exports.useDatePickerState = exports.StatelessDatePicker = exports.DatePickerInput = exports.DatePicker = exports.StyledWeekdayHeader = exports.StyledWeek = exports.StyledSelectorContainer = exports.StyledRoot = exports.StyledPrevButton = exports.StyledNextButton = exports.StyledMonthYearSelectIconContainer = exports.StyledMonthYearSelectButton = exports.StyledMonthHeader = exports.StyledMonthContainer = exports.StyledMonth = exports.StyledInputWrapper = exports.StyledCalendarHeader = exports.StyledCalendarContainer = exports.Calendar = void 0;
 var tslib_1 = require("tslib");
 var Calendar_1 = (0, tslib_1.__importDefault)(require("./Calendar"));
 exports.Calendar = Calendar_1.default;
@@ -29,4 +29,6 @@ var useDatePickerState_1 = require("./useDatePickerState");
 Object.defineProperty(exports, "useDatePickerState", { enumerable: true, get: function () { return useDatePickerState_1.useDatePickerState; } });
 var utils_1 = require("./utils");
 Object.defineProperty(exports, "formatDate", { enumerable: true, get: function () { return utils_1.formatDate; } });
+var DateTimeContainer_1 = require("./DateTimeContainer");
+Object.defineProperty(exports, "DateTimeRangeInputs", { enumerable: true, get: function () { return DateTimeContainer_1.DateTimeContainer; } });
 (0, tslib_1.__exportStar)(require("./types"), exports);

package/date-picker/locale.d.ts

@@ -1,3 +1,5 @@
 export declare type DatePickerLocale = {
     popoverAriaLabel: string;
+    timezonePickerLabel: string;
+    timezonePickerPlaceholder: string;
 };

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

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

package/date-picker/stateful-container.js

@@ -4,23 +4,26 @@ var tslib_1 = require("tslib");
 var React = (0, tslib_1.__importStar)(require("react"));
 var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
 var useDatePickerState_1 = require("./useDatePickerState");
+var utils_1 = require("../time-range-picker/utils");
 var StatefulContainer = function (_a) {
-    var _b;
-    var adapter = _a.adapter, onChange = _a.onChange, value = _a.value, _c = _a.startOpen, startOpen = _c === void 0 ? false : _c, props = (0, tslib_1.__rest)(_a, ["adapter", "onChange", "value", "startOpen"]);
-    var _d = (0, tslib_1.__read)(React.useState(value), 2), date = _d[0], setDate = _d[1];
-    var _e = (0, useDatePickerState_1.useDatePickerState)({ startOpen: startOpen }), isOpen = _e.isOpen, handleOpen = _e.handleOpen, handleClose = _e.handleClose, setIsOpen = _e.setIsOpen;
+    var _b, _c;
+    var adapter = _a.adapter, onChange = _a.onChange, value = _a.value, _d = _a.startOpen, startOpen = _d === void 0 ? false : _d, props = (0, tslib_1.__rest)(_a, ["adapter", "onChange", "value", "startOpen"]);
+    var _e = (0, tslib_1.__read)(React.useState(value), 2), date = _e[0], setDate = _e[1];
+    var _f = (0, tslib_1.__read)(React.useState((_b = props.timezone) !== null && _b !== void 0 ? _b : (0, utils_1.getSystemTzName)()), 2), timezone = _f[0], setTimezone = _f[1];
+    var _g = (0, useDatePickerState_1.useDatePickerState)({ startOpen: startOpen }), isOpen = _g.isOpen, handleOpen = _g.handleOpen, handleClose = _g.handleClose, setIsOpen = _g.setIsOpen;
     React.useEffect(function () {
         setDate(value);
     }, [value]);
     var handleDateChange = React.useCallback(function (_a) {
-        var _value = _a.value;
+        var _value = _a.value, _timezone = _a.timezone;
         var prevValue = date;
         setDate(_value);
-        onChange === null || onChange === void 0 ? void 0 : onChange({ value: _value });
+        setTimezone(_timezone);
+        onChange === null || onChange === void 0 ? void 0 : onChange(props.showTimezone ? { value: _value, timezone: _timezone } : { value: _value });
         setIsOpen(false);
-    }, [setDate, setIsOpen, onChange, date]);
+    }, [setDate, setIsOpen, onChange, date, props.showTimezone]);
     var children = props.children, restProps = (0, tslib_1.__rest)(props, ["children"]);
-    return (_b = props.children) === null || _b === void 0 ? void 0 : _b.call(props, (0, tslib_1.__assign)((0, tslib_1.__assign)({}, restProps), { value: date, adapter: adapter, onChange: handleDateChange, onFocus: handleOpen, onBlur: handleClose, isOpen: isOpen, range: false }));
+    return (_c = props.children) === null || _c === void 0 ? void 0 : _c.call(props, (0, tslib_1.__assign)((0, tslib_1.__assign)({}, restProps), { value: date, adapter: adapter, onChange: handleDateChange, onFocus: handleOpen, onBlur: handleClose, isOpen: isOpen, range: false, timezone: timezone }));
 };
 StatefulContainer.defaultProps = {
     adapter: date_fns_adapter_1.default,

package/date-picker/styled-components.d.ts

@@ -2,7 +2,6 @@ import { SharedStyleProps } from './types';
 import { StyleFn, Styles } from '../types';
 export declare const StyledInputWrapper: import("../style/styled").StyledComponent;
 export declare const getDayStyles: (todaySOD: any) => Styles;
-export declare const StyledWeekdayHeader: import("../style/styled").StyledComponent;
 export declare const StyledFooter: import("../style/styled").StyledComponent;
 export declare const StyledFooterBeforeEnhancer: import("../style/styled").StyledComponent;
 export declare const getCalendarContainerStyles: StyleFn<SharedStyleProps>;

package/date-picker/styled-components.js

@@ -1,33 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getCalendarContainerStyles = exports.StyledFooterBeforeEnhancer = exports.StyledFooter = exports.StyledWeekdayHeader = exports.getDayStyles = exports.StyledInputWrapper = void 0;
+exports.getCalendarContainerStyles = exports.StyledFooterBeforeEnhancer = exports.StyledFooter = exports.getDayStyles = exports.StyledInputWrapper = void 0;
 var tslib_1 = require("tslib");
-var utils_1 = require("baseui/datepicker/utils");
 var day_state_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/day-state"));
 var date_fns_adapter_1 = (0, tslib_1.__importDefault)(require("baseui/datepicker/utils/date-fns-adapter"));
 var style_1 = require("../style");
 exports.StyledInputWrapper = (0, style_1.styled)('div');
-var getWeekdayHeaderStyle = function (utils, props) {
-    var getStyle = utils.getStyle, px2rem = utils.px2rem, theme = utils.theme;
-    var _a = props.$date, $date = _a === void 0 ? [new Date()] : _a, alt = props.alt, range = props.range;
-    // no highlight required if range is true or no date is selected
-    var isHighlighted;
-    if (range || !$date[0]) {
-        isHighlighted = false;
-    }
-    else {
-        isHighlighted = (0, utils_1.getWeekdayInLocale)(Array.isArray($date) ? $date[0] : $date) === alt;
-    }
-    return getStyle('border-b-2 box-border cursor-default h-9 inline-block m-0 pb-2 pt-2 relative text-center w-9', {
-        marginBottom: '-1px',
-        borderBottomStyle: 'solid',
-        borderBottomColor: isHighlighted ? theme.spr.ui04 : 'transparent',
-        color: isHighlighted ? theme.spr.text04 : 'inherit',
-        lineHeight: px2rem(20),
-        paddingLeft: px2rem(6),
-        paddingRight: px2rem(6),
-    });
-};
 var getEdgeDayBeforeStyle = function (code, firstChild, peekNextMonth) {
     var firstChildStyle = firstChild ? { content: 'none' } : {};
     var lastChildStyle = firstChild ? {} : { content: 'none' };
@@ -76,6 +54,56 @@ var getEdgeDayBeforeStyle = function (code, firstChild, peekNextMonth) {
         '101010010000010': !peekNextMonth && firstChild ? { content: 'none' } : pseudoSelectedStyle,
     }[code] || {});
 };
+function generateDayStyles(defaultCode, defaultStyle) {
+    var _a;
+    var codeForSM = "".concat(defaultCode.substr(0, 12), "1").concat(defaultCode.substr(12 + 1));
+    var codeForEM = "".concat(defaultCode.substr(0, 13), "1").concat(defaultCode.substr(13 + 1));
+    return _a = {},
+        _a[defaultCode] = defaultStyle,
+        _a[codeForSM] = defaultStyle,
+        _a[codeForEM] = defaultStyle,
+        _a;
+}
+var getTempRTLAdaptedStyles = function (code) {
+    var dayStyles = (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, generateDayStyles('100110100000000', {
+        ':before': {
+            right: '0%',
+            left: '0%',
+        },
+    })), generateDayStyles('100100001001000', {
+        ':before': {
+            right: '50%',
+            left: '0%',
+        },
+    })), generateDayStyles('101000001010000', {
+        ':before': {
+            right: '50%',
+            left: '0%',
+        },
+    })), generateDayStyles('101110100000000', {
+        ':before': {
+            right: '50%',
+            left: '0%',
+        },
+    })), generateDayStyles('101111000000000', {
+        ':before': {
+            left: '50%',
+        },
+    })), generateDayStyles('100111000000000', {
+        ':before': {
+            left: '50%',
+        },
+    })), generateDayStyles('101000001001000', {
+        ':before': {
+            left: '50%',
+        },
+    })), generateDayStyles('100100001010000', {
+        ':before': {
+            left: '50%',
+        },
+    }));
+    return dayStyles[code] || {};
+};
 var getDayStyles = function (todaySOD) { return [
     'text-12 leading-8 w-9',
     function (_a, props) {
@@ -98,7 +126,7 @@ var getDayStyles = function (todaySOD) { return [
                 !$isHovered &&
                 !$hasRangeHighlighted && {
                 backgroundColor: 'transparent',
-            })), { backgroundColor: backgroundColor, height: '100%', top: 0 }), ':before': (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
+            })), { backgroundColor: backgroundColor, height: '100%', top: 0 }), ':before': (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
                 ? {
                     borderTopLeftRadius: '100%',
                     borderBottomLeftRadius: '100%',
@@ -108,7 +136,7 @@ var getDayStyles = function (todaySOD) { return [
                     borderTopRightRadius: '100%',
                     borderBottomRightRadius: '100%',
                 }
-                : {})), ($outsideMonth ? { backgroundColor: 'transparent' } : {})), ':first-child': (0, tslib_1.__assign)({}, ($range
+                : {})), ($outsideMonth ? { backgroundColor: 'transparent' } : {})), (getTempRTLAdaptedStyles(code)[':before'] || {})), ':first-child': (0, tslib_1.__assign)({}, ($range
                 ? {
                     ':before': (0, tslib_1.__assign)({}, getEdgeDayBeforeStyle(code, true, props.$peekNextMonth)),
                 }
@@ -119,11 +147,10 @@ var getDayStyles = function (todaySOD) { return [
                 : {})) }, (date_fns_adapter_1.default.isEqual($date, todaySOD) &&
             !$selected && {
             color: theme.spr.text04,
-        })), ($outsideMonth && { color: theme.spr.text03 }));
+        })), ($outsideMonth && { color: $selected ? theme.spr.text05 : theme.spr.text03 }));
     },
 ]; };
 exports.getDayStyles = getDayStyles;
-exports.StyledWeekdayHeader = (0, style_1.styled)('div', getWeekdayHeaderStyle);
 exports.StyledFooter = (0, style_1.styled)('div', 'flex px-4 py-3');
 exports.StyledFooterBeforeEnhancer = (0, style_1.styled)('div', 'flex-none');
 var getCalendarContainerStyles = function (_a) {

package/date-picker/types.d.ts

@@ -19,6 +19,7 @@ export declare type DateTimeSelectSharedProps = {
 export declare type DatepickerOverrides<T = SharedStyleProps> = {
     CalendarContainer?: Override<T>;
     CalendarHeader?: Override<T>;
+    Calendar?: Override<CalendarProps & Record<string, any>>;
     Day?: Override<T>;
     Input?: Override<T>;
     InputWrapper?: Override<T>;
@@ -43,7 +44,11 @@ export declare type DatepickerOverrides<T = SharedStyleProps> = {
     Footer?: Override<T>;
     DateTimeSelect?: Override<DateTimeSelectSharedProps>;
 };
+export declare type Nullable<T> = T | null | undefined;
 export declare type StatelessDatePickerProps = Omit<BaseDatepickerProps, 'timeSelectStart' | 'timeSelectEnd' | 'value' | 'onChange' | 'quickSelect' | 'quickSelectOptions' | 'size' | 'overrides' | 'onDayClick' | 'onDayMouseOver' | 'onDayMouseLeave' | 'onMonthChange' | 'onYearChange' | 'formatString' | 'peekNextMonth' | 'fixedHeight'> & {
+    id?: string;
+    showTimezone?: boolean;
+    timezone?: string;
     intent?: Intent;
     timeSelect?: boolean;
     onBlur?: () => void;
@@ -53,7 +58,8 @@ export declare type StatelessDatePickerProps = Omit<BaseDatepickerProps, 'timeSe
     variant?: InputVariant;
     value: Date | Date[] | undefined;
     onChange?: (data: {
-        value?: (Date | undefined)[] | Date | null;
+        value?: Nullable<Date>[] | Nullable<Date>;
+        timezone?: string;
     }) => any;
     size?: InputSize;
     overrides?: DatepickerOverrides;
@@ -75,8 +81,11 @@ export declare type StatefulContainerProps = {
     value?: Date;
     onChange?: (data: {
         value?: Date | undefined | null;
+        timezone?: string;
     }) => any;
     startOpen?: boolean;
+    showTimezone?: boolean;
+    timezone?: string;
 };
 export declare type DatePickerProps = Omit<StatelessDatePickerProps, 'value' | 'range'> & Omit<StatefulContainerProps, 'children'>;
 export declare type DatePickerSharedProps = SharedStylePropsT;

package/date-picker/utils.d.ts

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

package/date-picker/utils.js

@@ -10,7 +10,8 @@ var constants_1 = require("./constants");
 // replacing both hyphens and em-dashes with en-dashes
 var normalizeDashes = function (formatString) { return formatString.replace(/-/g, '–').replace(/—/g, '–'); };
 exports.normalizeDashes = normalizeDashes;
-var formatDate = function (params) {
+var formatDate = function (_a) {
+    var _b = _a.showTimezone, showTimezone = _b === void 0 ? false : _b, params = (0, tslib_1.__rest)(_a, ["showTimezone"]);
     var date = params.date;
     var formatString = params.formatString || (0, exports.normalizeDashes)(constants_1.DEFAULT_FORMAT_STRING);
     var dateHelpers = params.dateHelpers || new date_helpers_1.default(date_fns_adapter_1.default);
@@ -22,10 +23,14 @@ var formatDate = function (params) {
     if (Array.isArray(date) && !date[0] && !date[1]) {
         return '';
     }
+    var formattedDate;
     if (Array.isArray(date)) {
-        return date.map(function (day) { return format(day); }).join(' – ');
+        formattedDate = date.map(function (day) { return format(day); }).join(' – ');
     }
-    return format(date);
+    else {
+        formattedDate = format(date);
+    }
+    return "".concat(formattedDate).concat(params.timezone && showTimezone ? " | ".concat(params.timezone) : '');
 };
 exports.formatDate = formatDate;
 var getAriaLabel = function (value, formatDisplayValue, locale) {
@@ -64,7 +69,10 @@ var isTimeInRange = function (date, _a) {
         return true;
     }
     if (Array.isArray(date)) {
-        return date.every(function (_date) { return (!minDate || !dateHelpers.isBefore(_date, minDate)) && (!maxDate || !dateHelpers.isAfter(_date, maxDate)); });
+        return date.every(function (_date) {
+            return (!minDate || !_date || !dateHelpers.isBefore(_date, minDate)) &&
+                (!maxDate || !_date || !dateHelpers.isAfter(_date, maxDate));
+        });
     }
     return (!minDate || !dateHelpers.isBefore(date, minDate)) && (!maxDate || !dateHelpers.isAfter(date, maxDate));
 };

package/date-time/DateTime.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DateTimeProps } from './types';
+export declare const DateTime: ({ date, variant, dateTimeOptions }: DateTimeProps) => JSX.Element;

package/date-time/DateTime.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateTime = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+//hooks
+var useDateTime_1 = require("./useDateTime");
+var DateTime = function (_a) {
+    var date = _a.date, variant = _a.variant, dateTimeOptions = _a.dateTimeOptions;
+    var formattedDate = (0, useDateTime_1.useDateTime)({ date: date, variant: variant, dateTimeOptions: dateTimeOptions });
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: formattedDate }, void 0);
+};
+exports.DateTime = DateTime;

package/date-time/index.d.ts

@@ -0,0 +1,3 @@
+export { DateTime } from './DateTime';
+export { useDateTime } from './useDateTime';
+export * from './types';

package/date-time/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDateTime = exports.DateTime = void 0;
+var tslib_1 = require("tslib");
+var DateTime_1 = require("./DateTime");
+Object.defineProperty(exports, "DateTime", { enumerable: true, get: function () { return DateTime_1.DateTime; } });
+var useDateTime_1 = require("./useDateTime");
+Object.defineProperty(exports, "useDateTime", { enumerable: true, get: function () { return useDateTime_1.useDateTime; } });
+(0, tslib_1.__exportStar)(require("./types"), exports);

package/date-time/package.json

@@ -0,0 +1,4 @@
+{
+  "sideEffects": false,
+  "module": "../esm/date-time/index.js"
+}

package/date-time/types.d.ts

@@ -0,0 +1,21 @@
+import { ValueOf } from '../utility-types';
+export declare const DATE_TIME_VARIANTS: {
+    readonly SHORT_DATE: "shortDate";
+    readonly MEDIUM_DATE: "mediumDate";
+    readonly LONG_DATE: "longDate";
+    readonly FULL_DATE: "fullDate";
+    readonly SHORT_TIME: "shortTime";
+    readonly MEDIUM_TIME: "mediumTime";
+    readonly LONG_TIME: "longTime";
+    readonly FULL_TIME: "fullTime";
+    readonly SHORT_DATE_TIME: "shortDateTime";
+    readonly MEDIUM_DATE_TIME: "mediumDateTime";
+    readonly LONG_DATE_TIME: "longDateTime";
+    readonly FULL_DATE_TIME: "fullDateTime";
+    readonly CUSTOM: "custom";
+};
+export declare type DateTimeProps = {
+    date: Date | number;
+    variant: ValueOf<typeof DATE_TIME_VARIANTS>;
+    dateTimeOptions?: Intl.DateTimeFormatOptions;
+};

package/date-time/types.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DATE_TIME_VARIANTS = void 0;
+exports.DATE_TIME_VARIANTS = {
+    SHORT_DATE: 'shortDate',
+    MEDIUM_DATE: 'mediumDate',
+    LONG_DATE: 'longDate',
+    FULL_DATE: 'fullDate',
+    SHORT_TIME: 'shortTime',
+    MEDIUM_TIME: 'mediumTime',
+    LONG_TIME: 'longTime',
+    FULL_TIME: 'fullTime',
+    SHORT_DATE_TIME: 'shortDateTime',
+    MEDIUM_DATE_TIME: 'mediumDateTime',
+    LONG_DATE_TIME: 'longDateTime',
+    FULL_DATE_TIME: 'fullDateTime',
+    CUSTOM: 'custom',
+};

package/date-time/useDateTime.d.ts

@@ -0,0 +1,2 @@
+import { DateTimeProps } from './types';
+export declare const useDateTime: ({ date, variant, dateTimeOptions }: DateTimeProps) => string;

package/date-time/useDateTime.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDateTime = void 0;
+var tslib_1 = require("tslib");
+var locale_1 = require("../locale");
+var variants_1 = require("./variants");
+var useDateTime = function (_a) {
+    var date = _a.date, variant = _a.variant, dateTimeOptions = _a.dateTimeOptions;
+    var variantOptions = variants_1.VARIANTS_DATE_FORMAT_OPTIONS[variant];
+    var langCode = (0, locale_1.useLocale)().langCode;
+    return Intl.DateTimeFormat(langCode, (0, tslib_1.__assign)((0, tslib_1.__assign)({}, variantOptions), dateTimeOptions)).format(date);
+};
+exports.useDateTime = useDateTime;

package/date-time/variants.d.ts

@@ -0,0 +1,4 @@
+export declare const DEFAULT_VARIANT: "shortDate";
+export declare const VARIANTS_DATE_FORMAT_OPTIONS: {
+    [key: string]: Intl.DateTimeFormatOptions;
+};

package/date-time/variants.js

@@ -0,0 +1,87 @@
+"use strict";
+var _a;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VARIANTS_DATE_FORMAT_OPTIONS = exports.DEFAULT_VARIANT = void 0;
+var types_1 = require("./types");
+exports.DEFAULT_VARIANT = types_1.DATE_TIME_VARIANTS.SHORT_DATE; //dd/mm/yyyy in en_US
+exports.VARIANTS_DATE_FORMAT_OPTIONS = (_a = {},
+    _a[types_1.DATE_TIME_VARIANTS.SHORT_DATE] = { year: 'numeric', month: 'numeric', day: 'numeric' },
+    _a[types_1.DATE_TIME_VARIANTS.MEDIUM_DATE] = {
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.LONG_DATE] = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.FULL_DATE] = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        weekday: 'long',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.SHORT_TIME] = {
+        hour: 'numeric',
+        minute: 'numeric',
+        hour12: true,
+    },
+    _a[types_1.DATE_TIME_VARIANTS.MEDIUM_TIME] = {
+        hour: 'numeric',
+        minute: 'numeric',
+        second: 'numeric',
+        hour12: true,
+    },
+    _a[types_1.DATE_TIME_VARIANTS.LONG_TIME] = {
+        hour: 'numeric',
+        minute: 'numeric',
+        second: 'numeric',
+        hour12: false,
+        timeZoneName: 'short',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.FULL_TIME] = {
+        hour: 'numeric',
+        minute: 'numeric',
+        second: 'numeric',
+        hour12: false,
+        timeZoneName: 'long',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.SHORT_DATE_TIME] = {
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
+        hour: 'numeric',
+        minute: 'numeric',
+        hour12: true,
+    },
+    _a[types_1.DATE_TIME_VARIANTS.MEDIUM_DATE_TIME] = {
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+        hour: 'numeric',
+        minute: 'numeric',
+        hour12: true,
+    },
+    _a[types_1.DATE_TIME_VARIANTS.LONG_DATE_TIME] = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: 'numeric',
+        minute: 'numeric',
+        second: 'numeric',
+        hour12: true,
+        timeZoneName: 'short',
+    },
+    _a[types_1.DATE_TIME_VARIANTS.FULL_DATE_TIME] = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        weekday: 'long',
+        hour: 'numeric',
+        minute: 'numeric',
+        second: 'numeric',
+        hour12: false,
+        timeZoneName: 'long',
+    },
+    _a);

package/esm/allComponentsAndUtilities.d.ts

@@ -53,3 +53,4 @@ export * as Video from './video';
 export * as PaymentCard from './payment-card';
 export * as PhoneInput from './phone-input';
 export * as DateInput from './date-input';
+export * as Breadcrumb from './breadcrumb';

package/esm/allComponentsAndUtilities.js

@@ -102,3 +102,5 @@ import * as PhoneInput_1 from './phone-input';
 export { PhoneInput_1 as PhoneInput };
 import * as DateInput_1 from './date-input';
 export { DateInput_1 as DateInput };
+import * as Breadcrumb_1 from './breadcrumb';
+export { Breadcrumb_1 as Breadcrumb };

package/esm/asyncSelect/asyncSelect.d.ts

@@ -1,7 +1,9 @@
 /**
  *  Created by Aneree on 03/11/20.
  */
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { AsyncSelectProps } from './types';
-declare const AsyncSelect: (props: React.PropsWithChildren<AsyncSelectProps>) => ReactElement;
+declare const AsyncSelect: ({ loadOptions, initialOptions, resolveSelectedOptions, value, ...restProps }: AsyncSelectProps & {
+    children?: ReactNode;
+}) => ReactElement;
 export { AsyncSelect };