@tap-payments/os-micro-frontend-shared 0.0.89 → 0.0.90

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 (68) hide show
  1. package/build/components/StatusBar/StatusBar.d.ts +12 -0
  2. package/build/components/StatusBar/StatusBar.js +32 -0
  3. package/build/components/StatusBar/index.d.ts +2 -0
  4. package/build/components/StatusBar/index.js +2 -0
  5. package/build/components/TableCells/CustomCells/ActionCell/constant.d.ts +0 -3
  6. package/build/components/TableCells/CustomCells/ActionCell/constant.js +1 -4
  7. package/build/components/TableCells/CustomCells/ActionCell/hooks/useActionCell.d.ts +1 -1
  8. package/build/components/TableCells/CustomCells/ActionCell/style.d.ts +1 -1
  9. package/build/components/VirtualTable/SheetView/SheetViewVirtualTable.js +1 -3
  10. package/build/components/VirtualTable/SheetView/style.js +0 -1
  11. package/build/components/VirtualTable/components/virtualScroll/ListItemWrapper.js +7 -2
  12. package/build/components/VirtualTable/style.d.ts +0 -1
  13. package/build/components/VirtualTable/style.js +2 -20
  14. package/build/components/index.d.ts +1 -1
  15. package/build/components/index.js +1 -1
  16. package/build/constants/assets.d.ts +0 -2
  17. package/build/constants/assets.js +0 -2
  18. package/package.json +4 -1
  19. package/build/components/RangeCalender/RangeCalender.d.ts +0 -20
  20. package/build/components/RangeCalender/RangeCalender.js +0 -92
  21. package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.d.ts +0 -11
  22. package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.js +0 -33
  23. package/build/components/RangeCalender/components/CustomTimepicker/index.d.ts +0 -2
  24. package/build/components/RangeCalender/components/CustomTimepicker/index.js +0 -2
  25. package/build/components/RangeCalender/components/CustomTimepicker/style.d.ts +0 -15
  26. package/build/components/RangeCalender/components/CustomTimepicker/style.js +0 -132
  27. package/build/components/RangeCalender/components/GroupBy/GroupBy.d.ts +0 -10
  28. package/build/components/RangeCalender/components/GroupBy/GroupBy.js +0 -33
  29. package/build/components/RangeCalender/components/GroupBy/index.d.ts +0 -2
  30. package/build/components/RangeCalender/components/GroupBy/index.js +0 -2
  31. package/build/components/RangeCalender/components/GroupBy/style.d.ts +0 -15
  32. package/build/components/RangeCalender/components/GroupBy/style.js +0 -39
  33. package/build/components/RangeCalender/components/Hijri/Hijri.d.ts +0 -7
  34. package/build/components/RangeCalender/components/Hijri/Hijri.js +0 -13
  35. package/build/components/RangeCalender/components/Hijri/index.d.ts +0 -2
  36. package/build/components/RangeCalender/components/Hijri/index.js +0 -2
  37. package/build/components/RangeCalender/components/Hijri/style.d.ts +0 -4
  38. package/build/components/RangeCalender/components/Hijri/style.js +0 -25
  39. package/build/components/RangeCalender/components/QuickFilters/QuickFilters.d.ts +0 -8
  40. package/build/components/RangeCalender/components/QuickFilters/QuickFilters.js +0 -47
  41. package/build/components/RangeCalender/components/QuickFilters/index.d.ts +0 -2
  42. package/build/components/RangeCalender/components/QuickFilters/index.js +0 -2
  43. package/build/components/RangeCalender/components/QuickFilters/style.d.ts +0 -7
  44. package/build/components/RangeCalender/components/QuickFilters/style.js +0 -27
  45. package/build/components/RangeCalender/components/RangeDatepicker/RangeDatepicker.d.ts +0 -12
  46. package/build/components/RangeCalender/components/RangeDatepicker/RangeDatepicker.js +0 -29
  47. package/build/components/RangeCalender/components/RangeDatepicker/index.d.ts +0 -2
  48. package/build/components/RangeCalender/components/RangeDatepicker/index.js +0 -2
  49. package/build/components/RangeCalender/components/RangeDatepicker/style.d.ts +0 -4
  50. package/build/components/RangeCalender/components/RangeDatepicker/style.js +0 -9
  51. package/build/components/RangeCalender/components/Timezone/Timezone.d.ts +0 -11
  52. package/build/components/RangeCalender/components/Timezone/Timezone.js +0 -32
  53. package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.d.ts +0 -12
  54. package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.js +0 -37
  55. package/build/components/RangeCalender/components/Timezone/components/UserTimezone.d.ts +0 -8
  56. package/build/components/RangeCalender/components/Timezone/components/UserTimezone.js +0 -14
  57. package/build/components/RangeCalender/components/Timezone/index.d.ts +0 -2
  58. package/build/components/RangeCalender/components/Timezone/index.js +0 -2
  59. package/build/components/RangeCalender/components/Timezone/style.d.ts +0 -21
  60. package/build/components/RangeCalender/components/Timezone/style.js +0 -61
  61. package/build/components/RangeCalender/index.d.ts +0 -2
  62. package/build/components/RangeCalender/index.js +0 -2
  63. package/build/components/RangeCalender/style.d.ts +0 -33
  64. package/build/components/RangeCalender/style.js +0 -189
  65. package/build/components/RangeCalender/type.d.ts +0 -2
  66. package/build/components/RangeCalender/type.js +0 -1
  67. package/build/components/RangeCalender/utils.d.ts +0 -6
  68. package/build/components/RangeCalender/utils.js +0 -15
@@ -1,33 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { memo, useState } from 'react';
3
- import Box from '@mui/material/Box';
4
- import ClickAwayListener from '@mui/material/ClickAwayListener';
5
- import Popper from '@mui/material/Popper';
6
- import { useTranslation } from 'react-i18next';
7
- import { blackHeadingDownArrow } from '../../../../constants/index.js';
8
- import { GroupByLabel, GroupByDropdownButton, GroupByDropdown, Option } from './style';
9
- const groupByLabel = {
10
- day: 'Day',
11
- month: 'Month',
12
- quarter: 'Quarter',
13
- year: 'Year',
14
- };
15
- function GroupBy({ sx, groupBy, isCalenderOpen, onUpdate }) {
16
- const [anchorEl, setAnchorEl] = useState(null);
17
- const open = Boolean(anchorEl) && isCalenderOpen;
18
- const { t } = useTranslation();
19
- const onClose = () => {
20
- setAnchorEl(null);
21
- };
22
- const onOpen = (e) => {
23
- setAnchorEl(e.currentTarget);
24
- };
25
- const onSelect = (value) => {
26
- onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(value);
27
- onClose();
28
- };
29
- return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onClose }, { children: _jsxs(Box, Object.assign({ sx: sx }, { children: [_jsx(GroupByLabel, { children: t('groupedBy') }), _jsxs(GroupByDropdownButton, Object.assign({ onClick: onOpen, open: open }, { children: [_jsx("span", { children: groupByLabel[groupBy] }), _jsx(Box, { component: "img", src: blackHeadingDownArrow, alt: "arrow", sx: Object.assign({}, (open && { transform: 'rotate(180deg)' })) })] })), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, sx: { zIndex: 3 } }, { children: _jsx(GroupByDropdown, Object.assign({ sx: { width: anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.clientWidth } }, { children: Object.entries(groupByLabel).map(([key, value]) => (_jsx(Option, Object.assign({ onClick: () => {
30
- onSelect(key);
31
- }, className: groupBy === key ? 'active' : '' }, { children: value }), `${key}-groupedBy`))) })) }))] })) })));
32
- }
33
- export default memo(GroupBy);
@@ -1,2 +0,0 @@
1
- import GroupBy from './GroupBy';
2
- export default GroupBy;
@@ -1,2 +0,0 @@
1
- import GroupBy from './GroupBy';
2
- export default GroupBy;
@@ -1,15 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const GroupByLabel: 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
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
5
- export declare const GroupByDropdownButton: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
8
- open: boolean;
9
- }, {}, {}>;
10
- export declare const GroupByDropdown: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
11
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
12
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
13
- export declare const Option: 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
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
15
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -1,39 +0,0 @@
1
- import Box from '@mui/material/Box';
2
- import { styled } from '@mui/material/styles';
3
- export const GroupByLabel = styled(Box)(({ theme }) => ({
4
- color: theme.palette.grey[700],
5
- fontSize: '9px',
6
- fontWeight: 500,
7
- marginBottom: '6px',
8
- }));
9
- export const GroupByDropdownButton = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ borderRadius: '4px', border: `1px solid ${theme.palette.divider}`, background: theme.palette.common.white, height: 32, padding: '8px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', cursor: 'pointer' }, (open && {
10
- border: `1px solid ${theme.palette.info.dark}`,
11
- background: theme.palette.common.white,
12
- boxShadow: theme.shadows[7],
13
- }))));
14
- export const GroupByDropdown = styled(Box)(({ theme }) => ({
15
- borderRadius: '8px',
16
- background: theme.palette.common.white,
17
- boxShadow: '0px 8px 36px 0px rgba(0, 0, 0, 0.15)',
18
- textAlign: 'center',
19
- color: theme.palette.grey[900],
20
- fontSize: '12px',
21
- fontWeight: 500,
22
- lineHeight: '20px',
23
- letterSpacing: '0.1px',
24
- padding: '16px',
25
- display: 'flex',
26
- alignItems: 'center',
27
- justifyContent: 'center',
28
- gap: '12px',
29
- flexDirection: 'column',
30
- }));
31
- export const Option = styled(Box)(({ theme }) => ({
32
- width: 71,
33
- padding: '4px 0',
34
- cursor: 'pointer',
35
- '&:hover, &.active': {
36
- borderRadius: '100px',
37
- background: theme.palette.info.light,
38
- },
39
- }));
@@ -1,7 +0,0 @@
1
- import type { CalenderMode } from '../../../../types/index.js';
2
- interface CalenderSettingsProps {
3
- isHijri: boolean;
4
- onCalendarModeSwitch?: (mode: CalenderMode) => void;
5
- }
6
- export default function Hijri({ isHijri, onCalendarModeSwitch }: CalenderSettingsProps): import("react/jsx-runtime").JSX.Element;
7
- export {};
@@ -1,13 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import Box from '@mui/material/Box';
3
- import { useTranslation } from 'react-i18next';
4
- import { IOSSwitch } from '../../../index.js';
5
- import { hijriIcon } from '../../../../constants/index.js';
6
- import { CalenderSetting } from './style';
7
- export default function Hijri({ isHijri, onCalendarModeSwitch }) {
8
- const { t } = useTranslation();
9
- const onChange = () => {
10
- onCalendarModeSwitch === null || onCalendarModeSwitch === void 0 ? void 0 : onCalendarModeSwitch(isHijri ? 'gregorian' : 'hijri');
11
- };
12
- return (_jsx(Box, { children: _jsxs(CalenderSetting, { children: [_jsxs(Box, { children: [_jsx("img", { src: hijriIcon, alt: "hijri" }), _jsx("span", { children: t('hijri') })] }), _jsx(IOSSwitch, { checked: isHijri, onChange: onChange })] }) }));
13
- }
@@ -1,2 +0,0 @@
1
- import CalenderSettings from './Hijri';
2
- export default CalenderSettings;
@@ -1,2 +0,0 @@
1
- import CalenderSettings from './Hijri';
2
- export default CalenderSettings;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const CalenderSetting: 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
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -1,25 +0,0 @@
1
- import Box from '@mui/material/Box';
2
- import { styled } from '@mui/material/styles';
3
- export const CalenderSetting = styled(Box)(({ theme }) => ({
4
- border: '1px solid',
5
- borderColor: theme.palette.divider,
6
- borderRadius: '50px',
7
- paddingInline: '6px 12px',
8
- color: theme.palette.text.primary,
9
- fontSize: '11px',
10
- display: 'flex',
11
- gap: '8px',
12
- alignItems: 'center',
13
- justifyContent: 'space-between',
14
- height: 32,
15
- marginTop: '8px',
16
- img: {
17
- width: 16,
18
- height: 16,
19
- },
20
- '& > div': {
21
- display: 'flex',
22
- alignItems: 'center',
23
- gap: '2px',
24
- },
25
- }));
@@ -1,8 +0,0 @@
1
- import { DateObject } from 'react-multi-date-picker';
2
- interface QuickFiltersProps {
3
- onChange: (dates: [DateObject, DateObject]) => void;
4
- isHijri: boolean;
5
- isAr?: boolean;
6
- }
7
- export default function QuickFilters({ onChange, isHijri, isAr }: QuickFiltersProps): import("react/jsx-runtime").JSX.Element;
8
- export {};
@@ -1,47 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useMemo } from 'react';
3
- import Box from '@mui/material/Box';
4
- import { useTranslation } from 'react-i18next';
5
- import { DateObject } from 'react-multi-date-picker';
6
- import { CustomLabel, FiltersWrapper } from './style';
7
- import { getCalender, getLocale } from '../../utils';
8
- export default function QuickFilters({ onChange, isHijri, isAr = false }) {
9
- const calenderSettings = { locale: getLocale({ isHijri, isAr }), calendar: getCalender(isHijri) };
10
- const filterList = useMemo(() => [
11
- { id: 'today', value: [new DateObject(calenderSettings), new DateObject(calenderSettings)] },
12
- {
13
- id: 'lastWeek',
14
- value: [new DateObject(calenderSettings).subtract(7, 'day'), new DateObject(calenderSettings)],
15
- },
16
- {
17
- id: 'lastMonth',
18
- value: [new DateObject(calenderSettings).subtract(30, 'day'), new DateObject(calenderSettings)],
19
- },
20
- {
21
- id: new DateObject(calenderSettings).subtract(1, 'month').toFirstOfMonth().format('MMMM YYYY'),
22
- value: [
23
- new DateObject(calenderSettings).subtract(1, 'month').toFirstOfMonth(),
24
- new DateObject(calenderSettings).subtract(1, 'month').toLastOfMonth(),
25
- ],
26
- },
27
- {
28
- id: new DateObject(calenderSettings).subtract(2, 'month').toFirstOfMonth().format('MMMM YYYY'),
29
- value: [
30
- new DateObject(calenderSettings).subtract(2, 'month').toFirstOfMonth(),
31
- new DateObject(calenderSettings).subtract(2, 'month').toLastOfMonth(),
32
- ],
33
- },
34
- {
35
- id: new DateObject(calenderSettings).subtract(3, 'month').toFirstOfMonth().format('MMMM YYYY'),
36
- value: [
37
- new DateObject(calenderSettings).subtract(3, 'month').toFirstOfMonth(),
38
- new DateObject(calenderSettings).subtract(3, 'month').toLastOfMonth(),
39
- ],
40
- },
41
- ], [isHijri, isAr]);
42
- const { t } = useTranslation();
43
- return (_jsx(Box, Object.assign({ "data-testid": "RangeCalender_QuickFilters" }, { children: _jsx(FiltersWrapper, { children: filterList.map((item) => (_jsx(CustomLabel, Object.assign({ onClick: (e) => {
44
- e.preventDefault();
45
- onChange(item.value);
46
- } }, { children: t(item.id) }), item.id))) }) })));
47
- }
@@ -1,2 +0,0 @@
1
- import QuickFilters from './QuickFilters';
2
- export default QuickFilters;
@@ -1,2 +0,0 @@
1
- import QuickFilters from './QuickFilters';
2
- export default QuickFilters;
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const CustomLabel: import("@emotion/styled").StyledComponent<import("@mui/material/Button").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
3
- ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
4
- }, "disabled" | "className" | "style" | "classes" | "color" | "children" | "sx" | "tabIndex" | "size" | "variant" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
5
- export declare const FiltersWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -1,27 +0,0 @@
1
- import Box from '@mui/material/Box';
2
- import Button from '@mui/material/Button';
3
- import { styled } from '@mui/material/styles';
4
- export const CustomLabel = styled(Button)(({ theme }) => ({
5
- cursor: 'pointer',
6
- borderRadius: '50px',
7
- border: '1px solid',
8
- borderColor: theme.palette.divider,
9
- background: theme.palette.common.white,
10
- color: theme.palette.text.primary,
11
- fontSize: '11px',
12
- fontWeight: theme.typography.fontWeightRegular,
13
- paddingInline: '12px',
14
- height: 32,
15
- width: 'max-content',
16
- textTransform: 'unset',
17
- '&:hover': {
18
- boxShadow: theme.shadows[7],
19
- border: '1px solid',
20
- borderColor: theme.palette.info.dark,
21
- },
22
- }));
23
- export const FiltersWrapper = styled(Box)(() => ({
24
- display: 'flex',
25
- flexDirection: 'column',
26
- gap: '8px',
27
- }));
@@ -1,12 +0,0 @@
1
- import React from 'react';
2
- import { CalendarProps } from 'react-multi-date-picker';
3
- import { Dates } from '../../type';
4
- interface RangeDatepickerProps extends Omit<CalendarProps, 'onChange'> {
5
- isAr?: boolean;
6
- isHijri: boolean;
7
- values: Dates;
8
- onChange: (v: Dates) => void;
9
- numberOfMonths?: number;
10
- }
11
- declare const _default: React.ForwardRefExoticComponent<Omit<RangeDatepickerProps, "ref"> & React.RefAttributes<unknown>>;
12
- export default _default;
@@ -1,29 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import { jsx as _jsx } from "react/jsx-runtime";
13
- import { forwardRef } from 'react';
14
- import { Calendar } from 'react-multi-date-picker';
15
- import { darkLeftArrowIcon, darkRightArrowIcon } from '../../../../constants/index.js';
16
- import { ArrowButton } from './style';
17
- import { getLocale, getCalender } from '../../utils';
18
- const weekDays = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
19
- function RangeDatepicker(_a, ref) {
20
- var { isAr = false, isHijri, values, onChange, numberOfMonths = 2 } = _a, props = __rest(_a, ["isAr", "isHijri", "values", "onChange", "numberOfMonths"]);
21
- const getArrow = (direction) => {
22
- if (direction === 'right') {
23
- return isAr ? darkLeftArrowIcon : darkRightArrowIcon;
24
- }
25
- return isAr ? darkRightArrowIcon : darkLeftArrowIcon;
26
- };
27
- return (_jsx(Calendar, Object.assign({ ref: ref, numberOfMonths: numberOfMonths, value: values, onChange: onChange, calendar: getCalender(isHijri), locale: getLocale({ isHijri, isAr }), range: true, format: "MMM DD", monthYearSeparator: ' ', renderButton: (direction, handleClick) => (_jsx(ArrowButton, Object.assign({ onClick: handleClick }, { children: _jsx("img", { src: getArrow(direction), alt: "arrow" }) }))), weekDays: !isAr ? weekDays : undefined, maxDate: new Date() }, props)));
28
- }
29
- export default forwardRef(RangeDatepicker);
@@ -1,2 +0,0 @@
1
- import RangeDatepicker from './RangeDatepicker';
2
- export default RangeDatepicker;
@@ -1,2 +0,0 @@
1
- import RangeDatepicker from './RangeDatepicker';
2
- export default RangeDatepicker;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const ArrowButton: import("@emotion/styled").StyledComponent<import("@mui/material/Button").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
3
- ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
4
- }, "disabled" | "className" | "style" | "classes" | "color" | "children" | "sx" | "tabIndex" | "size" | "variant" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -1,9 +0,0 @@
1
- import Button from '@mui/material/Button';
2
- import { styled } from '@mui/material/styles';
3
- export const ArrowButton = styled(Button)(() => ({
4
- minWidth: 'auto',
5
- padding: 0,
6
- '& > img': {
7
- cursor: 'pointer',
8
- },
9
- }));
@@ -1,11 +0,0 @@
1
- /// <reference types="react" />
2
- import type { Timezone } from '../../../../types/index.js';
3
- interface CustomTimezoneProps {
4
- onChange: (timezone: Timezone) => void;
5
- selectedTimezone: Timezone | null;
6
- defaultTimezone: Timezone;
7
- browserTimezone: string;
8
- }
9
- declare function CustomTimezone({ onChange, selectedTimezone, defaultTimezone, browserTimezone }: CustomTimezoneProps): import("react/jsx-runtime").JSX.Element;
10
- declare const _default: import("react").MemoExoticComponent<typeof CustomTimezone>;
11
- export default _default;
@@ -1,32 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useState, useMemo, memo } from 'react';
3
- import ClickAwayListener from '@mui/material/ClickAwayListener';
4
- import Popper from '@mui/material/Popper';
5
- import { entityTimezoneIcon, savedTimezoneIcon, userTimezoneIcon } from '../../../../constants/index.js';
6
- import { CountryFlag } from '../../../index.js';
7
- import { TimezoneWrapper, TimezoneDropdown, SelectedTimezone } from './style';
8
- import EntitiesTimezone from './components/EntitiesTimezone';
9
- import UserTimezone from './components/UserTimezone';
10
- function CustomTimezone({ onChange, selectedTimezone, defaultTimezone, browserTimezone }) {
11
- const [anchorEl, setAnchorEl] = useState(null);
12
- const open = Boolean(anchorEl);
13
- const onClose = () => {
14
- setAnchorEl(null);
15
- };
16
- const updateTimezone = (timezone) => {
17
- onChange(timezone);
18
- onClose();
19
- };
20
- const onOpen = (e) => {
21
- setAnchorEl(e.currentTarget);
22
- };
23
- const selectedTimezoneIcon = useMemo(() => {
24
- if (browserTimezone === (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone))
25
- return userTimezoneIcon;
26
- if ((selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone) === defaultTimezone.timezone)
27
- return entityTimezoneIcon;
28
- return savedTimezoneIcon;
29
- }, [browserTimezone, defaultTimezone.timezone, selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone]);
30
- return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onClose }, { children: _jsxs(TimezoneWrapper, Object.assign({ "data-testid": "CustomTimezone" }, { children: [_jsxs(SelectedTimezone, Object.assign({ open: open, onClick: onOpen }, { children: [_jsx("img", { src: selectedTimezoneIcon, alt: "timezone-icon" }), _jsx(CountryFlag, { code: selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.countryCode }), _jsx("span", { children: selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.label })] })), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: "top-start", sx: { zIndex: 3 } }, { children: _jsxs(TimezoneDropdown, Object.assign({ "data-testid": "CustomTimezone_dropdown" }, { children: [_jsx(EntitiesTimezone, { onChange: updateTimezone, selectedTimezone: selectedTimezone, defaultTimezone: defaultTimezone }), _jsx(UserTimezone, { onChange: updateTimezone, selectedTimezone: selectedTimezone, browserTimezone: browserTimezone })] })) }))] })) })));
31
- }
32
- export default memo(CustomTimezone);
@@ -1,12 +0,0 @@
1
- import type { Timezone } from '../../../../../types/index.js';
2
- interface EntitiesTimezoneProps {
3
- selectedTimezone: Timezone | null;
4
- onChange: (selected: Timezone) => void;
5
- defaultTimezone: Timezone;
6
- getTimezoneByCountryCode?: (countryCode: string) => Timezone;
7
- segmentCountries?: {
8
- code: string;
9
- }[];
10
- }
11
- export default function EntitiesTimezone({ selectedTimezone, onChange, defaultTimezone, getTimezoneByCountryCode, segmentCountries, }: EntitiesTimezoneProps): import("react/jsx-runtime").JSX.Element;
12
- export {};
@@ -1,37 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useMemo, useState } from 'react';
3
- import Popper from '@mui/material/Popper';
4
- import { entityTimezoneIcon, smallBlueCheckIcon } from '../../../../../constants/index.js';
5
- import { CountryFlag } from '../../../../index.js';
6
- import { Label, Space, TimezoneDropdown, TimezoneElement } from '../style';
7
- export default function EntitiesTimezone({ selectedTimezone, onChange, defaultTimezone, getTimezoneByCountryCode, segmentCountries, }) {
8
- const [entitiesEl, setEntitiesEl] = useState(null);
9
- const onMouseEnter = (e) => {
10
- if (!entitiesEl)
11
- setEntitiesEl(e.currentTarget);
12
- };
13
- const onMouseLeave = () => {
14
- if (entitiesEl)
15
- setEntitiesEl(null);
16
- };
17
- const onSelectTimezone = (e, tz) => {
18
- e.stopPropagation();
19
- onChange(tz);
20
- };
21
- const availableTimezones = useMemo(() => segmentCountries === null || segmentCountries === void 0 ? void 0 : segmentCountries.map(({ code }) => getTimezoneByCountryCode === null || getTimezoneByCountryCode === void 0 ? void 0 : getTimezoneByCountryCode(code)), [segmentCountries]);
22
- const isSelectedTimezoneOneOFTheAvailable = useMemo(() => availableTimezones === null || availableTimezones === void 0 ? void 0 : availableTimezones.find((item) => (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone) === (item === null || item === void 0 ? void 0 : item.timezone)), [availableTimezones, selectedTimezone]);
23
- const entityTimezone = useMemo(() => {
24
- if (!selectedTimezone)
25
- return defaultTimezone;
26
- return isSelectedTimezoneOneOFTheAvailable ? selectedTimezone : defaultTimezone;
27
- }, [selectedTimezone, defaultTimezone]);
28
- return (_jsxs(TimezoneElement, Object.assign({ onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onClick: () => {
29
- if (selectedTimezone)
30
- onChange(entityTimezone);
31
- } }, { children: [isSelectedTimezoneOneOFTheAvailable ? _jsx("img", { src: smallBlueCheckIcon, alt: "icon" }) : _jsx(Space, {}), _jsx("img", { src: entityTimezoneIcon, alt: "entity-timezone" }), _jsx(CountryFlag, { code: entityTimezone === null || entityTimezone === void 0 ? void 0 : entityTimezone.countryCode }), _jsx(Label, Object.assign({ className: isSelectedTimezoneOneOFTheAvailable ? 'selected' : '' }, { children: isSelectedTimezoneOneOFTheAvailable ? selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.label : defaultTimezone.label })), _jsx(Popper, Object.assign({ open: Boolean(entitiesEl), anchorEl: entitiesEl, placement: "right-start", sx: { zIndex: 3 }, disablePortal: true }, { children: _jsx(TimezoneDropdown, { children: availableTimezones === null || availableTimezones === void 0 ? void 0 : availableTimezones.map((timeZone, idx) => {
32
- const isActive = (timeZone === null || timeZone === void 0 ? void 0 : timeZone.timezone) === (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone);
33
- return (_jsxs(TimezoneElement, Object.assign({ onClick: (e) => {
34
- onSelectTimezone(e, timeZone);
35
- }, sx: { gap: '4px' } }, { children: [isActive ? _jsx("img", { src: smallBlueCheckIcon, alt: "icon" }) : _jsx(Space, {}), _jsx(CountryFlag, { code: timeZone === null || timeZone === void 0 ? void 0 : timeZone.countryCode }), _jsx(Label, Object.assign({ className: isActive ? 'selected' : '' }, { children: timeZone === null || timeZone === void 0 ? void 0 : timeZone.label }))] }), `timezone-item-${idx}`));
36
- }) }) }))] })));
37
- }
@@ -1,8 +0,0 @@
1
- import type { Timezone } from '../../../../../types/index.js';
2
- interface UserTimezoneProps {
3
- selectedTimezone: Timezone | null;
4
- onChange: (selected: Timezone) => void;
5
- browserTimezone?: string;
6
- }
7
- export default function UserTimezone({ onChange, selectedTimezone, browserTimezone }: UserTimezoneProps): import("react/jsx-runtime").JSX.Element;
8
- export {};
@@ -1,14 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useMemo } from 'react';
3
- import { CountryFlag } from '../../../../index.js';
4
- import { userTimezoneIcon, smallBlueCheckIcon, COUNTRIES_TIMEZONES } from '../../../../../constants/index.js';
5
- import { Label, Space, TimezoneElement } from '../style';
6
- export default function UserTimezone({ onChange, selectedTimezone, browserTimezone }) {
7
- const browserTimezoneInfo = useMemo(() => COUNTRIES_TIMEZONES.find(({ timezone }) => timezone === browserTimezone), [browserTimezone]);
8
- const onSelectTimezone = () => {
9
- if (browserTimezoneInfo)
10
- onChange(browserTimezoneInfo);
11
- };
12
- const isBrowserTimezoneActive = (browserTimezoneInfo === null || browserTimezoneInfo === void 0 ? void 0 : browserTimezoneInfo.timezone) === (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone);
13
- return (_jsxs(TimezoneElement, Object.assign({ onClick: onSelectTimezone }, { children: [isBrowserTimezoneActive ? _jsx("img", { src: smallBlueCheckIcon, alt: "icon" }) : _jsx(Space, {}), _jsx("img", { src: userTimezoneIcon, alt: "user-timezone" }), _jsx(CountryFlag, { code: browserTimezoneInfo === null || browserTimezoneInfo === void 0 ? void 0 : browserTimezoneInfo.countryCode }), _jsx(Label, Object.assign({ className: isBrowserTimezoneActive ? 'selected' : '' }, { children: browserTimezoneInfo === null || browserTimezoneInfo === void 0 ? void 0 : browserTimezoneInfo.label }))] })));
14
- }
@@ -1,2 +0,0 @@
1
- import Timezone from './Timezone';
2
- export default Timezone;
@@ -1,2 +0,0 @@
1
- import Timezone from './Timezone';
2
- export default Timezone;
@@ -1,21 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const TimezoneWrapper: 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
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
5
- export declare const TimezoneDropdown: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
8
- export declare const SelectedTimezone: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
9
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
10
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
11
- open: boolean;
12
- }, {}, {}>;
13
- export declare const TimezoneElement: 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
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
15
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
16
- export declare const Space: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
17
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
18
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
19
- export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
20
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
21
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -1,61 +0,0 @@
1
- import Box from '@mui/material/Box';
2
- import { styled } from '@mui/material/styles';
3
- export const TimezoneWrapper = styled(Box)(() => ({
4
- '[class$="-IndicatorsContainer2"]': {
5
- display: 'none',
6
- },
7
- '#react-select-2-listbox': {
8
- width: 300,
9
- },
10
- }));
11
- export const TimezoneDropdown = styled(Box)(({ theme }) => ({
12
- borderRadius: theme.spacing(0.5),
13
- border: `1px solid ${theme.palette.divider}`,
14
- background: theme.palette.common.white,
15
- boxShadow: theme.shadows[10],
16
- minWidth: 200,
17
- width: 'max-content',
18
- overflow: 'auto',
19
- }));
20
- export const SelectedTimezone = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign(Object.assign({ width: 156, fontSize: '11px', color: theme.palette.text.primary, border: '1px solid', borderColor: theme.palette.divider, minHeight: 32, borderRadius: '4px', padding: theme.spacing(1), whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', cursor: 'pointer', display: 'flex', alignItems: 'center', gap: theme.spacing(1), fontWeight: 500 }, (open && {
21
- borderRadius: '4px',
22
- boxShadow: theme.shadows[7],
23
- border: '1px solid',
24
- borderColor: theme.palette.info.dark,
25
- background: theme.palette.common.white,
26
- })), { span: { textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden' } })));
27
- export const TimezoneElement = styled(Box)(({ theme }) => ({
28
- padding: theme.spacing(1),
29
- color: theme.palette.text.primary,
30
- fontSize: '11px',
31
- display: 'flex',
32
- alignItems: 'center',
33
- gap: theme.spacing(1),
34
- height: 33,
35
- cursor: 'pointer',
36
- '&:hover': {
37
- boxShadow: '0px 0px 16px 0px #00000021',
38
- },
39
- '&+&': {
40
- borderTop: '1px solid',
41
- borderColor: theme.palette.divider,
42
- },
43
- '&.active span': {
44
- fontWeight: 500,
45
- },
46
- span: {
47
- whiteSpace: 'nowrap',
48
- overflow: 'hidden',
49
- textOverflow: 'ellipsis',
50
- },
51
- }));
52
- export const Space = styled(Box)(() => ({
53
- width: 12,
54
- height: 12,
55
- }));
56
- export const Label = styled(Box)(({ theme }) => ({
57
- fontSize: '11px',
58
- color: theme.palette.text.secondary,
59
- lineHeight: '15.03px',
60
- '&.selected': { color: theme.palette.info.dark },
61
- }));
@@ -1,2 +0,0 @@
1
- import RangeCalender from './RangeCalender';
2
- export default RangeCalender;
@@ -1,2 +0,0 @@
1
- import RangeCalender from './RangeCalender';
2
- export default RangeCalender;