@tap-payments/os-micro-frontend-shared 0.1.178-test.1 → 0.1.179-test.1-test.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +12 -12
  3. package/build/components/LanguageDropdown/style.js +1 -1
  4. package/build/components/MenuItem/MenuItem.d.ts +2 -1
  5. package/build/components/MenuItem/MenuItem.js +2 -2
  6. package/build/components/RangeCalender/RangeCalender.d.ts +2 -2
  7. package/build/components/RangeCalender/RangeCalender.js +8 -17
  8. package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.d.ts +6 -2
  9. package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.js +27 -33
  10. package/build/components/RangeCalender/components/CustomTimepicker/style.d.ts +1 -1
  11. package/build/components/RangeCalender/components/RangeDatepicker/RangeDatepicker.d.ts +9 -1
  12. package/build/components/RangeCalender/components/RangeDatepicker/index.d.ts +0 -1
  13. package/build/components/RangeCalender/components/RangeDatepicker/index.js +0 -1
  14. package/build/components/RangeCalender/utils.d.ts +1 -5
  15. package/build/components/RangeCalender/utils.js +0 -11
  16. package/build/components/Timepicker/Timepicker.d.ts +1 -2
  17. package/build/components/Timepicker/Timepicker.js +2 -2
  18. package/build/components/Timepicker/index.d.ts +0 -1
  19. package/build/components/Timepicker/index.js +0 -1
  20. package/build/components/Timepicker/style.d.ts +0 -1
  21. package/build/components/Timepicker/style.js +1 -1
  22. package/package.json +2 -2
  23. package/build/components/RangeCalender/components/RangeDatepicker/type.d.ts +0 -9
  24. package/build/components/RangeCalender/components/RangeDatepicker/type.js +0 -1
package/LICENSE CHANGED
@@ -1,21 +1,21 @@
1
- MIT License
2
-
3
- Copyright (c) 2025 Tap Payments
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
1
+ MIT License
2
+
3
+ Copyright (c) 2025 Tap Payments
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,12 +1,12 @@
1
- # os-micro-frontend-shared
2
-
3
- ## Publishing Workflow
4
-
5
- 1. Update version in package.json
6
- 2. Commit changes
7
- 3. Create and push a tag:
8
-
9
- ```bash
10
- npm version patch # or minor, major
11
- git push origin main --tags
12
- ```
1
+ # os-micro-frontend-shared
2
+
3
+ ## Publishing Workflow
4
+
5
+ 1. Update version in package.json
6
+ 2. Commit changes
7
+ 3. Create and push a tag:
8
+
9
+ ```bash
10
+ npm version patch # or minor, major
11
+ git push origin main --tags
12
+ ```
@@ -1,5 +1,5 @@
1
1
  import Box from '@mui/material/Box';
2
2
  import { styled } from '@mui/material/styles';
3
- export const Button = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ backgroundColor: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, fontSize: '11px', color: theme.palette.text.primary, padding: '8px', borderRadius: '4px', display: 'flex', alignItems: 'center', height: 32, gap: '4px' }, (open && {
3
+ export const Button = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ backgroundColor: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, fontSize: '11px', color: theme.palette.text.primary, padding: '8px', borderRadius: '4px', display: 'flex', alignItems: 'center', height: 32, gap: '4px', cursor: 'pointer' }, (open && {
4
4
  borderColor: theme.palette.info.dark,
5
5
  }))));
@@ -4,7 +4,8 @@ interface MenuItemProps extends BoxProps {
4
4
  isSelected?: boolean;
5
5
  isDisabled?: boolean;
6
6
  isIndeterminate?: boolean;
7
+ hideCheckbox?: boolean;
7
8
  }
8
- declare function MenuItem({ isSelected, isDisabled, isIndeterminate, onClick, children, ...props }: MenuItemProps): import("react/jsx-runtime").JSX.Element;
9
+ declare function MenuItem({ isSelected, isDisabled, isIndeterminate, hideCheckbox, onClick, children, ...props }: MenuItemProps): import("react/jsx-runtime").JSX.Element;
9
10
  declare const _default: import("react").MemoExoticComponent<typeof MenuItem>;
10
11
  export default _default;
@@ -13,7 +13,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import { memo } from 'react';
14
14
  import { CheckboxStyled, MenuItemStyled } from './style';
15
15
  function MenuItem(_a) {
16
- var { isSelected, isDisabled, isIndeterminate, onClick, children } = _a, props = __rest(_a, ["isSelected", "isDisabled", "isIndeterminate", "onClick", "children"]);
17
- return (_jsxs(MenuItemStyled, Object.assign({ className: isDisabled ? 'disabled menu-item' : 'menu-item', onClick: onClick, disabled: isDisabled }, props, { children: [isSelected !== undefined && _jsx(CheckboxStyled, { size: "small", checked: isSelected, indeterminate: isIndeterminate, disabled: isDisabled }), children] })));
16
+ var { isSelected, isDisabled, isIndeterminate, hideCheckbox, onClick, children } = _a, props = __rest(_a, ["isSelected", "isDisabled", "isIndeterminate", "hideCheckbox", "onClick", "children"]);
17
+ return (_jsxs(MenuItemStyled, Object.assign({ className: isDisabled ? 'disabled menu-item' : 'menu-item', onClick: onClick, disabled: isDisabled }, props, { children: [!hideCheckbox && _jsx(CheckboxStyled, { size: "small", checked: isSelected, indeterminate: isIndeterminate, disabled: isDisabled }), children] })));
18
18
  }
19
19
  export default memo(MenuItem);
@@ -1,8 +1,8 @@
1
1
  import { MouseEvent } from 'react';
2
2
  import { PopperProps } from '@mui/material/Popper';
3
- import { SxProps } from '@mui/system';
4
3
  import type { CalenderMode, Timezone } from '../../types/index.js';
5
- import { RangeDatepickerProps } from './components/RangeDatepicker';
4
+ import { SxProps } from '@mui/system';
5
+ import { RangeDatepickerProps } from './components/RangeDatepicker/RangeDatepicker';
6
6
  interface RangeCalendarProps {
7
7
  defaultDate: [Date, Date];
8
8
  onDateChange: (date: [Date, Date], timezoneOffset?: number) => void;
@@ -13,10 +13,8 @@ import QuickFilters from './components/QuickFilters';
13
13
  import RangeDatePicker from './components/RangeDatepicker';
14
14
  import CustomTimezone from './components/Timezone';
15
15
  import { ButtonsWrapper, CalenderWrapper, CancelButton, FiltersArea, Footer, Main, OkayButton, SelectedDate, TimeZone, Settings } from './style';
16
- import CustomTimePicker from './components/CustomTimepicker';
17
- import { getDateRange, getEndOfDate, getStartOfDate } from './utils';
18
16
  function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalendarModeSwitch, numberOfMonths, noTimezone, noQuickFilter, maxDateRange, onCalendarGroupChange, groupBy, timezone, onChangeTimezoneHistory, onChangeTimezone, defaultTimezone, browserTimezone, renderCalendarButton, mainSx, popperProps, rangeDatePickerProps, }) {
19
- const [dates, setDates] = useState(getDateRange(defaultDate));
17
+ const [dates, setDates] = useState([new DateObject(defaultDate[0]), new DateObject(defaultDate[1])]);
20
18
  const [values, setValues] = useState(dates);
21
19
  const [selectedTimezone, setSelectedTimezone] = useState(timezone);
22
20
  const [selectedGroupBy, setSelectedGroupBy] = useState(groupBy || 'day');
@@ -37,7 +35,7 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
37
35
  if (!open) {
38
36
  if (numberOfMonths === 1)
39
37
  return;
40
- setValues([new DateObject(defaultDate === null || defaultDate === void 0 ? void 0 : defaultDate[0]), new DateObject(defaultDate === null || defaultDate === void 0 ? void 0 : defaultDate[1])]);
38
+ setValues([new DateObject(defaultDate[0]), new DateObject(defaultDate[1])]);
41
39
  }
42
40
  }, [open]);
43
41
  useEffect(() => {
@@ -47,20 +45,13 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
47
45
  onChangeTimezone === null || onChangeTimezone === void 0 ? void 0 : onChangeTimezone(newTimezone);
48
46
  onChangeTimezoneHistory === null || onChangeTimezoneHistory === void 0 ? void 0 : onChangeTimezoneHistory(newTimezone);
49
47
  };
50
- const formatDate = (date) => new Date(date.toDate().toLocaleString('en-us', {
48
+ const formatDate = (date) => new Date(date.setHour(new Date().getHours()).setMinute(new Date().getMinutes()).setSecond(new Date().getSeconds()).toDate().toLocaleString('en-us', {
51
49
  timeZone: selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone,
52
50
  }));
53
51
  const submitDate = () => {
54
52
  setDates(values);
55
53
  onCloseCalender();
56
- let newDates;
57
- if (values[0].dayOfYear === values[1].dayOfYear) {
58
- newDates = [formatDate(values[0]), formatDate(values[1])];
59
- }
60
- else {
61
- newDates = [formatDate(getStartOfDate(values[0])), formatDate(getEndOfDate(values[1]))];
62
- }
63
- onDateChange([newDates[0], newDates[1]], timezone === null || timezone === void 0 ? void 0 : timezone.offset);
54
+ onDateChange([formatDate(values[0]), formatDate(values[1] || values[0])], timezone === null || timezone === void 0 ? void 0 : timezone.offset);
64
55
  onCalendarGroupChange === null || onCalendarGroupChange === void 0 ? void 0 : onCalendarGroupChange(selectedGroupBy || 'day');
65
56
  updateTimezone(selectedTimezone);
66
57
  };
@@ -74,8 +65,8 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
74
65
  setValues(newDate);
75
66
  return;
76
67
  }
77
- const startDate = getStartOfDate(newDate[0]).toDate();
78
- const endDate = getEndOfDate(newDate[1]).toDate();
68
+ const startDate = newDate[0].toDate();
69
+ const endDate = newDate[1].toDate();
79
70
  const numberOfDays = dayjs(endDate).diff(startDate, 'day');
80
71
  if (numberOfDays <= maxDateRange) {
81
72
  setValues(newDate);
@@ -88,7 +79,7 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
88
79
  }, 3000);
89
80
  };
90
81
  const onChangeQuickFilter = (newValues) => {
91
- setValues([getStartOfDate(newValues[0]), getEndOfDate(newValues[1])]);
82
+ setValues(newValues);
92
83
  if (calendarRef.current)
93
84
  calendarRef.current.set({ date: newValues[0] });
94
85
  };
@@ -97,6 +88,6 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
97
88
  onCloseCalender();
98
89
  } })), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: "bottom-end" }, popperProps, { children: _jsxs(CalenderWrapper, { children: [!noQuickFilter && (_jsxs(FiltersArea, { children: [_jsx(QuickFilters, { onChange: onChangeQuickFilter, isHijri: isHijri }), _jsxs(Settings, { children: [groupBy && (_jsx(GroupBy, { groupBy: selectedGroupBy, isCalenderOpen: open, onUpdate: (group) => {
99
90
  setSelectedGroupBy(group);
100
- } })), _jsx(Hijri, { isHijri: isHijri, onCalendarModeSwitch: onCalendarModeSwitch })] })] })), _jsxs(Box, Object.assign({ sx: { display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } }, { children: [_jsx(RangeDatePicker, Object.assign({ values: values, onChange: onChange, isHijri: isHijri, ref: calendarRef, numberOfMonths: numberOfMonths }, rangeDatePickerProps)), _jsx(Collapse, Object.assign({ in: isError && Boolean(maxDateRange) }, { children: _jsx(Error, { error: t('dateRangeError', { number: maxDateRange }), sx: { marginInline: '16px', marginBottom: '16px' } }) })), _jsxs(Footer, Object.assign({ sx: { borderBottomLeftRadius: '8px' } }, { children: [!noTimezone ? (_jsx(TimeZone, { children: _jsx(CustomTimezone, { onChange: setSelectedTimezone, selectedTimezone: selectedTimezone, defaultTimezone: defaultTimezone, browserTimezone: browserTimezone }, String(open)) })) : (_jsx("div", {})), new DateObject(values[0]).dayOfYear === new DateObject(values[1]).dayOfYear && (_jsx(CustomTimePicker, { values: values, setValues: setValues })), _jsxs(ButtonsWrapper, { children: [_jsx(CancelButton, Object.assign({ variant: "contained", onClick: onCloseCalender }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ variant: "contained", onClick: submitDate }, { children: t('okay') }))] })] }))] }))] }) }))] })));
91
+ } })), _jsx(Hijri, { isHijri: isHijri, onCalendarModeSwitch: onCalendarModeSwitch })] })] })), _jsxs(Box, Object.assign({ sx: { display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } }, { children: [_jsx(RangeDatePicker, Object.assign({ values: values, onChange: onChange, isHijri: isHijri, ref: calendarRef, numberOfMonths: numberOfMonths }, rangeDatePickerProps)), _jsx(Collapse, Object.assign({ in: isError && Boolean(maxDateRange) }, { children: _jsx(Error, { error: t('dateRangeError', { number: maxDateRange }), sx: { marginInline: '16px', marginBottom: '16px' } }) })), _jsxs(Footer, Object.assign({ sx: { borderBottomLeftRadius: '8px' } }, { children: [!noTimezone ? (_jsx(TimeZone, { children: _jsx(CustomTimezone, { onChange: setSelectedTimezone, selectedTimezone: selectedTimezone, defaultTimezone: defaultTimezone, browserTimezone: browserTimezone }, String(open)) })) : (_jsx("div", {})), _jsxs(ButtonsWrapper, { children: [_jsx(CancelButton, Object.assign({ variant: "contained", onClick: onCloseCalender }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ variant: "contained", onClick: submitDate }, { children: t('okay') }))] })] }))] }))] }) }))] })));
101
92
  }
102
93
  export default RangeCalender;
@@ -1,7 +1,11 @@
1
+ import { DateObject } from 'react-multi-date-picker';
1
2
  import { Dates } from '../../type';
2
3
  interface CustomTimePickerProps {
3
4
  values: Dates;
4
- setValues: (values: Dates) => void;
5
+ startTime: DateObject;
6
+ endTime: DateObject;
7
+ onChangeStartTime: (value: DateObject) => void;
8
+ onChangeEndTime: (value: DateObject) => void;
5
9
  }
6
- declare function CustomTimePicker({ values, setValues }: CustomTimePickerProps): import("react/jsx-runtime").JSX.Element;
10
+ declare function CustomTimePicker({ values, onChangeStartTime, onChangeEndTime, startTime, endTime }: CustomTimePickerProps): import("react/jsx-runtime").JSX.Element;
7
11
  export default CustomTimePicker;
@@ -1,39 +1,33 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useState } from 'react';
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { useState, useEffect } from 'react';
3
3
  import { useTranslation } from 'react-i18next';
4
- import { DateObject } from 'react-multi-date-picker';
4
+ import DatePicker, { DateObject } from 'react-multi-date-picker';
5
+ import TimePicker from 'react-multi-date-picker/plugins/time_picker';
5
6
  import { IOSSwitch } from '../../../index.js';
6
- import TimePicker, { convertTo12Hour, maxHour } from '../../../Timepicker';
7
7
  import { AllDayStyled, TimeArea, TimePickerWrapper, TimeAreaInner } from './style';
8
- import { getEndOfDate, getStartOfDate } from '../../utils';
9
- function CustomTimePicker({ values, setValues }) {
8
+ function CustomTimePicker({ values, onChangeStartTime, onChangeEndTime, startTime, endTime }) {
9
+ const [isAllDay, setIsAllDay] = useState(false);
10
+ const [lastTime, setLastTime] = useState([startTime, endTime]);
10
11
  const { t } = useTranslation();
11
- const startDate = new DateObject(values[0]);
12
- const endDate = new DateObject(values[1]);
13
- const [isAllDay, setIsAllDay] = useState(startDate.dayOfYear === endDate.dayOfYear && startDate.hour === 0 && startDate.minute === 0 && endDate.hour === 23 && endDate.minute === 59);
14
- const formatHour = ({ period, hour }) => period === 'PM' && hour !== 12 ? hour + 12 : period === 'AM' && hour === 12 ? 0 : hour;
15
- const onChangeStartTime = ({ hour, minute, period }) => {
16
- setValues([startDate.setHour(formatHour({ hour, period })).setMinute(minute).setSecond(0), endDate]);
17
- };
18
- const onChangeEndTime = ({ hour, minute, period }) => {
19
- setValues([startDate, endDate.setHour(formatHour({ hour, period })).setMinute(minute).setSecond(0)]);
20
- };
21
- return (_jsx(TimeArea, { children: _jsxs(TimeAreaInner, { children: [_jsxs(AllDayStyled, Object.assign({ isAllDay: isAllDay }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: t('allDay') })), _jsx(IOSSwitch, { checked: isAllDay, onChange: (e) => {
22
- setIsAllDay(!isAllDay);
23
- if (e.target.checked) {
24
- setValues([getStartOfDate(values[0]), getEndOfDate(values[1])]);
25
- }
26
- else {
27
- setValues(values);
28
- }
29
- } })] })), !isAllDay && (_jsxs(TimePickerWrapper, { children: [_jsx(TimePicker, { defaultTime: {
30
- hour: convertTo12Hour(startDate.hour),
31
- minute: startDate.minute,
32
- period: startDate.hour >= maxHour ? 'PM' : 'AM',
33
- }, size: "small", onChange: onChangeStartTime, enableRealTimeChange: true }, `${values[0].toString()}-start`), _jsx(TimePicker, { defaultTime: {
34
- hour: convertTo12Hour(endDate.hour),
35
- minute: endDate.minute,
36
- period: endDate.hour >= maxHour ? 'PM' : 'AM',
37
- }, size: "small", onChange: onChangeEndTime, enableRealTimeChange: true }, `${values[1].toString()}-end`)] }))] }) }));
12
+ useEffect(() => {
13
+ if (isAllDay)
14
+ setIsAllDay(new DateObject(values[0]).dayOfYear === new DateObject(values[1]).dayOfYear);
15
+ }, [values]);
16
+ return (_jsx(_Fragment, { children: new DateObject(values[0]).dayOfYear === new DateObject(values[1]).dayOfYear && (_jsx(TimeArea, { children: _jsxs(TimeAreaInner, { children: [_jsxs(AllDayStyled, Object.assign({ isAllDay: isAllDay }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: t('allDay') })), _jsx(IOSSwitch, { checked: isAllDay, onChange: (e) => {
17
+ setIsAllDay(!isAllDay);
18
+ if (e.target.checked) {
19
+ setLastTime([startTime, endTime]);
20
+ onChangeStartTime(new DateObject().setHour(0).setMinute(0));
21
+ onChangeEndTime(new DateObject().setHour(23).setMinute(59));
22
+ }
23
+ else {
24
+ onChangeStartTime(lastTime[0]);
25
+ onChangeEndTime(lastTime[1]);
26
+ }
27
+ } })] })), !isAllDay && (_jsxs(TimePickerWrapper, { children: [_jsx(DatePicker, { arrow: false, disableDayPicker: true, hideOnScroll: true, format: "hh:mma", value: startTime, onChange: (time) => {
28
+ onChangeStartTime(time);
29
+ }, type: "button", plugins: [_jsx(TimePicker, { position: "top", hideSeconds: true })] }), _jsx(DatePicker, { arrow: false, disableDayPicker: true, hideOnScroll: true, format: "hh:mma", value: endTime, onChange: (time) => {
30
+ onChangeEndTime(time);
31
+ }, type: "button", plugins: [_jsx(TimePicker, { position: "top", hideSeconds: true })] })] }))] }) })) }));
38
32
  }
39
33
  export default CustomTimePicker;
@@ -2,7 +2,7 @@
2
2
  export declare const AllDayStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
3
3
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
4
  }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
5
- isAllDay?: boolean | undefined;
5
+ isAllDay: boolean;
6
6
  }, {}, {}>;
7
7
  export declare const TimeArea: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
8
8
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
@@ -1,4 +1,12 @@
1
1
  import React from 'react';
2
- import { RangeDatepickerProps } from './type';
2
+ import { CalendarProps } from 'react-multi-date-picker';
3
+ import { Dates } from '../../type';
4
+ export interface RangeDatepickerProps extends Omit<CalendarProps, 'onChange'> {
5
+ isAr?: boolean;
6
+ isHijri: boolean;
7
+ values: Dates;
8
+ onChange: (v: Dates) => void;
9
+ numberOfMonths?: number;
10
+ }
3
11
  declare const _default: React.ForwardRefExoticComponent<Omit<RangeDatepickerProps, "ref"> & React.RefAttributes<unknown>>;
4
12
  export default _default;
@@ -1,3 +1,2 @@
1
1
  import RangeDatepicker from './RangeDatepicker';
2
- export * from './type';
3
2
  export default RangeDatepicker;
@@ -1,3 +1,2 @@
1
1
  import RangeDatepicker from './RangeDatepicker';
2
- export * from './type';
3
2
  export default RangeDatepicker;
@@ -1,10 +1,6 @@
1
- import DateObject from 'react-date-object';
2
- import { Dates } from './type';
1
+ /// <reference types="react-date-object" />
3
2
  export declare const getLocale: ({ isHijri, isAr }: {
4
3
  isHijri: boolean;
5
4
  isAr?: boolean | undefined;
6
5
  }) => import("react-date-object").Locale;
7
6
  export declare const getCalender: (isHijri: boolean) => import("react-date-object").Calendar;
8
- export declare const getStartOfDate: (date: DateObject) => DateObject;
9
- export declare const getEndOfDate: (date: DateObject) => DateObject;
10
- export declare const getDateRange: (dates: [Date, Date]) => Dates;
@@ -1,11 +1,9 @@
1
- import DateObject from 'react-date-object';
2
1
  import arabic from 'react-date-object/calendars/arabic';
3
2
  import gregorian from 'react-date-object/calendars/gregorian';
4
3
  import arabicAr from 'react-date-object/locales/arabic_ar';
5
4
  import arabicEn from 'react-date-object/locales/arabic_en';
6
5
  import gregorianAr from 'react-date-object/locales/gregorian_ar';
7
6
  import gregorianEn from 'react-date-object/locales/gregorian_en';
8
- import { getDefaultDateRange } from '../../utils/index.js';
9
7
  export const getLocale = ({ isHijri, isAr = false }) => {
10
8
  if (isHijri) {
11
9
  return isAr ? arabicAr : arabicEn;
@@ -15,12 +13,3 @@ export const getLocale = ({ isHijri, isAr = false }) => {
15
13
  export const getCalender = (isHijri) => {
16
14
  return isHijri ? arabic : gregorian;
17
15
  };
18
- export const getStartOfDate = (date) => date.setHour(0).setMinute(0).setSecond(0);
19
- export const getEndOfDate = (date) => date.setHour(23).setMinute(59).setSecond(59);
20
- export const getDateRange = (dates) => {
21
- if (!((dates === null || dates === void 0 ? void 0 : dates[0]) instanceof Date) || !((dates === null || dates === void 0 ? void 0 : dates[1]) instanceof Date)) {
22
- const [startDate, endDate] = getDefaultDateRange();
23
- return [new DateObject(startDate), new DateObject(endDate)];
24
- }
25
- return [new DateObject(dates === null || dates === void 0 ? void 0 : dates[0]), new DateObject(dates === null || dates === void 0 ? void 0 : dates[1])];
26
- };
@@ -7,7 +7,6 @@ interface TimePickerProps {
7
7
  defaultTime?: Time;
8
8
  onChange?: (time: Time) => void;
9
9
  enableRealTimeChange?: boolean;
10
- size?: 'large' | 'small';
11
10
  }
12
- export declare function TimePicker({ onChange, defaultTime, enableRealTimeChange, size }: TimePickerProps): import("react/jsx-runtime").JSX.Element;
11
+ export declare function TimePicker({ onChange, defaultTime, enableRealTimeChange }: TimePickerProps): import("react/jsx-runtime").JSX.Element;
13
12
  export {};
@@ -8,7 +8,7 @@ import { greyUpArrowIcon, greyDownArrowIcon } from '../../constants/index.js';
8
8
  import { Arrow, Button, Period, PeriodWrapper, Wrapper, Time, TimeWrapper, Input } from './style';
9
9
  import { getDefaultHour, getDefaultMinute } from './utils';
10
10
  import { maxHour, maxMinute, periodList } from './constant';
11
- export function TimePicker({ onChange, defaultTime, enableRealTimeChange, size = 'large' }) {
11
+ export function TimePicker({ onChange, defaultTime, enableRealTimeChange }) {
12
12
  var _a, _b, _c;
13
13
  const [anchorEl, setAnchorEl] = useState(null);
14
14
  const [period, setPeriod] = useState((_a = defaultTime === null || defaultTime === void 0 ? void 0 : defaultTime.period) !== null && _a !== void 0 ? _a : (new Date().getHours() >= maxHour ? 'PM' : 'AM'));
@@ -80,7 +80,7 @@ export function TimePicker({ onChange, defaultTime, enableRealTimeChange, size =
80
80
  });
81
81
  };
82
82
  const formatTime = useCallback((time) => (time < 10 ? `0${time}` : time), []);
83
- return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onClose }, { children: _jsxs(Box, { children: [_jsx(Button, Object.assign({ size: size, open: open, onClick: onOpen }, { children: `${formatTime(hours)}:${formatTime(minutes)}${period.toLowerCase()}` })), _jsx(Menu, Object.assign({ open: open, anchorEl: anchorEl, placement: "top-start", sx: { marginTop: '8px', marginBottom: '8px' } }, { children: _jsxs(Wrapper, { children: [_jsxs(TimeWrapper, { children: [_jsxs(Time, { children: [_jsx(Arrow, Object.assign({ onClick: onIncreaseHours }, { children: _jsx("img", { src: greyUpArrowIcon, alt: "arrow" }) })), _jsx(Input, { value: formatTime(hours), onChange: onChangeHours }), _jsx(Arrow, Object.assign({ onClick: onDecreaseHours }, { children: _jsx("img", { src: greyDownArrowIcon, alt: "arrow" }) }))] }), _jsx(Text, { children: ":" }), _jsxs(Time, { children: [_jsx(Arrow, Object.assign({ onClick: onIncreaseMinutes }, { children: _jsx("img", { src: greyUpArrowIcon, alt: "arrow" }) })), _jsx(Input, { value: formatTime(minutes), onChange: onChangeMinutes }), _jsx(Arrow, Object.assign({ onClick: onDecreaseMinutes }, { children: _jsx("img", { src: greyDownArrowIcon, alt: "arrow" }) }))] })] }), _jsx(PeriodWrapper, { children: periodList.map((item) => (_jsx(Period, Object.assign({ onClick: () => {
83
+ return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onClose }, { children: _jsxs(Box, { children: [_jsx(Button, Object.assign({ open: open, onClick: onOpen }, { children: `${formatTime(hours)}:${formatTime(minutes)}${period.toLowerCase()}` })), _jsx(Menu, Object.assign({ open: open, anchorEl: anchorEl, placement: "top-start", sx: { marginTop: '8px', marginBottom: '8px' } }, { children: _jsxs(Wrapper, { children: [_jsxs(TimeWrapper, { children: [_jsxs(Time, { children: [_jsx(Arrow, Object.assign({ onClick: onIncreaseHours }, { children: _jsx("img", { src: greyUpArrowIcon, alt: "arrow" }) })), _jsx(Input, { value: formatTime(hours), onChange: onChangeHours }), _jsx(Arrow, Object.assign({ onClick: onDecreaseHours }, { children: _jsx("img", { src: greyDownArrowIcon, alt: "arrow" }) }))] }), _jsx(Text, { children: ":" }), _jsxs(Time, { children: [_jsx(Arrow, Object.assign({ onClick: onIncreaseMinutes }, { children: _jsx("img", { src: greyUpArrowIcon, alt: "arrow" }) })), _jsx(Input, { value: formatTime(minutes), onChange: onChangeMinutes }), _jsx(Arrow, Object.assign({ onClick: onDecreaseMinutes }, { children: _jsx("img", { src: greyDownArrowIcon, alt: "arrow" }) }))] })] }), _jsx(PeriodWrapper, { children: periodList.map((item) => (_jsx(Period, Object.assign({ onClick: () => {
84
84
  onClickPeriod(item);
85
85
  }, selected: period === item }, { children: item }), item))) })] }) }))] }) })));
86
86
  }
@@ -1,5 +1,4 @@
1
1
  import { TimePicker } from './Timepicker';
2
2
  export * from './utils';
3
3
  export * from './Timepicker';
4
- export * from './constant';
5
4
  export default TimePicker;
@@ -1,5 +1,4 @@
1
1
  import { TimePicker } from './Timepicker';
2
2
  export * from './utils';
3
3
  export * from './Timepicker';
4
- export * from './constant';
5
4
  export default TimePicker;
@@ -8,7 +8,6 @@ export declare const Button: import("@emotion/styled").StyledComponent<import("@
8
8
  component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
9
9
  } & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
10
10
  open: boolean;
11
- size: 'large' | 'small';
12
11
  }, {}, {}>;
13
12
  export declare const Arrow: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
14
13
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
@@ -10,7 +10,7 @@ export const Wrapper = styled(Box)(() => ({
10
10
  justifyContent: 'center',
11
11
  gap: '16px',
12
12
  }));
13
- export const Button = styled(Text, { shouldForwardProp: (props) => props !== 'open' && props !== 'size' })(({ theme, open, size }) => (Object.assign({ fontSize: '11px', fontWeight: 500, background: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, borderRadius: '19px', height: size === 'large' ? 32 : 24, width: size === 'large' ? 74 : 58, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' }, (open && { boxShadow: '0px 0px 4px 0px #1F88D080', borderColor: theme.palette.info.dark }))));
13
+ export const Button = styled(Text, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ fontSize: '11px', fontWeight: 500, background: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, borderRadius: '19px', height: 32, width: 74, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' }, (open && { boxShadow: '0px 0px 4px 0px #1F88D080', borderColor: theme.palette.info.dark }))));
14
14
  export const Arrow = styled(Box)(() => ({
15
15
  textAlign: 'center',
16
16
  cursor: 'pointer',
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@tap-payments/os-micro-frontend-shared",
3
3
  "description": "Shared components and utilities for Tap Payments micro frontends",
4
- "version": "0.1.178-test.1",
5
- "testVersion": 1,
4
+ "version": "0.1.179-test.1-test.2",
5
+ "testVersion": 2,
6
6
  "type": "module",
7
7
  "main": "build/index.js",
8
8
  "module": "build/index.js",
@@ -1,9 +0,0 @@
1
- import { CalendarProps } from 'react-multi-date-picker';
2
- import { Dates } from '../../type';
3
- export interface RangeDatepickerProps extends Omit<CalendarProps, 'onChange'> {
4
- isAr?: boolean;
5
- isHijri: boolean;
6
- values: Dates;
7
- onChange: (v: Dates) => void;
8
- numberOfMonths?: number;
9
- }