@tap-payments/os-micro-frontend-shared 0.1.220 → 0.1.221-test.10
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/Chip/style.d.ts +0 -1
- package/build/components/CountBadge/style.d.ts +0 -1
- package/build/components/Dialog/style.d.ts +0 -1
- package/build/components/FlippingCard/style.d.ts +0 -1
- package/build/components/ImageWrapper/ImageWrapper.d.ts +0 -1
- package/build/components/JSONViewer/style.d.ts +0 -1
- package/build/components/LeftPeekRightExpandingChip/style.d.ts +0 -1
- package/build/components/RangeCalender/RangeCalender.d.ts +2 -26
- package/build/components/RangeCalender/RangeCalender.js +2 -2
- package/build/components/RangeCalender/components/Timezone/Timezone.d.ts +3 -2
- package/build/components/RangeCalender/components/Timezone/Timezone.js +4 -4
- package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.d.ts +3 -6
- package/build/components/RangeCalender/components/Timezone/components/EntitiesTimezone.js +7 -6
- package/build/components/RangeCalender/type.d.ts +26 -0
- package/build/components/RightLeftExpandingCenterChip/style.d.ts +0 -1
- package/build/components/SearchButton/styles.d.ts +0 -1
- package/build/components/StatusButton/style.d.ts +1 -1
- package/build/components/StatusIcons/AuthIcons/style.d.ts +0 -1
- package/build/components/StatusIcons/AuthorizationAutoIcons/style.d.ts +0 -1
- package/build/components/StatusIcons/ChargeStatusIcon/style.d.ts +0 -1
- package/build/components/StatusIcons/SourceIcons/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/ActionCell/ActionCell.js +13 -10
- package/build/components/TableCells/CustomCells/ActionCell/components/ActionIconColumn.js +13 -10
- package/build/components/TableCells/CustomCells/ActionCell/hooks/useActionCell.d.ts +3 -1
- package/build/components/TableCells/CustomCells/ActionCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/ApplicationStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/AuthenticationCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/AuthenticationStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/AuthenticationTypeCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/BalanceCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/ChannelsCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/CheckoutStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/DestinationStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/DueDateCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/IDButton/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/IntentsStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/InvoiceStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/PayoutStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/ProductsCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/ReferenceCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/RefundChargeCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/RefundStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/SalesChannelCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/SegmentsCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/SourceCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/StatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/TokenStatusCell/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/style.d.ts +0 -1
- package/build/components/TableCells/CustomCells/type.d.ts +3 -1
- package/build/components/VirtualTables/components/style.d.ts +0 -1
- package/build/constants/assets.d.ts +1 -0
- package/build/constants/assets.js +1 -0
- package/build/types/table.d.ts +9 -0
- package/build/utils/index.d.ts +1 -0
- package/build/utils/index.js +1 -0
- package/build/utils/timezone.d.ts +2 -0
- package/build/utils/timezone.js +3 -0
- package/package.json +3 -3
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
import { GetSourceAnimationFunction } from './type';
|
|
4
3
|
export declare const ChipStyled: import("@emotion/styled").StyledComponent<import("react").RefAttributes<unknown> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
|
|
5
4
|
variant?: import("./type").ChipVariant | undefined;
|
|
@@ -1,27 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
import { SxProps } from '@mui/system';
|
|
4
|
-
import type { CalenderMode, Timezone } from '../../types/index.js';
|
|
5
|
-
import { RangeDatepickerProps } from './components/RangeDatepicker';
|
|
6
|
-
interface RangeCalendarProps {
|
|
7
|
-
defaultDate: [Date, Date];
|
|
8
|
-
onDateChange: (date: [Date, Date]) => void;
|
|
9
|
-
mode?: CalenderMode;
|
|
10
|
-
onCalendarModeSwitch?: (mode: CalenderMode) => void;
|
|
11
|
-
numberOfMonths?: number;
|
|
12
|
-
noTimezone?: boolean;
|
|
13
|
-
noQuickFilter?: boolean;
|
|
14
|
-
maxDateRange?: number;
|
|
15
|
-
onCalendarGroupChange?: (value: string) => void;
|
|
16
|
-
groupBy?: string;
|
|
17
|
-
timezone: Timezone | null;
|
|
18
|
-
onChangeTimezone?: (timezone: Timezone) => void;
|
|
19
|
-
defaultTimezone: Timezone;
|
|
20
|
-
browserTimezone: string;
|
|
21
|
-
renderCalendarButton?: (open: boolean, onOpenCalender: (event: MouseEvent<HTMLElement>) => void) => React.ReactNode;
|
|
22
|
-
mainSx?: SxProps;
|
|
23
|
-
popperProps?: Partial<PopperProps>;
|
|
24
|
-
rangeDatePickerProps?: Partial<RangeDatepickerProps>;
|
|
25
|
-
}
|
|
26
|
-
declare function RangeCalender({ defaultDate, onDateChange, mode, onCalendarModeSwitch, numberOfMonths, noTimezone, noQuickFilter, maxDateRange, onCalendarGroupChange, groupBy, timezone, onChangeTimezone, defaultTimezone, browserTimezone, renderCalendarButton, mainSx, popperProps, rangeDatePickerProps, }: RangeCalendarProps): import("react/jsx-runtime").JSX.Element;
|
|
1
|
+
import { RangeCalendarProps } from './type';
|
|
2
|
+
declare function RangeCalender({ defaultDate, onDateChange, mode, onCalendarModeSwitch, numberOfMonths, noTimezone, noQuickFilter, maxDateRange, onCalendarGroupChange, groupBy, timezone, onChangeTimezone, browserTimezone, renderCalendarButton, mainSx, popperProps, rangeDatePickerProps, defaultCountryTimezone, countriesCodes, }: RangeCalendarProps): import("react/jsx-runtime").JSX.Element;
|
|
27
3
|
export default RangeCalender;
|
|
@@ -15,7 +15,7 @@ import CustomTimezone from './components/Timezone';
|
|
|
15
15
|
import { ButtonsWrapper, CalenderWrapper, CancelButton, FiltersArea, Footer, Main, OkayButton, SelectedDate, TimeZone, Settings } from './style';
|
|
16
16
|
import CustomTimePicker from './components/CustomTimepicker';
|
|
17
17
|
import { getDateRange, getEndOfDate, getStartOfDate } from './utils';
|
|
18
|
-
function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalendarModeSwitch, numberOfMonths, noTimezone, noQuickFilter, maxDateRange, onCalendarGroupChange, groupBy, timezone, onChangeTimezone,
|
|
18
|
+
function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalendarModeSwitch, numberOfMonths, noTimezone, noQuickFilter, maxDateRange, onCalendarGroupChange, groupBy, timezone, onChangeTimezone, browserTimezone, renderCalendarButton, mainSx, popperProps, rangeDatePickerProps, defaultCountryTimezone, countriesCodes, }) {
|
|
19
19
|
const [dates, setDates] = useState(getDateRange(defaultDate));
|
|
20
20
|
const [values, setValues] = useState(dates);
|
|
21
21
|
const [selectedTimezone, setSelectedTimezone] = useState(timezone);
|
|
@@ -90,6 +90,6 @@ function RangeCalender({ defaultDate, onDateChange, mode = 'gregorian', onCalend
|
|
|
90
90
|
onCloseCalender();
|
|
91
91
|
} })), _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) => {
|
|
92
92
|
setSelectedGroupBy(group);
|
|
93
|
-
} })), _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,
|
|
93
|
+
} })), _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, browserTimezone: browserTimezone, defaultCountryTimezone: defaultCountryTimezone, countriesCodes: countriesCodes }, 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') }))] })] }))] }))] }) }))] })));
|
|
94
94
|
}
|
|
95
95
|
export default RangeCalender;
|
|
@@ -3,9 +3,10 @@ import type { Timezone } from '../../../../types/index.js';
|
|
|
3
3
|
interface CustomTimezoneProps {
|
|
4
4
|
onChange: (timezone: Timezone) => void;
|
|
5
5
|
selectedTimezone: Timezone | null;
|
|
6
|
-
|
|
6
|
+
defaultCountryTimezone: Timezone;
|
|
7
7
|
browserTimezone: string;
|
|
8
|
+
countriesCodes: string[];
|
|
8
9
|
}
|
|
9
|
-
declare function CustomTimezone({ onChange, selectedTimezone,
|
|
10
|
+
declare function CustomTimezone({ onChange, selectedTimezone, browserTimezone, defaultCountryTimezone, countriesCodes }: CustomTimezoneProps): import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
declare const _default: import("react").MemoExoticComponent<typeof CustomTimezone>;
|
|
11
12
|
export default _default;
|
|
@@ -7,7 +7,7 @@ import { CountryFlag } from '../../../index.js';
|
|
|
7
7
|
import { TimezoneWrapper, TimezoneDropdown, SelectedTimezone } from './style';
|
|
8
8
|
import EntitiesTimezone from './components/EntitiesTimezone';
|
|
9
9
|
import UserTimezone from './components/UserTimezone';
|
|
10
|
-
function CustomTimezone({ onChange, selectedTimezone,
|
|
10
|
+
function CustomTimezone({ onChange, selectedTimezone, browserTimezone, defaultCountryTimezone, countriesCodes }) {
|
|
11
11
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
12
12
|
const open = Boolean(anchorEl);
|
|
13
13
|
const onClose = () => {
|
|
@@ -23,10 +23,10 @@ function CustomTimezone({ onChange, selectedTimezone, defaultTimezone, browserTi
|
|
|
23
23
|
const selectedTimezoneIcon = useMemo(() => {
|
|
24
24
|
if (browserTimezone === (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone))
|
|
25
25
|
return userTimezoneIcon;
|
|
26
|
-
if ((selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone) ===
|
|
26
|
+
if ((selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone) === defaultCountryTimezone.timezone)
|
|
27
27
|
return entityTimezoneIcon;
|
|
28
28
|
return savedTimezoneIcon;
|
|
29
|
-
}, [browserTimezone,
|
|
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: 1400 } }, { children: _jsxs(TimezoneDropdown, Object.assign({ "data-testid": "CustomTimezone_dropdown" }, { children: [_jsx(EntitiesTimezone, { onChange: updateTimezone, selectedTimezone: selectedTimezone,
|
|
29
|
+
}, [browserTimezone, defaultCountryTimezone.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: 1400 } }, { children: _jsxs(TimezoneDropdown, Object.assign({ "data-testid": "CustomTimezone_dropdown" }, { children: [_jsx(EntitiesTimezone, { onChange: updateTimezone, selectedTimezone: selectedTimezone, defaultCountryTimezone: defaultCountryTimezone, countriesCodes: countriesCodes }), _jsx(UserTimezone, { onChange: updateTimezone, selectedTimezone: selectedTimezone, browserTimezone: browserTimezone })] })) }))] })) })));
|
|
31
31
|
}
|
|
32
32
|
export default memo(CustomTimezone);
|
|
@@ -2,11 +2,8 @@ import type { Timezone } from '../../../../../types/index.js';
|
|
|
2
2
|
interface EntitiesTimezoneProps {
|
|
3
3
|
selectedTimezone: Timezone | null;
|
|
4
4
|
onChange: (selected: Timezone) => void;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
segmentCountries?: {
|
|
8
|
-
code: string;
|
|
9
|
-
}[];
|
|
5
|
+
countriesCodes?: string[];
|
|
6
|
+
defaultCountryTimezone: Timezone;
|
|
10
7
|
}
|
|
11
|
-
export default function EntitiesTimezone({ selectedTimezone, onChange,
|
|
8
|
+
export default function EntitiesTimezone({ selectedTimezone, onChange, countriesCodes, defaultCountryTimezone }: EntitiesTimezoneProps): import("react/jsx-runtime").JSX.Element;
|
|
12
9
|
export {};
|
|
@@ -3,8 +3,9 @@ import { useMemo, useState } from 'react';
|
|
|
3
3
|
import Popper from '@mui/material/Popper';
|
|
4
4
|
import { entityTimezoneIcon, smallBlueCheckIcon } from '../../../../../constants/index.js';
|
|
5
5
|
import { CountryFlag } from '../../../../index.js';
|
|
6
|
+
import { getTimezoneByCountryCode } from '../../../../../utils/index.js';
|
|
6
7
|
import { Label, Space, TimezoneDropdown, TimezoneElement } from '../style';
|
|
7
|
-
export default function EntitiesTimezone({ selectedTimezone, onChange,
|
|
8
|
+
export default function EntitiesTimezone({ selectedTimezone, onChange, countriesCodes, defaultCountryTimezone }) {
|
|
8
9
|
const [entitiesEl, setEntitiesEl] = useState(null);
|
|
9
10
|
const onMouseEnter = (e) => {
|
|
10
11
|
if (!entitiesEl)
|
|
@@ -18,17 +19,17 @@ export default function EntitiesTimezone({ selectedTimezone, onChange, defaultTi
|
|
|
18
19
|
e.stopPropagation();
|
|
19
20
|
onChange(tz);
|
|
20
21
|
};
|
|
21
|
-
const availableTimezones = useMemo(() =>
|
|
22
|
+
const availableTimezones = useMemo(() => countriesCodes === null || countriesCodes === void 0 ? void 0 : countriesCodes.map((code) => getTimezoneByCountryCode(code)), [countriesCodes]);
|
|
22
23
|
const isSelectedTimezoneOneOFTheAvailable = useMemo(() => availableTimezones === null || availableTimezones === void 0 ? void 0 : availableTimezones.some((item) => (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone) === (item === null || item === void 0 ? void 0 : item.timezone)), [availableTimezones, selectedTimezone]);
|
|
23
24
|
const entityTimezone = useMemo(() => {
|
|
24
25
|
if (!selectedTimezone)
|
|
25
|
-
return
|
|
26
|
-
return isSelectedTimezoneOneOFTheAvailable ? selectedTimezone :
|
|
27
|
-
}, [selectedTimezone,
|
|
26
|
+
return defaultCountryTimezone;
|
|
27
|
+
return isSelectedTimezoneOneOFTheAvailable ? selectedTimezone : defaultCountryTimezone;
|
|
28
|
+
}, [selectedTimezone, defaultCountryTimezone, isSelectedTimezoneOneOFTheAvailable]);
|
|
28
29
|
return (_jsxs(TimezoneElement, Object.assign({ onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onClick: () => {
|
|
29
30
|
if (selectedTimezone)
|
|
30
31
|
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 :
|
|
32
|
+
} }, { 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 : defaultCountryTimezone === null || defaultCountryTimezone === void 0 ? void 0 : defaultCountryTimezone.label })), _jsx(Popper, Object.assign({ open: Boolean(entitiesEl), anchorEl: entitiesEl, placement: "right-start", sx: { zIndex: 3 }, disablePortal: true }, { children: _jsx(TimezoneDropdown, Object.assign({ sx: { maxHeight: 300 } }, { children: availableTimezones === null || availableTimezones === void 0 ? void 0 : availableTimezones.map((timeZone, idx) => {
|
|
32
33
|
const isActive = (timeZone === null || timeZone === void 0 ? void 0 : timeZone.timezone) === (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.timezone);
|
|
33
34
|
return (_jsxs(TimezoneElement, Object.assign({ onClick: (e) => {
|
|
34
35
|
onSelectTimezone(e, timeZone);
|
|
@@ -1,2 +1,28 @@
|
|
|
1
|
+
import { MouseEvent } from 'react';
|
|
2
|
+
import { PopperProps } from '@mui/material/Popper';
|
|
3
|
+
import { SxProps } from '@mui/system';
|
|
1
4
|
import type { DateObject } from 'react-multi-date-picker';
|
|
5
|
+
import type { CalenderMode, Timezone } from '../../types/index.js';
|
|
6
|
+
import { RangeDatepickerProps } from './components/RangeDatepicker';
|
|
2
7
|
export type Dates = [DateObject, DateObject];
|
|
8
|
+
export interface RangeCalendarProps {
|
|
9
|
+
defaultDate: [Date, Date];
|
|
10
|
+
onDateChange: (date: [Date, Date]) => void;
|
|
11
|
+
mode?: CalenderMode;
|
|
12
|
+
onCalendarModeSwitch?: (mode: CalenderMode) => void;
|
|
13
|
+
numberOfMonths?: number;
|
|
14
|
+
noTimezone?: boolean;
|
|
15
|
+
noQuickFilter?: boolean;
|
|
16
|
+
maxDateRange?: number;
|
|
17
|
+
onCalendarGroupChange?: (value: string) => void;
|
|
18
|
+
groupBy?: string;
|
|
19
|
+
timezone: Timezone | null;
|
|
20
|
+
onChangeTimezone?: (timezone: Timezone) => void;
|
|
21
|
+
defaultCountryTimezone: Timezone;
|
|
22
|
+
browserTimezone: string;
|
|
23
|
+
renderCalendarButton?: (open: boolean, onOpenCalender: (event: MouseEvent<HTMLElement>) => void) => React.ReactNode;
|
|
24
|
+
mainSx?: SxProps;
|
|
25
|
+
popperProps?: Partial<PopperProps>;
|
|
26
|
+
rangeDatePickerProps?: Partial<RangeDatepickerProps>;
|
|
27
|
+
countriesCodes: string[];
|
|
28
|
+
}
|
|
@@ -21,7 +21,7 @@ export declare const CountBadge: import("@emotion/styled").StyledComponent<impor
|
|
|
21
21
|
}, {}, {}>;
|
|
22
22
|
export declare const StatusIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme> & {
|
|
23
23
|
variant: StatusButtonVariant;
|
|
24
|
-
icon?: "search" | "scheduled" | "paidOut" | "reversed" | "checked" | "
|
|
24
|
+
icon?: "search" | "scheduled" | "paidOut" | "reversed" | "checked" | "inProgress" | "initiated" | "abandoned" | "cancelled" | "reports" | "chevronDown" | "unAuthorized" | "unSettled" | "unCaptured" | "captured" | "authorized" | "openFlag" | "closedFlag" | "unauthenticated" | "authenticated" | "dashedChecked" | "deactivated" | undefined;
|
|
25
25
|
}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
26
26
|
export declare const StyledFilterName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
|
|
27
27
|
export declare const StyledDropdown: import("@emotion/styled").StyledComponent<import("../DropdownMenu").IProps & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -80,15 +80,18 @@ export const ActionCell = memo((_a) => {
|
|
|
80
80
|
pointerEvents: 'none',
|
|
81
81
|
})) }, { children: [_jsx(TransparentButton, Object.assign({ onClick: handleClick, "data-testid": "ActionCell_ActionsIconContainer_TransparentButton", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
|
|
82
82
|
pointerEvents: 'none',
|
|
83
|
-
})) }, { children: _jsx(AnimatePresence, Object.assign({ mode: "wait" }, { children: _jsx(ActionIconsVariants, { isAnyActionLoading: isAnyActionLoading, isAnyActionHasError: isAnyActionHasError, isAnyActionSuccessful: isAnyActionSuccessful, areThereAnyShownActions: areThereAnyShownActions }) })) })), renderDropdown ? (renderDropdown(anchorEl, setAnchorEl)) : (_jsxs(_Fragment, { children: [dropdownAction, areThereAnyShownActions && (_jsx(Dropdown, { style: { zIndex: 2000 }, open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: filteredActions.map((action) =>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
83
|
+
})) }, { children: _jsx(AnimatePresence, Object.assign({ mode: "wait" }, { children: _jsx(ActionIconsVariants, { isAnyActionLoading: isAnyActionLoading, isAnyActionHasError: isAnyActionHasError, isAnyActionSuccessful: isAnyActionSuccessful, areThereAnyShownActions: areThereAnyShownActions }) })) })), renderDropdown ? (renderDropdown(anchorEl, setAnchorEl)) : (_jsxs(_Fragment, { children: [dropdownAction, areThereAnyShownActions && (_jsx(Dropdown, { style: { zIndex: 2000 }, open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: filteredActions.map((action) => {
|
|
84
|
+
var _a;
|
|
85
|
+
return (Object.assign(Object.assign({}, action), { onClick: (e) => {
|
|
86
|
+
var _a;
|
|
87
|
+
(_a = action === null || action === void 0 ? void 0 : action.onClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
88
|
+
if (!action.hasActionMenu) {
|
|
89
|
+
handleClose();
|
|
90
|
+
}
|
|
91
|
+
}, onRightClick: (e) => {
|
|
92
|
+
var _a;
|
|
93
|
+
(_a = action === null || action === void 0 ? void 0 : action.onRightClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
87
94
|
handleClose();
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
var _a;
|
|
91
|
-
(_a = action === null || action === void 0 ? void 0 : action.onRightClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
92
|
-
handleClose();
|
|
93
|
-
}, icon: (_jsx(ActionIcon, { icon: action.icon, src: actionIcons[action.icon], initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 } }, `action.label-${action.label.trim()}`)) }))) }))] }))] }))] }))] })) })));
|
|
95
|
+
}, icon: action.customIcon || (_jsx(ActionIcon, { icon: action.icon, src: (_a = action.iconSrc) !== null && _a !== void 0 ? _a : (action.icon && actionIcons[action.icon]), initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 } }, `action.label-${action.label.trim()}`)) }));
|
|
96
|
+
}) }))] }))] }))] }))] })) })));
|
|
94
97
|
});
|
|
@@ -33,16 +33,19 @@ function ActionIconColumn(_a) {
|
|
|
33
33
|
pointerEvents: 'none',
|
|
34
34
|
})) }, { children: [_jsx(TransparentButton, Object.assign({ onClick: handleClick, "data-testid": "ActionIconColumn_ActionsIconContainer_TransparentButton", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
|
|
35
35
|
pointerEvents: 'none',
|
|
36
|
-
})) }, { children: _jsx(AnimatePresence, Object.assign({ mode: "wait" }, { children: _jsx(ActionIconsVariants, { isAnyActionLoading: isAnyActionLoading, isAnyActionHasError: isAnyActionHasError, isAnyActionSuccessful: isAnyActionSuccessful, areThereAnyShownActions: areThereAnyShownActions }) })) })), renderDropdown ? (renderDropdown(anchorEl, setAnchorEl)) : (_jsxs(_Fragment, { children: [dropdownAction, areThereAnyShownActions && (_jsx(Dropdown, { style: { zIndex: 2000 }, open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: filteredActions.map((action) =>
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
36
|
+
})) }, { children: _jsx(AnimatePresence, Object.assign({ mode: "wait" }, { children: _jsx(ActionIconsVariants, { isAnyActionLoading: isAnyActionLoading, isAnyActionHasError: isAnyActionHasError, isAnyActionSuccessful: isAnyActionSuccessful, areThereAnyShownActions: areThereAnyShownActions }) })) })), renderDropdown ? (renderDropdown(anchorEl, setAnchorEl)) : (_jsxs(_Fragment, { children: [dropdownAction, areThereAnyShownActions && (_jsx(Dropdown, { style: { zIndex: 2000 }, open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: filteredActions.map((action) => {
|
|
37
|
+
var _a;
|
|
38
|
+
return (Object.assign(Object.assign({}, action), { onClick: (e) => {
|
|
39
|
+
var _a;
|
|
40
|
+
(_a = action === null || action === void 0 ? void 0 : action.onClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
41
|
+
if (!action.hasActionMenu) {
|
|
42
|
+
handleClose();
|
|
43
|
+
}
|
|
44
|
+
}, onRightClick: (e) => {
|
|
45
|
+
var _a;
|
|
46
|
+
(_a = action === null || action === void 0 ? void 0 : action.onRightClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
40
47
|
handleClose();
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
var _a;
|
|
44
|
-
(_a = action === null || action === void 0 ? void 0 : action.onRightClick) === null || _a === void 0 ? void 0 : _a.call(action, e);
|
|
45
|
-
handleClose();
|
|
46
|
-
}, icon: (_jsx(ActionIcon, { icon: action.icon, src: actionIcons[action.icon], initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 } }, `action.label-${action.label.trim()}`)) }))) }))] }))] })) })) })));
|
|
48
|
+
}, icon: action.customIcon || (_jsx(ActionIcon, { icon: action.icon, src: (_a = action.iconSrc) !== null && _a !== void 0 ? _a : (action.icon && actionIcons[action.icon]), initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 } }, `action.label-${action.label.trim()}`)) }));
|
|
49
|
+
}) }))] }))] })) })) })));
|
|
47
50
|
}
|
|
48
51
|
export default memo(ActionIconColumn);
|
|
@@ -13,12 +13,14 @@ export declare function useActionCell({ actions, isDropdownShown, onCloseDropdow
|
|
|
13
13
|
label: string;
|
|
14
14
|
onClick: (e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void;
|
|
15
15
|
onRightClick?: ((e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void) | undefined;
|
|
16
|
-
icon
|
|
16
|
+
icon?: "brand" | "users" | "cancel" | "reverse" | "refund" | "destination" | "capture" | "flag" | "dispute" | "void" | "clock" | "invoice" | "clipboard" | "viewApi" | "viewReceipt" | undefined;
|
|
17
17
|
isLoading?: boolean | undefined;
|
|
18
18
|
isError?: boolean | undefined;
|
|
19
19
|
isSuccess?: boolean | undefined;
|
|
20
20
|
isShown?: boolean | undefined;
|
|
21
21
|
hasActionMenu?: boolean | undefined;
|
|
22
|
+
iconSrc?: string | undefined;
|
|
23
|
+
customIcon?: React.ReactNode;
|
|
22
24
|
}[];
|
|
23
25
|
isAnyActionLoading: boolean;
|
|
24
26
|
isAnyActionHasError: boolean;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
import { TableMode } from '../../../../types/index.js';
|
|
4
3
|
export declare const ActionCellContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
5
4
|
tableMode?: TableMode | undefined;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledAppsCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const AppsStatusContainer: import("@emotion/styled").StyledComponent<{
|
|
5
4
|
hidden?: boolean | undefined;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const AuthIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
3
|
export declare const AuthCellContainer: import("@emotion/styled").StyledComponent<{
|
|
5
4
|
hidden?: boolean | undefined;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const ReferenceSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const SalesChannelsContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const ReferenceSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
5
4
|
hidden?: boolean | undefined;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
4
3
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
5
4
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
2
|
export declare const GeographyBox: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
|
|
4
3
|
variant?: "Global" | "Regional" | "Local" | undefined;
|
|
5
4
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
@@ -39,12 +39,14 @@ export interface ActionCellProps extends TableCellProps {
|
|
|
39
39
|
label: string;
|
|
40
40
|
onClick: (e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void;
|
|
41
41
|
onRightClick?: (e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void;
|
|
42
|
-
icon
|
|
42
|
+
icon?: ActionType;
|
|
43
43
|
isLoading?: boolean;
|
|
44
44
|
isError?: boolean;
|
|
45
45
|
isSuccess?: boolean;
|
|
46
46
|
isShown?: boolean;
|
|
47
47
|
hasActionMenu?: boolean;
|
|
48
|
+
iconSrc?: string;
|
|
49
|
+
customIcon?: React.ReactNode;
|
|
48
50
|
}>;
|
|
49
51
|
flagTooltip?: React.ReactNode;
|
|
50
52
|
flagsCount?: number;
|
|
@@ -563,3 +563,4 @@ export const activeGreenIcon = `${lightUrl}/activeGreenIcon.svg`;
|
|
|
563
563
|
export const inActiveGreyIcon = `${lightUrl}/inActiveGreyIcon.svg`;
|
|
564
564
|
export const terminalLinkVideo = `${videosUrl}/terminal_link.mp4`;
|
|
565
565
|
export const bluePlusIcon = `${lightUrl}/bluePlusIcon.svg`;
|
|
566
|
+
export const blackSettingsVariant2Icon = `${lightUrl}/blackSettingsVariant2Icon.svg`;
|
package/build/types/table.d.ts
CHANGED
|
@@ -5,6 +5,7 @@ import { TableHeadProps } from '@mui/material/TableHead';
|
|
|
5
5
|
import { TableRowProps } from '@mui/material/TableRow';
|
|
6
6
|
import { DragControls } from 'framer-motion';
|
|
7
7
|
import { CustomColumnFilterProps } from '../components/VirtualTables';
|
|
8
|
+
import { ActionCellProps } from '../components/index.js';
|
|
8
9
|
import { Country } from './appConfig';
|
|
9
10
|
import { SortingOrder } from './sort';
|
|
10
11
|
export interface TableFilters<T> {
|
|
@@ -152,3 +153,11 @@ export type IColumnFilter = ({
|
|
|
152
153
|
isOnlyOneFilter?: boolean;
|
|
153
154
|
wrapperSx?: SxProps;
|
|
154
155
|
} & (IColumnFilterList | IColumnFilterInputs | IColumnFilterCustom));
|
|
156
|
+
type ActionCellActionProps = Exclude<ActionCellProps['actions'], undefined>[number];
|
|
157
|
+
export interface TableNavigation {
|
|
158
|
+
label: string;
|
|
159
|
+
onClick: (e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void;
|
|
160
|
+
onRightClick: (e: React.MouseEvent<HTMLLIElement, MouseEvent>) => void;
|
|
161
|
+
icon?: ActionCellActionProps['icon'];
|
|
162
|
+
}
|
|
163
|
+
export {};
|
package/build/utils/index.d.ts
CHANGED
package/build/utils/index.js
CHANGED
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { COUNTRIES_TIMEZONES } from '../constants/index.js';
|
|
2
|
+
export const getTimezoneByCountryCode = (code) => COUNTRIES_TIMEZONES.find((country) => country.countryCode === code);
|
|
3
|
+
export const getTimezoneByTimezone = (timezone) => COUNTRIES_TIMEZONES.find((country) => country.timezone === timezone);
|
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.
|
|
5
|
-
"testVersion":
|
|
4
|
+
"version": "0.1.221-test.10",
|
|
5
|
+
"testVersion": 10,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "build/index.js",
|
|
8
8
|
"module": "build/index.js",
|
|
@@ -163,4 +163,4 @@
|
|
|
163
163
|
"publishConfig": {
|
|
164
164
|
"registry": "https://registry.npmjs.org/"
|
|
165
165
|
}
|
|
166
|
-
}
|
|
166
|
+
}
|