@tap-payments/os-micro-frontend-shared 0.0.89 → 0.0.91
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.
- package/build/components/StatusBar/StatusBar.d.ts +12 -0
- package/build/components/StatusBar/StatusBar.js +32 -0
- package/build/components/StatusBar/index.d.ts +2 -0
- package/build/components/StatusBar/index.js +2 -0
- package/build/components/index.d.ts +1 -1
- package/build/components/index.js +1 -1
- package/package.json +4 -1
- package/build/components/RangeCalender/RangeCalender.d.ts +0 -20
- package/build/components/RangeCalender/RangeCalender.js +0 -92
- package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.d.ts +0 -11
- package/build/components/RangeCalender/components/CustomTimepicker/CustomTimepicker.js +0 -33
- package/build/components/RangeCalender/components/CustomTimepicker/index.d.ts +0 -2
- package/build/components/RangeCalender/components/CustomTimepicker/index.js +0 -2
- package/build/components/RangeCalender/components/CustomTimepicker/style.d.ts +0 -15
- package/build/components/RangeCalender/components/CustomTimepicker/style.js +0 -132
- package/build/components/RangeCalender/components/GroupBy/GroupBy.d.ts +0 -10
- package/build/components/RangeCalender/components/GroupBy/GroupBy.js +0 -33
- package/build/components/RangeCalender/components/GroupBy/index.d.ts +0 -2
- package/build/components/RangeCalender/components/GroupBy/index.js +0 -2
- package/build/components/RangeCalender/components/GroupBy/style.d.ts +0 -15
- package/build/components/RangeCalender/components/GroupBy/style.js +0 -39
- package/build/components/RangeCalender/components/Hijri/Hijri.d.ts +0 -7
- package/build/components/RangeCalender/components/Hijri/Hijri.js +0 -13
- package/build/components/RangeCalender/components/Hijri/index.d.ts +0 -2
- package/build/components/RangeCalender/components/Hijri/index.js +0 -2
- package/build/components/RangeCalender/components/Hijri/style.d.ts +0 -4
- package/build/components/RangeCalender/components/Hijri/style.js +0 -25
- package/build/components/RangeCalender/components/QuickFilters/QuickFilters.d.ts +0 -8
- package/build/components/RangeCalender/components/QuickFilters/QuickFilters.js +0 -47
- package/build/components/RangeCalender/components/QuickFilters/index.d.ts +0 -2
- package/build/components/RangeCalender/components/QuickFilters/index.js +0 -2
- package/build/components/RangeCalender/components/QuickFilters/style.d.ts +0 -7
- package/build/components/RangeCalender/components/QuickFilters/style.js +0 -27
- package/build/components/RangeCalender/components/RangeDatepicker/RangeDatepicker.d.ts +0 -12
- package/build/components/RangeCalender/components/RangeDatepicker/RangeDatepicker.js +0 -29
- package/build/components/RangeCalender/components/RangeDatepicker/index.d.ts +0 -2
- package/build/components/RangeCalender/components/RangeDatepicker/index.js +0 -2
- package/build/components/RangeCalender/components/RangeDatepicker/style.d.ts +0 -4
- package/build/components/RangeCalender/components/RangeDatepicker/style.js +0 -9
- package/build/components/RangeCalender/components/Timezone/Timezone.d.ts +0 -11
- package/build/components/RangeCalender/components/Timezone/Timezone.js +0 -32
- package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.d.ts +0 -12
- package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.js +0 -37
- package/build/components/RangeCalender/components/Timezone/components/UserTimezone.d.ts +0 -8
- package/build/components/RangeCalender/components/Timezone/components/UserTimezone.js +0 -14
- package/build/components/RangeCalender/components/Timezone/index.d.ts +0 -2
- package/build/components/RangeCalender/components/Timezone/index.js +0 -2
- package/build/components/RangeCalender/components/Timezone/style.d.ts +0 -21
- package/build/components/RangeCalender/components/Timezone/style.js +0 -61
- package/build/components/RangeCalender/index.d.ts +0 -2
- package/build/components/RangeCalender/index.js +0 -2
- package/build/components/RangeCalender/style.d.ts +0 -33
- package/build/components/RangeCalender/style.js +0 -189
- package/build/components/RangeCalender/type.d.ts +0 -2
- package/build/components/RangeCalender/type.js +0 -1
- package/build/components/RangeCalender/utils.d.ts +0 -6
- package/build/components/RangeCalender/utils.js +0 -15
|
@@ -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,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,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,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,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,33 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare const CalenderWrapper: 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 CancelButton: 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"> & {
|
|
6
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
7
|
-
}, "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>, {}, {}>;
|
|
8
|
-
export declare const OkayButton: 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"> & {
|
|
9
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
10
|
-
}, "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>, {}, {}>;
|
|
11
|
-
export declare const ButtonsWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
12
|
-
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
13
|
-
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
14
|
-
export declare const SelectedDate: 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"> & {
|
|
15
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
16
|
-
}, "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> & {
|
|
17
|
-
open: boolean;
|
|
18
|
-
}, {}, {}>;
|
|
19
|
-
export declare const Footer: 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>, {}, {}>;
|
|
22
|
-
export declare const FiltersArea: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
23
|
-
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
24
|
-
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
25
|
-
export declare const TimeZone: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
26
|
-
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
27
|
-
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
28
|
-
export declare const Main: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
29
|
-
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
30
|
-
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
31
|
-
export declare const Settings: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
32
|
-
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
33
|
-
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
@@ -1,189 +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 CalenderWrapper = styled(Box)(({ theme }) => ({
|
|
5
|
-
display: 'flex',
|
|
6
|
-
marginTop: '8px',
|
|
7
|
-
background: theme.palette.common.white,
|
|
8
|
-
boxShadow: theme.shadows[9],
|
|
9
|
-
borderRadius: theme.spacing(1),
|
|
10
|
-
color: theme.palette.text.primary,
|
|
11
|
-
fontSize: '11px',
|
|
12
|
-
'.rmdp-calendar': {
|
|
13
|
-
padding: '8px 16px 16px',
|
|
14
|
-
},
|
|
15
|
-
'.rmdp-rtl *': {
|
|
16
|
-
fontFamily: 'Tajawal',
|
|
17
|
-
},
|
|
18
|
-
'.rmdp-rtl .sd': {
|
|
19
|
-
paddingTop: '4px',
|
|
20
|
-
},
|
|
21
|
-
'.rmdp-wrapper': {
|
|
22
|
-
position: 'relative',
|
|
23
|
-
borderRadius: '8px',
|
|
24
|
-
boxShadow: 'none',
|
|
25
|
-
},
|
|
26
|
-
'.rmdp-day span': {
|
|
27
|
-
fontSize: '11px',
|
|
28
|
-
fontWeight: 500,
|
|
29
|
-
},
|
|
30
|
-
'.rmdp-day, .rmdp-week-day': {
|
|
31
|
-
width: 40,
|
|
32
|
-
height: 40,
|
|
33
|
-
marginBottom: '2px',
|
|
34
|
-
padding: '4px',
|
|
35
|
-
fontSize: '11px',
|
|
36
|
-
color: theme.palette.grey[900],
|
|
37
|
-
},
|
|
38
|
-
'.rmdp-day-picker': {
|
|
39
|
-
padding: 0,
|
|
40
|
-
},
|
|
41
|
-
'.rmdp-day.rmdp-today span': {
|
|
42
|
-
backgroundColor: 'transparent',
|
|
43
|
-
color: theme.palette.info.dark,
|
|
44
|
-
},
|
|
45
|
-
'.rmdp-day.rmdp-today.end span, .rmdp-day.rmdp-today.end span': {
|
|
46
|
-
color: theme.palette.common.white,
|
|
47
|
-
},
|
|
48
|
-
'.rmdp-range, .rmdp-day:not(.rmdp-disabled):not(.rmdp-day-hidden) span:hover': {
|
|
49
|
-
background: theme.palette.info.light,
|
|
50
|
-
boxShadow: 'none',
|
|
51
|
-
color: theme.palette.grey[900],
|
|
52
|
-
},
|
|
53
|
-
'.rmdp-range-hover.start, .rmdp-range.start, .rmdp-range-hover.end, .rmdp-range.end, .rmdp-rtl .rmdp-range-hover.start, .rmdp-rtl .rmdp-range.start, .rmdp-rtl .rmdp-range-hover.end, .rmdp-rtl .rmdp-range.end': {
|
|
54
|
-
borderRadius: '50%',
|
|
55
|
-
background: theme.palette.background.gradient.darkShadedBlue,
|
|
56
|
-
color: theme.palette.common.white,
|
|
57
|
-
},
|
|
58
|
-
'.rmdp-range.start:after': {
|
|
59
|
-
content: '""',
|
|
60
|
-
position: 'absolute',
|
|
61
|
-
background: theme.palette.info.light,
|
|
62
|
-
height: '100%',
|
|
63
|
-
width: '50%',
|
|
64
|
-
right: 0,
|
|
65
|
-
top: 0,
|
|
66
|
-
zIndex: -1,
|
|
67
|
-
},
|
|
68
|
-
'.rmdp-rtl .rmdp-range.start:after': {
|
|
69
|
-
right: 'unset',
|
|
70
|
-
left: 0,
|
|
71
|
-
},
|
|
72
|
-
'.rmdp-range.end:after': {
|
|
73
|
-
content: '""',
|
|
74
|
-
position: 'absolute',
|
|
75
|
-
background: theme.palette.info.light,
|
|
76
|
-
height: '100%',
|
|
77
|
-
width: '50%',
|
|
78
|
-
left: 0,
|
|
79
|
-
top: 0,
|
|
80
|
-
zIndex: -1,
|
|
81
|
-
},
|
|
82
|
-
'.rmdp-rtl .rmdp-range.end:after': {
|
|
83
|
-
left: 'unset',
|
|
84
|
-
right: 0,
|
|
85
|
-
},
|
|
86
|
-
'.rmdp-week-day': {
|
|
87
|
-
color: theme.palette.grey[700],
|
|
88
|
-
marginBottom: '4px',
|
|
89
|
-
fontSize: '11px',
|
|
90
|
-
padding: '4px',
|
|
91
|
-
},
|
|
92
|
-
'.rmdp-header-values': {
|
|
93
|
-
color: theme.palette.grey[900],
|
|
94
|
-
fontSize: '12px',
|
|
95
|
-
fontWeight: 500,
|
|
96
|
-
lineHeight: '20px',
|
|
97
|
-
letterSpacing: '0.1px',
|
|
98
|
-
},
|
|
99
|
-
'.rmdp-header-values span:nth-of-type(2)': {
|
|
100
|
-
display: 'none',
|
|
101
|
-
},
|
|
102
|
-
'.rmdp-header': {
|
|
103
|
-
padding: '4px 0',
|
|
104
|
-
margin: 0,
|
|
105
|
-
fontSize: '12px',
|
|
106
|
-
},
|
|
107
|
-
'.rmdp-top-class': {
|
|
108
|
-
display: 'block !important',
|
|
109
|
-
},
|
|
110
|
-
'.rmdp-day.rmdp-selected span:not(.highlight)': {
|
|
111
|
-
background: theme.palette.info.dark,
|
|
112
|
-
},
|
|
113
|
-
'.rmdp-day.start.end': {
|
|
114
|
-
overflow: 'hidden',
|
|
115
|
-
},
|
|
116
|
-
}));
|
|
117
|
-
export const CancelButton = styled(Button)(({ theme }) => ({
|
|
118
|
-
textTransform: 'capitalize',
|
|
119
|
-
padding: '8px 24px',
|
|
120
|
-
width: 75,
|
|
121
|
-
height: 32,
|
|
122
|
-
fontSize: '11px',
|
|
123
|
-
background: 'transparent',
|
|
124
|
-
color: theme.palette.text.primary,
|
|
125
|
-
border: '1px solid',
|
|
126
|
-
borderColor: theme.palette.divider,
|
|
127
|
-
fontWeight: 500,
|
|
128
|
-
borderRadius: '4px',
|
|
129
|
-
'&:hover': {
|
|
130
|
-
background: 'transparent',
|
|
131
|
-
color: theme.palette.text.primary,
|
|
132
|
-
},
|
|
133
|
-
}));
|
|
134
|
-
export const OkayButton = styled(Button)(({ theme }) => ({
|
|
135
|
-
textTransform: 'capitalize',
|
|
136
|
-
padding: '8px 24px',
|
|
137
|
-
width: 75,
|
|
138
|
-
height: 32,
|
|
139
|
-
fontSize: '11px',
|
|
140
|
-
borderRadius: '4px',
|
|
141
|
-
fontWeight: 700,
|
|
142
|
-
background: theme.palette.info.dark,
|
|
143
|
-
'&:hover': {
|
|
144
|
-
background: theme.palette.info.dark,
|
|
145
|
-
},
|
|
146
|
-
}));
|
|
147
|
-
export const ButtonsWrapper = styled(Box)(() => ({
|
|
148
|
-
display: 'flex',
|
|
149
|
-
gap: 8,
|
|
150
|
-
}));
|
|
151
|
-
export const SelectedDate = styled(Button, { shouldForwardProp: (props) => props !== 'open' })(({ open, theme }) => (Object.assign({ color: theme.palette.text.primary, fontSize: '11px', fontWeight: 500, padding: theme.spacing(1), borderRadius: '4px', border: '1px solid', borderColor: theme.palette.divider, background: theme.palette.common.white, textTransform: 'none', height: 32 }, (open && { border: '1px solid', borderColor: theme.palette.info.dark, boxShadow: theme.shadows[7] }))));
|
|
152
|
-
export const Footer = styled(Box)(({ theme }) => ({
|
|
153
|
-
background: theme.palette.common.white,
|
|
154
|
-
display: 'flex',
|
|
155
|
-
justifyContent: 'space-between',
|
|
156
|
-
alignItems: 'center',
|
|
157
|
-
gap: 10,
|
|
158
|
-
padding: '16px',
|
|
159
|
-
borderTop: '1px solid',
|
|
160
|
-
borderColor: theme.palette.divider,
|
|
161
|
-
borderBottomRightRadius: '8px',
|
|
162
|
-
}));
|
|
163
|
-
export const FiltersArea = styled(Box)(({ theme }) => ({
|
|
164
|
-
padding: 16,
|
|
165
|
-
paddingInlineEnd: '23px',
|
|
166
|
-
borderRight: '1px solid',
|
|
167
|
-
borderColor: theme.palette.divider,
|
|
168
|
-
background: theme.palette.common.white,
|
|
169
|
-
width: 'max-content',
|
|
170
|
-
borderTopLeftRadius: '8px',
|
|
171
|
-
borderBottomLeftRadius: '8px',
|
|
172
|
-
display: 'flex',
|
|
173
|
-
flexDirection: 'column',
|
|
174
|
-
gap: 10,
|
|
175
|
-
justifyContent: 'space-between',
|
|
176
|
-
}));
|
|
177
|
-
export const TimeZone = styled(Box)(() => ({
|
|
178
|
-
display: 'flex',
|
|
179
|
-
alignItems: 'center',
|
|
180
|
-
gap: '10px',
|
|
181
|
-
}));
|
|
182
|
-
export const Main = styled(Box)(() => ({
|
|
183
|
-
position: 'relative',
|
|
184
|
-
}));
|
|
185
|
-
export const Settings = styled(Box)(() => ({
|
|
186
|
-
display: 'flex',
|
|
187
|
-
flexDirection: 'column',
|
|
188
|
-
gap: '24px',
|
|
189
|
-
}));
|