@tap-payments/os-micro-frontend-shared 0.1.367-test.4 → 0.1.367-test.6

package/build/components/AppWindowWrapper/AppWindow/AppWindow.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { WindowProps } from './type';
-declare function Window({ children, titleBar, titleBarText, mainAppOrder, mainAppIsMinimized, showSectionsButton, rightActions }: WindowProps): import("react").ReactPortal;
+declare function Window({ children, titleBar, titleBarText, mainAppOrder, mainAppIsMinimized, showSectionsButton }: WindowProps): import("react").ReactPortal;
 declare const _default: import("react").MemoExoticComponent<typeof Window>;
 export default _default;

package/build/components/AppWindowWrapper/AppWindow/AppWindow.js

@@ -9,7 +9,7 @@ import { AppWindowContext } from '../context';
 import { isSafariBrowser } from '../../../utils/index.js';
 import { animationDuration } from './constant';
 import AccountHeader from '../headers/AccountHeader';
-function Window({ children, titleBar, titleBarText, mainAppOrder, mainAppIsMinimized, showSectionsButton = true, rightActions }) {
+function Window({ children, titleBar, titleBarText, mainAppOrder, mainAppIsMinimized, showSectionsButton = true }) {
     const windowNodeRef = useRef(null);
     const { dimensions, position, resizableRef, isMaximized, isOpen, onClose, viewerDefaultWidth, viewerDefaultHeight, windowZIndex, setPosition, setNewDimensions, isToolbarAnimationDisabled, fullWindowWidth, fullWindowHeight, setIsMaximized, setIsResized, isResized, setIsToolbarAnimationDisabled, setIsSidebarExpanded, isSidebarExpanded, } = useContext(AppWindowContext);
     const isSafari = isSafariBrowser();
@@ -77,6 +77,6 @@ function Window({ children, titleBar, titleBarText, mainAppOrder, mainAppIsMinim
                     position: 'relative',
                 })) }, { children: _jsxs(Box, Object.assign({ sx: {
                         height: '100%',
-                    }, "data-testid": "AppWindow" }, { children: [titleBar !== null && titleBar !== void 0 ? titleBar : (_jsx(AccountHeader, { setIsToolbarAnimationDisabled: setIsToolbarAnimationDisabled, onClose: onClose, setIsMaximized: setIsMaximized, isToolbarAnimationDisabled: isToolbarAnimationDisabled, setIsSidebarExpanded: setIsSidebarExpanded, isSidebarExpanded: isSidebarExpanded, title: titleBarText, isMaximized: isMaximized, showSectionsButton: showSectionsButton, rightActions: rightActions })), children] })) })) })) })), document.body);
+                    }, "data-testid": "AppWindow" }, { children: [titleBar !== null && titleBar !== void 0 ? titleBar : (_jsx(AccountHeader, { setIsToolbarAnimationDisabled: setIsToolbarAnimationDisabled, onClose: onClose, setIsMaximized: setIsMaximized, isToolbarAnimationDisabled: isToolbarAnimationDisabled, setIsSidebarExpanded: setIsSidebarExpanded, isSidebarExpanded: isSidebarExpanded, title: titleBarText, isMaximized: isMaximized, showSectionsButton: showSectionsButton })), children] })) })) })) })), document.body);
 }
 export default memo(Window);

package/build/components/AppWindowWrapper/AppWindow/type.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 export interface WindowProps {
     children: React.ReactNode;
     titleBar?: React.ReactNode;
@@ -6,5 +6,4 @@ export interface WindowProps {
     mainAppIsMinimized?: boolean;
     mainAppOrder?: number;
     showSectionsButton?: boolean;
-    rightActions?: ReactNode;
 }

package/build/components/AppWindowWrapper/headers/AccountHeader/AccountHeader.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { AccountHeaderProps } from './type';
-declare function AccountHeader({ isMaximized, setIsToolbarAnimationDisabled, setIsMaximized, onClose, isSidebarExpanded, setIsSidebarExpanded, isToolbarAnimationDisabled, title, showSectionsButton, rightActions, }: AccountHeaderProps): import("react/jsx-runtime").JSX.Element;
+declare function AccountHeader({ isMaximized, setIsToolbarAnimationDisabled, setIsMaximized, onClose, isSidebarExpanded, setIsSidebarExpanded, isToolbarAnimationDisabled, title, showSectionsButton, }: AccountHeaderProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof AccountHeader>;
 export default _default;

package/build/components/AppWindowWrapper/headers/AccountHeader/AccountHeader.js

@@ -4,7 +4,7 @@ import { motion } from 'framer-motion';
 import { useMouseState } from '../../../../hooks/index.js';
 import AccountHeaderTitle from './components/AccountHeaderTitle';
 import { animationDuration } from '../../AppWindow/constant';
-function AccountHeader({ isMaximized, setIsToolbarAnimationDisabled, setIsMaximized, onClose, isSidebarExpanded, setIsSidebarExpanded, isToolbarAnimationDisabled, title, showSectionsButton, rightActions, }) {
+function AccountHeader({ isMaximized, setIsToolbarAnimationDisabled, setIsMaximized, onClose, isSidebarExpanded, setIsSidebarExpanded, isToolbarAnimationDisabled, title, showSectionsButton, }) {
     const { isHovered, onMouseEnter, onMouseLeave } = useMouseState();
     return (_jsx(motion.div, Object.assign({ style: Object.assign({}, (isMaximized && {
             height: 0,
@@ -26,6 +26,6 @@ function AccountHeader({ isMaximized, setIsToolbarAnimationDisabled, setIsMaximi
             }, maximized: isMaximized, id: "draggable-dialog-title", onRequestClick: () => {
                 setIsToolbarAnimationDisabled === null || setIsToolbarAnimationDisabled === void 0 ? void 0 : setIsToolbarAnimationDisabled(false);
                 setIsSidebarExpanded(!isSidebarExpanded);
-            }, isSidebarExpanded: isSidebarExpanded, isHovered: isHovered, onMouseHover: onMouseEnter, onMouseLeave: onMouseLeave, rightActions: rightActions }) })));
+            }, isSidebarExpanded: isSidebarExpanded, isHovered: isHovered, onMouseHover: onMouseEnter, onMouseLeave: onMouseLeave }) })));
 }
 export default memo(AccountHeader);

package/build/components/AppWindowWrapper/headers/AccountHeader/components/AccountHeaderTitle/AccountHeaderTitle.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { AccountHeaderTitleProps } from './type';
-declare function AccountHeaderTitle({ title, onClose, onMaximize, maximized, id, onRequestClick, isSidebarExpanded, isHovered, onMouseHover, onMouseLeave, showSectionsButton, rightActions, }: Readonly<AccountHeaderTitleProps>): import("react/jsx-runtime").JSX.Element;
+declare function AccountHeaderTitle({ title, onClose, onMaximize, maximized, id, onRequestClick, isSidebarExpanded, isHovered, onMouseHover, onMouseLeave, showSectionsButton, }: Readonly<AccountHeaderTitleProps>): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof AccountHeaderTitle>;
 export default _default;

package/build/components/AppWindowWrapper/headers/AccountHeader/components/AccountHeaderTitle/AccountHeaderTitle.js

@@ -4,7 +4,7 @@ import Toolbar from '../../../../../Toolbar';
 import { StyledHeaderWrapperStyled } from '../../../../../Toolbar/style';
 import { CloseIcon, ExpandButton, MaximizeIcon } from '../../../../../ToolbarIcon';
 import { teamWindowIcon } from '../../../../../../constants/index.js';
-function AccountHeaderTitle({ title, onClose, onMaximize, maximized = false, id, onRequestClick, isSidebarExpanded = false, isHovered = false, onMouseHover, onMouseLeave, showSectionsButton, rightActions, }) {
-    return (_jsx(StyledHeaderWrapperStyled, Object.assign({ id: id, "data-testid": "UserTitleBar", maximized: maximized || false }, { children: _jsx(Toolbar, { onMouseEnter: onMouseHover, onMouseLeave: onMouseLeave, isMaximized: maximized, isHovered: isHovered, title: title, icon: teamWindowIcon, leftActions: _jsxs(_Fragment, { children: [_jsx(CloseIcon, { onClick: onClose }), _jsx(MaximizeIcon, { isMaximized: maximized, onClick: onMaximize }), showSectionsButton && (_jsx(ExpandButton, Object.assign({ onClick: onRequestClick, isExpanded: isSidebarExpanded, isHovered: isHovered }, { children: "Sections" })))] }), rightActions: rightActions }) })));
+function AccountHeaderTitle({ title, onClose, onMaximize, maximized = false, id, onRequestClick, isSidebarExpanded = false, isHovered = false, onMouseHover, onMouseLeave, showSectionsButton, }) {
+    return (_jsx(StyledHeaderWrapperStyled, Object.assign({ id: id, "data-testid": "UserTitleBar", maximized: maximized || false }, { children: _jsx(Toolbar, { onMouseEnter: onMouseHover, onMouseLeave: onMouseLeave, isMaximized: maximized, isHovered: isHovered, title: title, icon: teamWindowIcon, leftActions: _jsxs(_Fragment, { children: [_jsx(CloseIcon, { onClick: onClose }), _jsx(MaximizeIcon, { isMaximized: maximized, onClick: onMaximize }), showSectionsButton && (_jsx(ExpandButton, Object.assign({ onClick: onRequestClick, isExpanded: isSidebarExpanded, isHovered: isHovered }, { children: "Sections" })))] }) }) })));
 }
 export default memo(AccountHeaderTitle);

package/build/components/AppWindowWrapper/headers/AccountHeader/components/AccountHeaderTitle/type.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, SyntheticEvent } from 'react';
+import { SyntheticEvent } from 'react';
 import { BoxProps } from '@mui/material/Box';
 export interface AccountHeaderTitleProps extends BoxProps {
     title: string;
@@ -11,5 +11,4 @@ export interface AccountHeaderTitleProps extends BoxProps {
     isHovered?: boolean;
     onMouseHover?: (e: SyntheticEvent) => void;
     showSectionsButton?: boolean;
-    rightActions?: ReactNode;
 }

package/build/components/AppWindowWrapper/headers/AccountHeader/type.d.ts

@@ -1,4 +1,4 @@
-import { Dispatch, ReactNode, SetStateAction } from 'react';
+import { Dispatch, SetStateAction } from 'react';
 export interface AccountHeaderProps {
     isSidebarExpanded: boolean;
     setIsSidebarExpanded: (value: boolean) => void;
@@ -9,5 +9,4 @@ export interface AccountHeaderProps {
     onClose?: () => void;
     title?: string;
     showSectionsButton?: boolean;
-    rightActions?: ReactNode;
 }

package/build/components/Toaster/Toaster.d.ts

@@ -0,0 +1 @@
+export default function Toaster(): import("react/jsx-runtime").JSX.Element;

package/build/components/Toaster/Toaster.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { Toaster as HotToaster, resolveValue } from 'react-hot-toast';
+import { actionSuccessIcon, warningInfoIcon } from '../../constants/index.js';
+import { Content } from './style';
+const icons = {
+    success: actionSuccessIcon,
+    error: warningInfoIcon,
+};
+export default function Toaster() {
+    return (_jsx(HotToaster, { children: (t) => (_jsxs(Content, { children: [icons[t.type] && _jsx(Box, { component: "img", src: icons[t.type], alt: t.type }), _jsx(Box, { children: resolveValue(t.message, t) })] })) }));
+}

package/build/components/Toaster/index.d.ts

@@ -0,0 +1,2 @@
+import Toaster from './Toaster';
+export default Toaster;

package/build/components/Toaster/index.js

@@ -0,0 +1,2 @@
+import Toaster from './Toaster';
+export default Toaster;

package/build/components/Toolbar/Toolbar.js

@@ -15,6 +15,6 @@ import { ToolbarStyled, StyledBox, ActionsBox } from './style';
 import WindowAppIcon from '../WindowAppIcon';
 function Toolbar(_a) {
     var { onMouseEnter, onMouseLeave, isMaximized, isHovered, children, rightActions, leftActions, title, icon } = _a, props = __rest(_a, ["onMouseEnter", "onMouseLeave", "isMaximized", "isHovered", "children", "rightActions", "leftActions", "title", "icon"]);
-    return (_jsx(ToolbarStyled, Object.assign({ onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, maximized: isMaximized, id: "toolbar", isHovered: isHovered }, props, { children: _jsxs(StyledBox, Object.assign({ className: "toolbar-wrapper" }, { children: [leftActions ? _jsx(ActionsBox, Object.assign({ className: "action-box" }, { children: leftActions })) : _jsx("div", {}), _jsx(WindowAppIcon, { title: title, icon: icon }), rightActions ? _jsx(ActionsBox, Object.assign({ className: "action-box" }, { children: rightActions })) : _jsx("div", {})] })) })));
+    return (_jsx(ToolbarStyled, Object.assign({ onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, maximized: isMaximized, id: "toolbar", isHovered: isHovered }, props, { children: _jsxs(StyledBox, Object.assign({ className: "toolbar-wrapper" }, { children: [leftActions ? _jsx(ActionsBox, Object.assign({ className: "action-box" }, { children: leftActions })) : _jsx("div", {}), _jsx(WindowAppIcon, { title: title, icon: icon }), rightActions || _jsx("div", {})] })) })));
 }
 export default memo(Toolbar);

package/build/components/index.d.ts

@@ -50,7 +50,7 @@ export { default as MultiSelectDropdownButton, type ButtonWithDropdownProps } fr
 export { default as MultiSelectWithSearch, type MultiSelectWithSearchProps, ChildMenuItem, ParentMenuItem } from './MultiSelectWithSearch';
 export { default as NestedDropdown, type DropdownProps, type Selected, type Placement, Dropdown, NestedMenuItem } from './NestedDropdown';
 export { default as NoInternet } from './NoInternet';
-export { default as Notifications } from './Notifications';
+export { default as Toaster } from './Toaster';
 export { default as ProgressBar } from './ProgressBar';
 export { default as ProgressRing } from './ProgressRing';
 export * from './InputBase';

package/build/components/index.js

@@ -50,7 +50,7 @@ export { default as MultiSelectDropdownButton } from './MultiSelectDropdownButto
 export { default as MultiSelectWithSearch, ChildMenuItem, ParentMenuItem } from './MultiSelectWithSearch';
 export { default as NestedDropdown, Dropdown, NestedMenuItem } from './NestedDropdown';
 export { default as NoInternet } from './NoInternet';
-export { default as Notifications } from './Notifications';
+export { default as Toaster } from './Toaster';
 export { default as ProgressBar } from './ProgressBar';
 export { default as ProgressRing } from './ProgressRing';
 export * from './InputBase';

package/build/hooks/index.d.ts

@@ -13,3 +13,4 @@ export * from './useAppsInfo';
 export * from './useAppEventPublisher';
 export * from './useAppEventListener';
 export * from './useSelectedMerchantDetails';
+export * from './useToast';

package/build/hooks/index.js

@@ -13,3 +13,4 @@ export * from './useAppsInfo';
 export * from './useAppEventPublisher';
 export * from './useAppEventListener';
 export * from './useSelectedMerchantDetails';
+export * from './useToast';

package/build/hooks/useToast.d.ts

@@ -0,0 +1,12 @@
+import { ToastMessage } from '../types/index.js';
+import type { ToastOptions } from 'react-hot-toast';
+export interface ToastFunction {
+    (message: ToastMessage, options?: ToastOptions): string;
+    success: (message: ToastMessage, options?: ToastOptions) => string;
+    error: (message: ToastMessage, options?: ToastOptions) => string;
+    loading: (message: ToastMessage, options?: ToastOptions) => string;
+    custom: (message: ToastMessage, options?: ToastOptions) => string;
+    dismiss: (toastId?: string) => void;
+    remove: (toastId?: string) => void;
+}
+export declare function useToast(): ToastFunction;

package/build/hooks/useToast.js

@@ -0,0 +1,29 @@
+import { useMemo, useCallback } from 'react';
+import { useAppEventPublisher } from './index.js';
+import { AppEvent } from '../types/index.js';
+const generateToastId = () => crypto.randomUUID();
+export function useToast() {
+    const publish = useAppEventPublisher(AppEvent.OnToast);
+    const createToastByVariant = useCallback((variant) => (message, options) => {
+        var _a;
+        const id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : generateToastId();
+        publish({ action: 'show', variant, message, options: Object.assign(Object.assign({}, options), { id }) });
+        return id;
+    }, [publish]);
+    return useMemo(() => {
+        // base callable function
+        const toast = createToastByVariant('default');
+        // attach variants
+        toast.success = createToastByVariant('success');
+        toast.error = createToastByVariant('error');
+        toast.loading = createToastByVariant('loading');
+        toast.custom = createToastByVariant('custom');
+        toast.dismiss = (toastId) => {
+            publish({ action: 'dismiss', variant: 'dismiss', toastId });
+        };
+        toast.remove = (toastId) => {
+            publish({ action: 'remove', variant: 'remove', toastId });
+        };
+        return toast;
+    }, [createToastByVariant, publish]);
+}

package/build/types/appEvents.d.ts

@@ -1,4 +1,4 @@
-import { CalenderMode, NavigateFunction, TableMode, Timezone } from './index.js';
+import { CalenderMode, NavigateFunction, TableMode, Timezone, ToastEventPayload } from './index.js';
 import { DragControls } from 'framer-motion';
 export declare enum AppEvent {
     OnClickTableAction = "on-click-table-action",
@@ -10,6 +10,7 @@ export declare enum AppEvent {
     OnNavigate = "on-navigate",
     OnStartDrag = "on-start-drag",
     OnChangeAppToolbar = "on-change-app-toolbar",
+    OnToast = "on-toast",
     OnModifyRemotePayload = "on-modify-remote-payload"
 }
 /**
@@ -46,4 +47,5 @@ export type AppEventMap = {
         windowId: string;
         payload: object;
     }) => void;
+    [AppEvent.OnToast]: (params: ToastEventPayload) => void;
 };

package/build/types/appEvents.js

@@ -10,6 +10,7 @@ export var AppEvent;
     AppEvent["OnNavigate"] = "on-navigate";
     AppEvent["OnStartDrag"] = "on-start-drag";
     AppEvent["OnChangeAppToolbar"] = "on-change-app-toolbar";
+    AppEvent["OnToast"] = "on-toast";
     // Remote Events
     AppEvent["OnModifyRemotePayload"] = "on-modify-remote-payload";
 })(AppEvent || (AppEvent = {}));

package/build/types/index.d.ts

@@ -32,3 +32,4 @@ export * from './filter';
 export * from './utilities';
 export * from './reports';
 export * from './document';
+export * from './toast';

package/build/types/index.js

@@ -32,3 +32,4 @@ export * from './filter';
 export * from './utilities';
 export * from './reports';
 export * from './document';
+export * from './toast';

package/build/types/toast.d.ts

@@ -0,0 +1,16 @@
+import type { ToastOptions, ValueOrFunction, Renderable, Toast } from 'react-hot-toast';
+export type ToastMessage = ValueOrFunction<Renderable, Toast>;
+export type ToastEventPayload = {
+    action: 'show';
+    variant: 'default' | 'success' | 'error' | 'loading' | 'custom';
+    message: ToastMessage;
+    options?: ToastOptions;
+} | {
+    variant: 'dismiss';
+    action: 'dismiss';
+    toastId?: string;
+} | {
+    variant: 'remove';
+    action: 'remove';
+    toastId?: string;
+};

package/build/types/toast.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.367-test.4",
-  "testVersion": 4,
+  "version": "0.1.367-test.6",
+  "testVersion": 6,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",

package/build/components/Notifications/Notifications.d.ts

@@ -1 +0,0 @@
-export default function Notifications(): import("react/jsx-runtime").JSX.Element;

package/build/components/Notifications/Notifications.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Box from '@mui/material/Box';
-import { Toaster, resolveValue } from 'react-hot-toast';
-import { actionSuccessIcon, warningInfoIcon } from '../../constants/index.js';
-import { Content } from './style';
-const icons = {
-    success: actionSuccessIcon,
-    error: warningInfoIcon,
-};
-export default function Notifications() {
-    return (_jsx(Toaster, { children: (t) => (_jsxs(Content, { children: [icons[t.type] && _jsx(Box, { component: "img", src: icons[t.type], alt: t.type }), _jsx(Box, { children: resolveValue(t.message, t) })] })) }));
-}

package/build/components/Notifications/index.d.ts

@@ -1,2 +0,0 @@
-import Notifications from './Notifications';
-export default Notifications;

package/build/components/Notifications/index.js

@@ -1,2 +0,0 @@
-import Notifications from './Notifications';
-export default Notifications;