@tap-payments/os-micro-frontend-shared 0.1.111-test.2 → 0.1.112-test.2

package/build/components/ReceiptViewer/style.js

@@ -1,176 +0,0 @@
-import { Box, Input, Popover, Typography, styled } from '@mui/material';
-import { motion } from 'framer-motion';
-export const FOOTER_HEIGHT = 37;
-export const TITLE_BAR_HEIGHT = '32px';
-export const VIEWER_HEIGHT = 545;
-export const StyledPopover = styled(Popover)(({ theme }) => ({
-    backgroundColor: theme.palette.background.default,
-    boxShadow: theme.shadows[21],
-    '& .MuiPaper-root': {
-        borderRadius: '12px',
-    },
-}));
-export const HEADER_HEIGHT = 44;
-export const jsonTheme = {
-    '--w-rjv-color': '#9cdcfe',
-    '--w-rjv-key-string': '#357fb9',
-    '--w-rjv-background-color': '#ffffff',
-    '--w-rjv-line-color': '#ffffff',
-    '--w-rjv-arrow-color': '#116e6bed',
-    '--w-rjv-edit-color': '#9cdcfe',
-    '--w-rjv-info-color': '#9c9c9c7a',
-    '--w-rjv-update-color': '#FFE20B',
-    '--w-rjv-copied-color': '#9cdcfe',
-    '--w-rjv-copied-success-color': '#28a745',
-    '--w-rjv-curlybraces-color': '#000000',
-    '--w-rjv-colon-color': '#000000',
-    '--w-rjv-brackets-color': '#000000',
-    '--w-rjv-quotes-color': '#9cdcfe',
-    '--w-rjv-quotes-string-color': '#c27c46',
-    '--w-rjv-type-string-color': '#c27c46',
-    '--w-rjv-type-int-color': '#956ea5',
-    '--w-rjv-type-float-color': '#956ea5',
-    '--w-rjv-type-bigint-color': '#956ea5',
-    '--w-rjv-type-boolean-color': '#956ea5',
-    '--w-rjv-type-date-color': '#956ea5',
-    '--w-rjv-type-url-color': '#3b89cf',
-    '--w-rjv-type-null-color': '#956ea5',
-    '--w-rjv-type-nan-color': '#956ea5',
-    '--w-rjv-type-undefined-color': '#956ea5',
-    padding: '1rem',
-    height: `calc(100% - ${HEADER_HEIGHT + FOOTER_HEIGHT}px`,
-    overflow: 'auto',
-};
-export const requestJsonTheme = Object.assign(Object.assign({}, jsonTheme), { background: 'transparent', '--w-rjv-line-color': 'transparent' });
-export const StyledAnimatedButton = styled('button')(({ theme }) => ({
-    padding: '0rem',
-    borderRadius: '0.25rem',
-    backgroundColor: theme.palette.background.paper,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    gap: '0.25rem',
-    color: theme.palette.text.primary,
-    fontSize: '0.625rem',
-    fontWeight: theme.typography.fontWeightBold,
-    outline: 'none',
-    cursor: 'pointer',
-    border: `1px solid ${theme.palette.grey['100']}`,
-    '&:hover': {
-        boxShadow: '0px 0px 8px 0px rgba(31, 136, 208, 0.30)',
-        border: `1px solid ${theme.palette.info.dark};`,
-    },
-    position: 'relative',
-    overflow: 'hidden',
-    transition: 'all 0.2s ease-in-out',
-    width: '24px',
-    height: '24px',
-    flexShrink: 0,
-}));
-export const StyledCopyButton = styled('button')(({ theme }) => ({
-    outline: 'none',
-    cursor: 'pointer',
-    border: `1px solid transparent`,
-    '&:hover': {
-        boxShadow: theme.shadows[8],
-    },
-    borderRadius: '0.25rem',
-    position: 'relative',
-    backgroundColor: theme.palette.background.transparent,
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-export const StyledSearchInput = styled(Input)(({ theme }) => ({
-    border: `1px solid ${theme.palette.grey[100]}`,
-    borderRadius: '0.25rem',
-    padding: '0.375rem',
-    fontSize: '0.625rem',
-    outline: 'none',
-    width: '100%',
-    maxWidth: '150px',
-    height: '1.5rem',
-    backgroundColor: theme.palette.background.paper,
-    '&:focus': {
-        border: `1px solid ${theme.palette.info.dark}`,
-    },
-}));
-export const StyledTitle = styled(Typography)(() => ({
-    border: '1px solid rgba(242, 242, 242, 0.70);',
-    display: 'inline-flex',
-    height: '24px',
-    padding: '0px 8px',
-    justifyContent: 'center',
-    alignItems: 'center',
-    borderRadius: '37.5px',
-    backgroundColor: '#fff',
-}));
-export const SectionWrapper = styled(Box, {
-    shouldForwardProp: (prop) => !['isMaximized', 'isScrollingRequest', 'isRequestShown'].includes(prop),
-})(({ isScrollingRequest, isMaximized, isRequestShown, theme }) => (Object.assign(Object.assign({ display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: '4px', paddingBlock: '0px', paddingInlineStart: '12px', paddingInlineEnd: '12px', position: 'sticky', left: 0, right: 0, top: 0, background: '#fff', zIndex: 5 }, (isScrollingRequest && {
-    boxShadow: theme.shadows[23],
-})), (isMaximized && Object.assign({ paddingTop: TITLE_BAR_HEIGHT, transition: 'padding 0.3s ease-in-out' }, (isRequestShown && {
-    width: '50%',
-}))))));
-export const FooterWrapper = styled(Box, {
-    shouldForwardProp: (prop) => !['isMaximized', 'isRequestShown'].includes(prop),
-})(({ isMaximized, isRequestShown }) => (Object.assign({ display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: '8px', height: FOOTER_HEIGHT, position: 'fixed', bottom: 0, right: 0, left: isMaximized ? '50vw' : 0 }, (!isRequestShown && {
-    left: 0,
-}))));
-export const ButtonsWrapper = styled(Box)(() => ({
-    display: 'flex',
-    justifyContent: 'flex-end',
-    alignItems: 'center',
-    gap: '4px',
-    paddingBlock: '10px',
-    paddingInlineStart: '8px',
-    paddingInlineEnd: '0px',
-}));
-export const StyledHeaderWrapper = styled(Box)(() => ({
-    display: 'flex',
-    justifyContent: 'flex-start',
-    alignItems: 'center',
-    gap: '4px',
-    paddingBlock: '10px',
-    paddingInlineStart: '0px',
-    paddingInlineEnd: '12px',
-}));
-export const JSONViewerWrapper = styled(motion.div, {
-    shouldForwardProp: (prop) => !['isRequestShown', 'isMaximized'].includes(prop),
-})(({ isRequestShown, isMaximized }) => (Object.assign({ width: '100%', height: '100%', overflowY: 'auto', background: '#fff', zIndex: 20, position: 'relative', display: 'flex', flexDirection: 'column', borderBottomRightRadius: '12px', borderBottomLeftRadius: isRequestShown ? 0 : '12px' }, (isMaximized && {
-    borderBottomLeftRadius: 0,
-    borderBottomRightRadius: 0,
-    height: '100vh',
-}))));
-export const JSONViewerWrapperRequest = styled(motion.div, {
-    shouldForwardProp: (prop) => !['isMaximized', 'currentRequestWidth'].includes(prop),
-})(({ isMaximized, currentRequestWidth }) => ({
-    backgroundColor: '#E7E7E7B2',
-    backdropFilter: 'blur(12px)',
-    height: isMaximized ? '100vh' : '100%',
-    overflowY: 'auto',
-    position: 'absolute',
-    width: isMaximized ? '100vw' : currentRequestWidth,
-    zIndex: 19,
-    display: 'flex',
-    flexDirection: 'column',
-    borderBottomLeftRadius: '12px',
-}));
-export const JSONViewerScreenContainer = styled(Box, {
-    shouldForwardProp: (prop) => !['isMaximized', 'currentHeight'].includes(prop),
-})(({ isMaximized, currentHeight }) => ({
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'flex-start',
-    height: isMaximized ? `calc(100vh - ${FOOTER_HEIGHT}px)` : (currentHeight || VIEWER_HEIGHT) - FOOTER_HEIGHT + 5,
-    background: 'transparent',
-    position: 'fixed',
-    width: '100%',
-}));
-export const JSONContainer = styled(Box)(() => ({
-    position: 'fixed',
-    width: '100%',
-    background: 'transparent',
-    height: '100%',
-}));

package/build/components/ReceiptViewer/type.d.ts

@@ -1,22 +0,0 @@
-import type { HTMLAttributes, ReactNode } from 'react';
-export type ReceiptViewerProps = JsonViewer & {
-    index: number;
-    onClose: () => void;
-    isWindowMinimized?: boolean;
-    windowOrder?: number;
-};
-export interface AnimatedButtonProps extends HTMLAttributes<HTMLButtonElement> {
-    label?: ReactNode;
-    icon?: string;
-    disableAnimation?: boolean;
-}
-export type JsonViewer = {
-    json: Record<string, any>;
-    requestJson?: Record<string, any>;
-};
-export type ReceiptViewerContext = {
-    receiptViewerList: JsonViewer[];
-    handleReceiptViewerDialogOpen: (jsonViewer: JsonViewer) => void;
-    handleWindowMinimize: (value: boolean) => void;
-    handleWindowOrder: (value: number) => void;
-};

package/build/components/ReceiptViewer/type.js

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