@tap-payments/os-micro-frontend-shared 0.0.246-test.1 → 0.0.246-test.3
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/AppWindowWrapper/headers/AppWindowHeader/AppWindowHeader.d.ts +5 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/AppWindowHeader.js +23 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/AppWindowHeaderBase.d.ts +5 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/AppWindowHeaderBase.js +20 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/index.d.ts +4 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/index.js +4 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/type.d.ts +21 -0
- package/build/components/AppWindowWrapper/headers/AppWindowHeader/type.js +1 -0
- package/build/components/AppWindowWrapper/index.d.ts +2 -0
- package/build/components/AppWindowWrapper/index.js +2 -0
- package/build/components/StatusButton/StatusButton.js +2 -2
- package/build/components/StatusButton/type.d.ts +0 -1
- package/build/components/Toolbar/style.d.ts +4 -4
- package/build/components/ToolbarIcon/MaximizeIcon/MaximizeIcon.d.ts +1 -1
- package/build/components/index.d.ts +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { AppWindowHeaderProps } from './type';
|
|
3
|
+
declare function AppWindowHeader({ isMaximized, id, isToolbarAnimationDisabled, title, leftActions, onClose, onMaximize }: AppWindowHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare const _default: import("react").MemoExoticComponent<typeof AppWindowHeader>;
|
|
5
|
+
export default _default;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
import { motion } from 'framer-motion';
|
|
4
|
+
import { useMouseState } from '../../../../hooks/index.js';
|
|
5
|
+
import { animationDuration } from '../../AppWindow/constant';
|
|
6
|
+
import AppWindowHeaderBase from './AppWindowHeaderBase';
|
|
7
|
+
import { CloseIcon, MaximizeIcon } from '../../../ToolbarIcon';
|
|
8
|
+
function AppWindowHeader({ isMaximized, id, isToolbarAnimationDisabled, title, leftActions, onClose, onMaximize }) {
|
|
9
|
+
const { isHovered, onMouseEnter, onMouseLeave } = useMouseState();
|
|
10
|
+
return (_jsx(motion.div, Object.assign({ style: Object.assign({}, (isMaximized && {
|
|
11
|
+
height: 0,
|
|
12
|
+
zIndex: 1000,
|
|
13
|
+
position: 'relative',
|
|
14
|
+
})), animate: Object.assign(Object.assign({}, (isMaximized && {
|
|
15
|
+
width: '100vw',
|
|
16
|
+
})), (!isMaximized && {
|
|
17
|
+
transform: 'translateX(0px)',
|
|
18
|
+
width: '100%',
|
|
19
|
+
})), transition: Object.assign({ duration: animationDuration }, (isToolbarAnimationDisabled && {
|
|
20
|
+
duration: 0,
|
|
21
|
+
})) }, { children: _jsx(AppWindowHeaderBase, { title: title, maximized: isMaximized, id: id || 'draggable-dialog-title', isHovered: isHovered, onMouseHover: onMouseEnter, onMouseLeave: onMouseLeave, leftActions: leftActions || (_jsxs(_Fragment, { children: [_jsx(CloseIcon, { onClick: onClose }), _jsx(MaximizeIcon, { isMaximized: isMaximized, onClick: () => onMaximize === null || onMaximize === void 0 ? void 0 : onMaximize(!isMaximized) })] })) }) })));
|
|
22
|
+
}
|
|
23
|
+
export default memo(AppWindowHeader);
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { AppWindowHeaderBaseProps } from './type';
|
|
3
|
+
declare function AppWindowHeaderBase({ title, maximized, id, isHovered, onMouseHover, onMouseLeave, leftActions, sandboxMode, titleIconSrc, ...rootProps }: AppWindowHeaderBaseProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare const _default: import("react").MemoExoticComponent<typeof AppWindowHeaderBase>;
|
|
5
|
+
export default _default;
|
|
@@ -0,0 +1,20 @@
|
|
|
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 { memo } from 'react';
|
|
14
|
+
import Toolbar from '../../../Toolbar';
|
|
15
|
+
import { StyledHeaderWrapperStyled } from '../../../Toolbar/style';
|
|
16
|
+
function AppWindowHeaderBase(_a) {
|
|
17
|
+
var { title, maximized = false, id, isHovered = false, onMouseHover, onMouseLeave, leftActions, sandboxMode = false, titleIconSrc } = _a, rootProps = __rest(_a, ["title", "maximized", "id", "isHovered", "onMouseHover", "onMouseLeave", "leftActions", "sandboxMode", "titleIconSrc"]);
|
|
18
|
+
return (_jsx(StyledHeaderWrapperStyled, Object.assign({ id: id, "data-testid": "UserTitleBar", maximized: maximized || false, sandboxMode: sandboxMode }, rootProps, { children: _jsx(Toolbar, { onMouseEnter: onMouseHover, onMouseLeave: onMouseLeave, isMaximized: maximized, isHovered: isHovered, title: title || '', icon: titleIconSrc, leftActions: leftActions }) })));
|
|
19
|
+
}
|
|
20
|
+
export default memo(AppWindowHeaderBase);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { StyledHeaderWrapperStyled, ToolbarProps } from '../../../Toolbar';
|
|
2
|
+
import { ReactNode, SyntheticEvent } from 'react';
|
|
3
|
+
export type AppWindowHeaderBaseProps = React.ComponentProps<typeof StyledHeaderWrapperStyled> & {
|
|
4
|
+
title?: string;
|
|
5
|
+
maximized?: boolean;
|
|
6
|
+
id?: string;
|
|
7
|
+
isHovered?: boolean;
|
|
8
|
+
onMouseHover?: (e: SyntheticEvent) => void;
|
|
9
|
+
onMouseLeave?: (e: SyntheticEvent) => void;
|
|
10
|
+
leftActions?: ToolbarProps['leftActions'];
|
|
11
|
+
titleIconSrc?: ToolbarProps['icon'];
|
|
12
|
+
};
|
|
13
|
+
export type AppWindowHeaderProps = {
|
|
14
|
+
id?: string;
|
|
15
|
+
isToolbarAnimationDisabled?: boolean;
|
|
16
|
+
isMaximized?: boolean;
|
|
17
|
+
title?: string;
|
|
18
|
+
leftActions?: ReactNode;
|
|
19
|
+
onClose?: () => void;
|
|
20
|
+
onMaximize?: (isMaximized: boolean) => void;
|
|
21
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import AppWindowWrapper from './AppWindowWrapper';
|
|
2
2
|
export { default as AppWindow, type WindowProps, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, FOOTER_HEIGHT, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindow';
|
|
3
3
|
export * from './headers/AccountHeader';
|
|
4
|
+
export * from './headers/AppWindowHeader';
|
|
5
|
+
export { default as AppWindowHeader } from './headers/AppWindowHeader';
|
|
4
6
|
export * from './context';
|
|
5
7
|
export type { AppWindowProps } from './type';
|
|
6
8
|
export default AppWindowWrapper;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import AppWindowWrapper from './AppWindowWrapper';
|
|
2
2
|
export { default as AppWindow, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, FOOTER_HEIGHT, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindow';
|
|
3
3
|
export * from './headers/AccountHeader';
|
|
4
|
+
export * from './headers/AppWindowHeader';
|
|
5
|
+
export { default as AppWindowHeader } from './headers/AppWindowHeader';
|
|
4
6
|
export * from './context';
|
|
5
7
|
export default AppWindowWrapper;
|
|
@@ -19,12 +19,12 @@ import { ChevronContainer, Label, LabelWrapper, StyledStatusIcon, StyledDropdown
|
|
|
19
19
|
import { statusButtonIcons } from './constant';
|
|
20
20
|
const StatusButton = memo((props) => {
|
|
21
21
|
var _a;
|
|
22
|
-
const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick
|
|
22
|
+
const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick"]);
|
|
23
23
|
const [buttonClicks, setButtonClicks] = useState(0);
|
|
24
24
|
const { t } = useTranslation();
|
|
25
25
|
const buttonRef = useRef(null);
|
|
26
26
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
27
|
-
const [selectedStatus, setSelectedStatus] = useState(
|
|
27
|
+
const [selectedStatus, setSelectedStatus] = useState((_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
|
|
28
28
|
const hasDropdown = useMemo(() => Boolean(dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.length), [dropdownOptions]);
|
|
29
29
|
const isDropdownOpen = Boolean(anchorEl) && buttonClicks > 1;
|
|
30
30
|
const isActiveVariant = variant === 'active';
|
|
@@ -13,7 +13,6 @@ export interface StatusButtonProps extends Omit<ButtonProps, 'variant' | 'childr
|
|
|
13
13
|
showDropdownIcon?: boolean;
|
|
14
14
|
totalCount?: number;
|
|
15
15
|
onButtonBodyClick?: (status: TableHeaderStatus) => void;
|
|
16
|
-
defaultSelectedStatus?: TableHeaderStatus;
|
|
17
16
|
dropdownOptions?: Array<MenuItemI & {
|
|
18
17
|
status: TableHeaderStatus;
|
|
19
18
|
}>;
|
|
@@ -9,8 +9,8 @@ export declare const StyledBox: import("@emotion/styled").StyledComponent<import
|
|
|
9
9
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
10
10
|
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
11
11
|
export declare const StyledHeaderWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
12
|
-
sandboxMode
|
|
13
|
-
maximized
|
|
12
|
+
sandboxMode?: boolean | undefined;
|
|
13
|
+
maximized?: boolean | undefined;
|
|
14
14
|
isDragging?: boolean | undefined;
|
|
15
15
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
16
16
|
export declare const ToolbarStyled: 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,7 +20,7 @@ export declare const ToolbarStyled: import("@emotion/styled").StyledComponent<im
|
|
|
20
20
|
isHovered?: boolean | undefined;
|
|
21
21
|
}, {}, {}>;
|
|
22
22
|
export declare const StyledHeaderWrapperStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
23
|
-
sandboxMode
|
|
24
|
-
maximized
|
|
23
|
+
sandboxMode?: boolean | undefined;
|
|
24
|
+
maximized?: boolean | undefined;
|
|
25
25
|
isDragging?: boolean | undefined;
|
|
26
26
|
} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, {}, {}>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { BoxProps } from '@mui/material/Box';
|
|
2
2
|
interface MaximizeIconProps extends BoxProps {
|
|
3
|
-
isMaximized
|
|
3
|
+
isMaximized?: boolean;
|
|
4
4
|
}
|
|
5
5
|
export declare function MaximizeIcon({ isMaximized, ...props }: MaximizeIconProps): import("react/jsx-runtime").JSX.Element;
|
|
6
6
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { default as AccordionAdapter } from './AccordionAdapter';
|
|
2
2
|
export { default as ActionMenu, ActionMenuDropDown, ActionMenuItem, type ActionMenuProps } from './ActionMenu';
|
|
3
3
|
export { default as ActivityAreaChart, type ActivityAreaChartProps, type ChartDataPoint, ChartTooltip, type ChartTooltipProps, LoadingChart, type PayloadItem, } from './ActivityAreaChart';
|
|
4
|
-
export { default as AppWindowWrapper, type AccountHeaderProps, AccountHeaderTitle, AppWindow, type AccountHeaderTitleProps, type AppWindowProps, type WindowProps, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindowWrapper';
|
|
4
|
+
export { default as AppWindowWrapper, type AccountHeaderProps, AccountHeaderTitle, type AppWindowHeaderProps, type AppWindowHeaderBaseProps, AppWindow, type AccountHeaderTitleProps, type AppWindowProps, type WindowProps, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindowWrapper';
|
|
5
5
|
export { default as BackgroundAnimation, type BlobGradient, type Blob } from './BackgroundAnimation';
|
|
6
6
|
export { default as Button, PlusButton, StyledButton } from './Button';
|
|
7
7
|
export { default as Calender, type CalenderProps, type DateObject } from './Calender';
|
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.0.246-test.
|
|
5
|
-
"testVersion":
|
|
4
|
+
"version": "0.0.246-test.3",
|
|
5
|
+
"testVersion": 3,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "build/index.js",
|
|
8
8
|
"module": "build/index.js",
|