@tap-payments/os-micro-frontend-shared 0.1.440 → 0.1.441

package/build/components/LabeledIconDropdown/LabeledIconDropdown.js

@@ -1,51 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { memo, useState, useRef, useLayoutEffect } from 'react';
-import Box from '@mui/material/Box';
-import { blackRightArrowIcon, blueZigzagCheckIcon, downArrowIcon3 } from '../../constants/index.js';
-import CustomBackdrop from '../CustomBackdrop';
-import { ClickAwayListener, Typography } from '@mui/material';
-import Menu from '../Menu';
-import { ClickAwayWrapper, MainContainer, ValueContentWrapper, LabelTypography, CheckmarkIcon, BadgeBox, BadgeTypography, ArrowDividerContainer, ArrowIconBox, MenuItemBox, MenuItemLabel, FlagIcon, } from './style';
-function LabeledIconDropdown({ items = [], onChange, isDisabled, isArrowRight, selectedItem, flagIcon }) {
-    const [anchorEl, setAnchorEl] = useState(null);
-    const [containerWidth, setContainerWidth] = useState(undefined);
-    const mainContainerRef = useRef(null);
-    const open = Boolean(anchorEl);
-    const onOpenDropdown = (event) => {
-        if (!open && !isDisabled)
-            setAnchorEl(event.currentTarget);
-    };
-    const onCloseDropdown = () => {
-        if (open)
-            setAnchorEl(null);
-    };
-    const selectItem = (item) => {
-        onChange === null || onChange === void 0 ? void 0 : onChange(item);
-        onCloseDropdown();
-    };
-    useLayoutEffect(() => {
-        if (mainContainerRef.current) {
-            setContainerWidth(mainContainerRef.current.offsetWidth);
-        }
-    }, [items, selectedItem]);
-    return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onCloseDropdown }, { children: _jsxs(ClickAwayWrapper, Object.assign({ onClick: onOpenDropdown, sx: { opacity: isDisabled ? 0.5 : 1, cursor: isDisabled || (items === null || items === void 0 ? void 0 : items.length) < 1 ? 'auto' : 'pointer' } }, { children: [_jsxs(MainContainer, Object.assign({ ref: mainContainerRef, isAvailable: (items === null || items === void 0 ? void 0 : items.length) > 0, open: open }, { children: [flagIcon && _jsx(FlagIcon, { src: flagIcon }), !(items === null || items === void 0 ? void 0 : items.length) ? (_jsx(Typography, Object.assign({ sx: {
-                                fontWeight: 400,
-                                fontSize: 14,
-                                lineHeight: '120%',
-                                letterSpacing: 0,
-                                color: '#B1B1B1',
-                            } }, { children: "Not Available" }))) : (_jsxs(ValueContentWrapper, { children: [_jsx(LabelTypography, { children: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label }), _jsx(CheckmarkIcon, { src: blueZigzagCheckIcon })] })), (items === null || items === void 0 ? void 0 : items.length) > 1 && (_jsx(BadgeBox, { children: _jsxs(BadgeTypography, { children: ["+", (items === null || items === void 0 ? void 0 : items.length) ? items === null || items === void 0 ? void 0 : items.length : 0] }) })), (items === null || items === void 0 ? void 0 : items.length) > 1 && (_jsx(ArrowDividerContainer, Object.assign({ open: open }, { children: isArrowRight ? (_jsx(Box, { component: "img", height: 10, src: blackRightArrowIcon, alt: "arrow-right" })) : (_jsx(ArrowIconBox, { open: open, src: downArrowIcon3, alt: "arrow-down" })) })))] })), (items === null || items === void 0 ? void 0 : items.length) > 1 && (_jsxs(_Fragment, { children: [open && _jsx(CustomBackdrop, { onClick: onCloseDropdown }), _jsx(Menu, Object.assign({ anchorEl: anchorEl, open: open, sx: {
-                                padding: '4px',
-                                width: containerWidth,
-                                marginTop: '4.5px',
-                                borderRadius: 1,
-                                boxShadow: '0px 8px 30px 0px #00000029',
-                                maxHeight: '128px',
-                                overflowY: 'auto',
-                            }, placement: "bottom-end" }, { children: _jsx(Box, Object.assign({ sx: {
-                                    display: 'flex',
-                                    flexDirection: 'column',
-                                    gap: '4px',
-                                } }, { children: items === null || items === void 0 ? void 0 : items.map((item) => (_jsxs(MenuItemBox, Object.assign({ onClick: () => selectItem(item) }, { children: [_jsx(MenuItemLabel, { children: item.label }), _jsx(CheckmarkIcon, { src: item.icon })] }), item.label))) })) }))] }))] })) })));
-}
-export default memo(LabeledIconDropdown);

package/build/components/LabeledIconDropdown/style.js

@@ -1,104 +0,0 @@
-import { styled } from '@mui/material/styles';
-import Box from '@mui/material/Box';
-import Typography from '@mui/material/Typography';
-export const ClickAwayWrapper = styled(Box)(() => ({
-    cursor: 'pointer',
-}));
-export const MainContainer = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'open' && prop !== 'isAvailable',
-})(({ theme, open, isAvailable }) => ({
-    display: 'flex',
-    justifyContent: isAvailable ? 'flex-start' : 'center',
-    alignItems: 'center',
-    minWidth: '130px',
-    gap: '2.63px',
-    height: '24px',
-    borderRadius: '44px',
-    padding: '2.5px 8px',
-    paddingRight: theme.spacing(0.5),
-    border: `1.03px solid ${open ? '#1F88D0' : '#F2F2F2'}`,
-    position: 'relative',
-}));
-export const ValueContentWrapper = styled(Box)(({ theme }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    gap: theme.spacing(0.5),
-}));
-export const LabelTypography = styled(Typography)(() => ({
-    fontWeight: 400,
-    fontSize: 14,
-    height: '17px',
-    lineHeight: '120%',
-    letterSpacing: 0,
-    color: '#20232B',
-    maxWidth: '80px',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-}));
-export const CheckmarkIcon = styled('img')(() => ({
-    width: 12,
-    height: 12,
-}));
-export const BadgeBox = styled(Box)(({ theme }) => ({
-    minWidth: 17.13,
-    height: 12,
-    borderRadius: '4px',
-    paddingTop: '1.28px',
-    paddingRight: '2.57px',
-    paddingBottom: '1.28px',
-    paddingLeft: '2.57px',
-    marginLeft: '4px',
-    marginRight: '5.5px',
-    backgroundColor: '#8D8D94',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    color: theme.palette.common.white,
-}));
-export const BadgeTypography = styled(Typography)(() => ({
-    fontWeight: 600,
-    fontSize: 9.5,
-}));
-export const ArrowDividerContainer = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'open',
-})(({ open }) => ({
-    borderLeft: `1px solid ${open ? '#1F88D0' : '#F2F2F2'}`,
-    position: 'relative',
-    zIndex: 1,
-    height: '24px',
-    width: '24px',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-export const ArrowIconBox = styled('img', {
-    shouldForwardProp: (prop) => prop !== 'open',
-})(({ open }) => (Object.assign({ transition: 'transform 0.2s ease-in-out' }, (open && { transform: 'rotate(180deg)' }))));
-export const MenuItemBox = styled(Box)(({ theme }) => ({
-    paddingTop: '5px',
-    paddingRight: '4px',
-    paddingBottom: '5px',
-    paddingLeft: '4px',
-    cursor: 'pointer',
-    position: 'relative',
-    display: 'flex',
-    alignItems: 'center',
-    gap: theme.spacing(0.5),
-}));
-export const MenuItemLabel = styled(Typography)(() => ({
-    fontWeight: 400,
-    fontSize: 14,
-    height: '17px',
-    lineHeight: '120%',
-    letterSpacing: 0,
-    color: '#20232B',
-    maxWidth: '80px',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-}));
-export const FlagIcon = styled('img')(() => ({
-    width: 16,
-    height: 12,
-}));

package/build/components/LanguageDropdown/LanguageDropdown.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import Box from '@mui/material/Box';
-import ClickAwayListener from '@mui/material/ClickAwayListener';
-import { Menu, MenuItem } from '../index.js';
-import { Button } from './style';
-const languages = ['EN', 'AR'];
-export default function LanguageDropdown({ defaultLanguage = 'EN', onChange }) {
-    const [language, setLanguage] = useState(defaultLanguage);
-    const [anchorEl, setAnchorEl] = useState(null);
-    const open = Boolean(anchorEl);
-    const onOpen = (event) => {
-        setAnchorEl(event.currentTarget);
-    };
-    const onCLose = () => {
-        setAnchorEl(null);
-    };
-    const onClick = (lang) => {
-        setLanguage(lang);
-        onChange === null || onChange === void 0 ? void 0 : onChange(lang);
-        onCLose();
-    };
-    return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onCLose }, { children: _jsxs(Box, { children: [_jsx(Button, Object.assign({ onClick: onOpen, open: open }, { children: _jsx(Box, Object.assign({ component: "span" }, { children: language })) })), _jsx(Menu, Object.assign({ open: open, anchorEl: anchorEl, sx: { marginTop: '8px', marginBottom: '8px', width: 31.8 } }, { children: languages.map((lang) => lang !== language && (_jsx(MenuItem, Object.assign({ onClick: () => onClick(lang), hideCheckbox: true }, { children: lang }), lang))) }))] }) })));
-}

package/build/components/LanguageDropdown/style.js

@@ -1,5 +0,0 @@
-import Box from '@mui/material/Box';
-import { styled } from '@mui/material/styles';
-export const Button = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ backgroundColor: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, fontSize: '11px', color: theme.palette.text.primary, padding: '8px', borderRadius: '4px', display: 'flex', alignItems: 'center', height: 32, gap: '4px', cursor: 'pointer' }, (open && {
-    borderColor: theme.palette.info.dark,
-}))));

package/build/components/LazyImage/LazyImage.js

@@ -1,39 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { LazyLoadImage as RawLazyLoadImage } from 'react-lazy-load-image-component';
-const LazyLoadImage = RawLazyLoadImage;
-const EFFECT_ASSETS_MAPPER = {
-    opacity: () => import('react-lazy-load-image-component/src/effects/opacity.css'),
-    blur: () => import('react-lazy-load-image-component/src/effects/blur.css'),
-    'black-and-white': () => import('react-lazy-load-image-component/src/effects/black-and-white.css'),
-};
-const LazyImage = (props) => {
-    const { wrapperProps } = props, rest = __rest(props, ["wrapperProps"]);
-    const { effect } = rest;
-    const { style } = wrapperProps || {};
-    const [cssEffectAssetsLoading, setCssEffectAssetsLoading] = useState(!!effect);
-    useEffect(() => {
-        if (!effect || !(effect in EFFECT_ASSETS_MAPPER))
-            return;
-        const getResources = EFFECT_ASSETS_MAPPER[effect];
-        setCssEffectAssetsLoading(true);
-        getResources().finally(() => {
-            setCssEffectAssetsLoading(false);
-        });
-    }, [effect]);
-    if (cssEffectAssetsLoading)
-        return null;
-    return (_jsx(LazyLoadImage, Object.assign({}, rest, { wrapperProps: Object.assign(Object.assign({}, wrapperProps), { style: Object.assign({ display: 'flex', justifyContent: 'center', alignItems: 'center' }, style) }) })));
-};
-export default LazyImage;

package/build/components/LeftPeekRightExpandingChip/LeftPeekRightExpandingChip.js

@@ -1,30 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Box from '@mui/material/Box';
-import { AnimatePresence } from 'framer-motion';
-import { Root, Container, PeekStack, PeekChip, MainChip, tableCellSx } from './style';
-import { useLeftPeekRightExpandingChip } from './useLeftPeekRightExpandingChip';
-/**
- * LeftPeekRightExpandingChip
- *
- * Renders the last item of `icons` in a main chip and the remaining items as a vertical,
- * left‑aligned peek stack (collapsed to 24px). Hovering the main chip reveals and expands
- * the peek chips to the right and shifts the main chip accordingly. The top‑most peek chip
- * stays anchored while the rest slide out to the right preserving the original order.
- * Uses Framer Motion for smooth enter/leave and x‑translation, with z-index control via `expandedZIndex`.
- * Peek chip content is rendered only on hover to minimize layout work.
- */
-export default function LeftPeekRightExpandingChip({ icons = [], expandedZIndex = 1000, sx }) {
-    const { handleMouseEnter, handleRootMouseLeave, rootRef, mainChipRef, isHovering, peekItems, mainShiftX, mainIcon } = useLeftPeekRightExpandingChip({ icons });
-    return (_jsx(Box, Object.assign({ sx: Object.assign(Object.assign({}, tableCellSx), sx), "data-testid": "LeftPeekRightExpandingChipBox" }, { children: _jsx(Root, Object.assign({ ref: rootRef, onMouseLeave: handleRootMouseLeave, onMouseEnter: handleMouseEnter }, { children: _jsxs(Container, Object.assign({ "data-testid": "Container", initial: false }, { children: [_jsx(PeekStack, Object.assign({ "data-testid": "PeekStack", 
-                        // Allow the expanded chips area to keep hover active
-                        onMouseEnter: handleMouseEnter, onMouseLeave: handleRootMouseLeave, style: { pointerEvents: isHovering ? 'auto' : 'none' } }, { children: _jsx(AnimatePresence, Object.assign({ initial: false }, { children: peekItems.map(({ key, rIdx, offX, hoverX, zIndex, refCb, content }) => (_jsx(PeekChip, Object.assign({ "data-testid": `LeftPeekChip-${rIdx}`, ref: refCb, initial: { opacity: 0, scale: 0.95, x: offX, y: 0 }, animate: { opacity: 1, scale: 1, x: isHovering ? hoverX : offX, y: 0 }, exit: { opacity: 0, scale: 0.95, x: offX, y: 0 }, transition: { duration: 0.18, ease: 'easeOut' }, style: {
-                                    zIndex,
-                                    width: isHovering ? 'auto' : 24,
-                                    minWidth: 24,
-                                    padding: isHovering ? '0 6px' : 0,
-                                    whiteSpace: 'nowrap',
-                                    overflow: isHovering ? 'visible' : 'hidden',
-                                    // Make the expanded chip area interactive to preserve hover
-                                    pointerEvents: isHovering ? 'auto' : 'none',
-                                } }, { children: isHovering && _jsx(_Fragment, { children: content }) }), key))) })) })), _jsx(MainChip, Object.assign({ "data-testid": "MainChip", ref: mainChipRef, style: { zIndex: expandedZIndex + 10, padding: '0 6px' }, initial: false, animate: { x: isHovering ? mainShiftX : 0 }, transition: { duration: 0.18, ease: 'easeOut' } }, { children: mainIcon }))] })) })) })));
-}

package/build/components/LeftPeekRightExpandingChip/style.js

@@ -1,65 +0,0 @@
-import { styled } from '@mui/material/styles';
-import { motion } from 'framer-motion';
-export const CHIP_GAP = 3;
-export const DEFAULT_CHIP_MIN_WIDTH = 24;
-export const Root = styled('div')(() => ({
-    position: 'relative',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-export const Container = styled(motion.div)(() => ({
-    position: 'relative',
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-export const PeekStack = styled('div')(() => ({
-    position: 'relative',
-    display: 'inline-block',
-    width: 0,
-    height: 24,
-    pointerEvents: 'none',
-}));
-export const PeekChip = styled(motion.div)(({ theme }) => ({
-    border: `1px solid ${theme.palette.divider}`,
-    borderRadius: 12,
-    // width controlled in component to switch between 24 and auto
-    height: 24,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    background: theme.palette.background.paper,
-    fontSize: 12,
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    boxSizing: 'border-box',
-    whiteSpace: 'nowrap',
-    lineHeight: 1,
-    transition: 'width 180ms ease-out, padding 180ms ease-out',
-}));
-export const MainChip = styled(motion.div)(({ theme }) => ({
-    border: `1px solid ${theme.palette.divider}`,
-    borderRadius: 12,
-    height: 24,
-    minWidth: 24,
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    background: theme.palette.background.paper,
-    overflow: 'hidden',
-    position: 'relative',
-    boxSizing: 'border-box',
-    whiteSpace: 'nowrap',
-    fontSize: 12,
-    lineHeight: 1,
-}));
-export const tableCellSx = {
-    position: 'relative',
-    overflow: 'visible',
-    zIndex: 1,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-};

package/build/components/LeftPeekRightExpandingChip/type.js

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

package/build/components/LeftPeekRightExpandingChip/useLeftPeekRightExpandingChip.js

@@ -1,134 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { CHIP_GAP, DEFAULT_CHIP_MIN_WIDTH } from './style';
-export function useLeftPeekRightExpandingChip({ icons }) {
-    var _a;
-    // ======================
-    // State
-    // ======================
-    const [isHovering, setIsHovering] = useState(false);
-    const [rightWidths, setRightWidths] = useState([]);
-    // ======================
-    // Refs (DOM and timers)
-    // ======================
-    const rootRef = useRef(null);
-    const mainChipRef = useRef(null);
-    const rightChipRefs = useRef([]);
-    const hoverTimeoutRef = useRef(null);
-    // Prepare icons: last is MainChip, the rest are peeks
-    const safeIcons = icons !== null && icons !== void 0 ? icons : [];
-    const lastIndex = Math.max(0, ((_a = safeIcons.length) !== null && _a !== void 0 ? _a : 1) - 1);
-    const mainIcon = safeIcons[lastIndex];
-    const peekIcons = safeIcons.slice(0, lastIndex);
-    // ======================
-    // Computed values
-    // ======================
-    const { peekItems, mainShiftX, guardLeft, guardWidth } = useMemo(() => {
-        const n = peekIcons.length;
-        const measured = rightWidths.length === n && rightWidths.every((w) => w > 0);
-        // Anchor stacked offset for all peeks
-        const anchorOffXAll = -6 * n;
-        const totalPeekWidth = measured ? rightWidths.reduce((acc, w) => acc + w, 0) : n * DEFAULT_CHIP_MIN_WIDTH;
-        const gapsTotal = Math.max(0, n - 1) * CHIP_GAP;
-        const mainShift = Math.round(isHovering ? anchorOffXAll + totalPeekWidth + CHIP_GAP * n : 0);
-        const anchorRIdx = n - 1;
-        const anchorOffXEach = -6 * (anchorRIdx + 1);
-        const items = [];
-        for (let rIdx = 0; rIdx < n; rIdx++) {
-            const origIdx = n - 1 - rIdx;
-            const offX = -6 * (rIdx + 1);
-            const cumWidthBefore = measured
-                ? rightWidths.slice(0, origIdx).reduce((acc, w) => acc + w, 0) + CHIP_GAP * origIdx
-                : (DEFAULT_CHIP_MIN_WIDTH + CHIP_GAP) * origIdx;
-            const hoverX = Math.round(rIdx === anchorRIdx ? anchorOffXEach : anchorOffXEach + cumWidthBefore);
-            items.push({
-                key: `peek-${rIdx}`,
-                rIdx,
-                origIdx,
-                offX,
-                hoverX,
-                zIndex: n - rIdx,
-                refCb: (el) => {
-                    rightChipRefs.current[origIdx] = el;
-                },
-                content: peekIcons[origIdx],
-            });
-        }
-        // Guard box covers the full horizontal span of the expanded peeks
-        const guardLeft = anchorOffXEach;
-        const guardWidth = totalPeekWidth + gapsTotal;
-        return { peekItems: items, mainShiftX: mainShift, guardLeft, guardWidth };
-    }, [peekIcons, rightWidths, isHovering]);
-    // ======================
-    // Callbacks
-    // ======================
-    const clearHoverTimeout = useCallback(() => {
-        if (hoverTimeoutRef.current) {
-            clearTimeout(hoverTimeoutRef.current);
-            hoverTimeoutRef.current = null;
-        }
-    }, []);
-    const measureRightWidths = useCallback(() => {
-        const TARGET_PADDING_X = 12; /* 6px each side when expanded */
-        const BORDER_X = 2; /* 1px each side */
-        const next = peekIcons.map((_, origIdx) => {
-            const el = rightChipRefs.current[origIdx];
-            if (!el)
-                return DEFAULT_CHIP_MIN_WIDTH;
-            const contentWidth = el.scrollWidth || DEFAULT_CHIP_MIN_WIDTH;
-            const target = Math.max(DEFAULT_CHIP_MIN_WIDTH, contentWidth + TARGET_PADDING_X + BORDER_X);
-            return Math.ceil(target);
-        });
-        setRightWidths((prev) => {
-            if (prev.length === next.length && prev.every((v, i) => v === next[i]))
-                return prev;
-            return next;
-        });
-    }, [peekIcons.length]);
-    const handleMouseEnter = useCallback(() => {
-        clearHoverTimeout();
-        setIsHovering(true);
-    }, [clearHoverTimeout]);
-    const handleRootMouseLeave = useCallback(() => {
-        clearHoverTimeout();
-        hoverTimeoutRef.current = setTimeout(() => setIsHovering(false), 120);
-    }, [clearHoverTimeout]);
-    // ======================
-    // Effects
-    // ======================
-    useEffect(() => {
-        return () => clearHoverTimeout();
-    }, [clearHoverTimeout]);
-    // Measure initially and when count changes
-    useEffect(() => {
-        measureRightWidths();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [peekIcons.length]);
-    // Re-measure shortly after hover begins to capture dynamic size
-    useEffect(() => {
-        if (!isHovering)
-            return;
-        const id = window.requestAnimationFrame(() => {
-            measureRightWidths();
-        });
-        return () => window.cancelAnimationFrame(id);
-    }, [isHovering, measureRightWidths]);
-    // ======================
-    // Public API
-    // ======================
-    return {
-        // hover state/handlers
-        isHovering,
-        handleMouseEnter,
-        handleRootMouseLeave,
-        // refs
-        rootRef,
-        mainChipRef,
-        // render data
-        peekItems,
-        mainShiftX,
-        mainIcon,
-        // guard for hover persistence over gaps
-        guardLeft,
-        guardWidth,
-    };
-}

package/build/components/ListColumnFilter/ListColumnFilter.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useTranslation } from 'react-i18next';
-import { useMemo } from 'react';
-import { Box } from '@mui/material';
-import { SearchListInput, FilterTitle, FilterOkayButton, FilterFooter, FilterCancelButton } from '../index.js';
-import { FilterMenu, Container, ListColumnFilterID, ListColumnFilterMenuItem, ListColumnFilterName, ListColumnFilterWrapper } from './style';
-export default function ListColumnFilter({ anchorEl, onCloseDropdown, list, apiKey, placeholder, onConfirm, onClear, onClickItem, inputValue, onInputValueChange, selectedListItems, }) {
-    const { t } = useTranslation();
-    const handleOkButtonClick = (e) => {
-        onConfirm();
-        onCloseDropdown(e);
-    };
-    const onCancel = (e) => {
-        onClear();
-        onCloseDropdown(e);
-    };
-    const isInputHasValue = !!inputValue.trim().length;
-    const onClickResetInput = () => {
-        if (isInputHasValue)
-            onInputValueChange('');
-    };
-    const onChangeInput = (value) => {
-        onInputValueChange(value);
-    };
-    // filter the list based on input value
-    const filteredList = useMemo(() => {
-        if (!isInputHasValue)
-            return list;
-        return list === null || list === void 0 ? void 0 : list.filter((item) => item.name.toLowerCase().includes(inputValue.trim().toLowerCase()));
-    }, [inputValue, isInputHasValue, list]);
-    const noListDataAvailable = (isInputHasValue && !filteredList.length) || !list.length;
-    const selectedSet = useMemo(() => new Set(selectedListItems), [selectedListItems]);
-    return (_jsxs(FilterMenu, Object.assign({ open: !!anchorEl, anchorEl: anchorEl }, { children: [_jsx(FilterTitle, Object.assign({ component: "span" }, { children: t('filterBy') })), !!(list === null || list === void 0 ? void 0 : list.length) && (_jsx(SearchListInput, { value: inputValue, name: apiKey, placeholder: placeholder, onSearchChange: onChangeInput, onSearchReset: onClickResetInput })), _jsx(Container, { children: !noListDataAvailable ? (filteredList === null || filteredList === void 0 ? void 0 : filteredList.map((item, index) => (_jsx(ListColumnFilterMenuItem, Object.assign({ isSelected: selectedSet.has(item === null || item === void 0 ? void 0 : item.id), onClick: () => {
-                        onClickItem(item === null || item === void 0 ? void 0 : item.id);
-                    } }, { children: _jsxs(ListColumnFilterWrapper, { children: [_jsx(ListColumnFilterName, { children: item.name }), _jsx(ListColumnFilterID, Object.assign({ component: "span" }, { children: item.id }))] }) }), `${item.id}-${index}`)))) : (_jsx(Box, Object.assign({ sx: { p: 1, textAlign: 'center', fontSize: '11px' } }, { children: "No data available" }))) }), _jsxs(FilterFooter, { children: [_jsx(FilterCancelButton, Object.assign({ onClick: onCancel }, { children: t('cancel') })), _jsx(FilterOkayButton, Object.assign({ onClick: handleOkButtonClick }, { children: t('okay') }))] })] })));
-}

package/build/components/ListColumnFilter/style.js

@@ -1,35 +0,0 @@
-import { styled, alpha } from '@mui/material/styles';
-import Box from '@mui/material/Box';
-import { Menu, MenuItem } from '../index.js';
-export const Container = styled(Box)(() => ({
-    maxHeight: '210px',
-    maxWidth: '177px',
-    overflowY: 'auto',
-    padding: 0,
-}));
-export const ListColumnFilterMenuItem = styled(MenuItem)(() => ({
-    padding: '12px 16px',
-    border: 'none !important',
-    '&:hover': { boxShadow: '0px 0px 16px 0px #00000021' },
-    maxHeight: 35,
-    minHeight: 35,
-}));
-export const ListColumnFilterWrapper = styled(Box)(() => ({
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '2px',
-}));
-export const ListColumnFilterID = styled(Box)(({ theme }) => ({
-    color: alpha(theme.palette.text.primary, 0.5),
-    fontSize: '9px',
-}));
-export const ListColumnFilterName = styled(Box)(() => ({
-    fontSize: '11px',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-    maxWidth: '120px',
-}));
-export const FilterMenu = styled(Menu)(() => ({
-    marginBottom: '8px',
-}));

package/build/components/ListLayout/ListLayout.js

@@ -1,20 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import { ListLayoutStyled } from './styles';
-function ListLayout(_a) {
-    var { children } = _a, props = __rest(_a, ["children"]);
-    return (_jsx(ListLayoutStyled, Object.assign({ component: "article", "data-testid": "ListLayout" }, props, { children: children })));
-}
-ListLayout.displayName = 'ListLayout';
-export default memo(ListLayout);

package/build/components/ListLayout/styles.js

@@ -1,9 +0,0 @@
-import Box from '@mui/material/Box';
-import { styled } from '@mui/material/styles';
-export const ListLayoutStyled = styled(Box)(() => ({
-    flex: 1,
-    position: 'relative',
-    display: 'flex',
-    flexDirection: 'column',
-    height: '100%',
-}));

package/build/components/Loader/Loader.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import { CustomLoader } from './style';
-function Loader(props) {
-    return _jsx(CustomLoader, Object.assign({}, props));
-}
-export default memo(Loader);

package/build/components/Loader/style.js

@@ -1,15 +0,0 @@
-import { styled, CircularProgress } from '@mui/material';
-export const CustomLoader = styled(CircularProgress)(() => ({
-    width: '24px !important',
-    height: '24px !important',
-    padding: '5px',
-    '.MuiCircularProgress-root': {
-        width: '14px !important',
-        height: '14px !important',
-        display: 'flex',
-    },
-    '.MuiCircularProgress-circle': {
-        strokeWidth: '1.017px',
-        stroke: 'rgba(0, 0, 0, 0.62)',
-    },
-}));

package/build/components/Loaders/TapLoader.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { styled } from '@mui/material/styles';
-const loaderContainerStyle = {
-    width: '100px',
-    height: '100px',
-    display: 'block',
-    position: 'relative',
-    margin: 'auto',
-};
-const svgBoxLoaderStyle = {
-    width: '100%',
-    height: '100%',
-    position: 'absolute',
-    margin: '0',
-    left: '0',
-    right: '0',
-};
-const Container = styled('div')(() => ({
-    width: '100%',
-    height: '100%',
-    display: 'flex',
-    flexGrow: 1,
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-export default function TapLoader({ outerColor = '#423e3c', innerColor = '#423e3c', duration = 3, toggleAnimation = true, size = 50, style = { width: '100px', height: '100px', display: 'block', position: 'relative', margin: 'auto' }, containerSx, }) {
-    const scaleStyle = size && { transform: `scale(${size / 40.0})` };
-    return (_jsx(Container, Object.assign({ id: "tap-loader-container", sx: containerSx }, { children: _jsx("div", Object.assign({ id: "tap-loader-container-child", className: "loader-container", style: style || loaderContainerStyle }, { children: _jsxs("svg", Object.assign({ className: "box-loader", style: Object.assign(Object.assign({}, scaleStyle), svgBoxLoaderStyle) }, { children: [_jsx("circle", Object.assign({ className: "path-loader", style: { stroke: outerColor }, cx: "50%", cy: "50%", r: "20", fill: "none", strokeLinecap: "round", strokeWidth: " 3.6px", strokeDasharray: " 125, 124" }, { children: toggleAnimation && (_jsxs(_Fragment, { children: [_jsx("animateTransform", { attributeName: "transform", type: "rotate", from: "0 50 50", to: "360 50 50", dur: `${(duration || 0) / 3}s`, repeatCount: "indefinite" }), _jsx("animate", { attributeName: "stroke-dashoffset", values: "0; 122; 122; 0; 0", keyTimes: "0; 0.45; 0.55; 0.9; 1", dur: `${duration || 0}s`, repeatCount: "indefinite" })] })) })), _jsx("circle", Object.assign({ className: "path-loader-inner", style: { stroke: innerColor }, cx: "50%", cy: "50%", r: "14", fill: "none", strokeLinecap: "round", strokeWidth: " 3.6px", strokeDasharray: " 88, 124" }, { children: toggleAnimation && (_jsxs(_Fragment, { children: [_jsx("animateTransform", { attributeName: "transform", type: "rotate", from: "360 50 50", to: "0 50 50", dur: `${(duration || 0) / 3}s`, repeatCount: "indefinite" }), _jsx("animate", { attributeName: "stroke-dashoffset", values: "0; -85; -85; 0; 0", keyTimes: "0; 0.45; 0.55; 0.9; 1", dur: `${duration}s`, repeatCount: "indefinite" })] })) }))] })) })) })));
-}

package/build/components/MFWidgetLoader/DefaultMFWidgetLoader.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Stack from '@mui/material/Stack';
-import Box from '@mui/material/Box';
-import Skeleton from '@mui/material/Skeleton';
-export function DefaultMFWidgetLoader() {
-    return (_jsxs(Stack, Object.assign({ height: "100%", borderRadius: "0 0 12px 12px", overflow: "hidden" }, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, height: "4.1875rem", sx: {
-                    pb: '1.2rem',
-                    paddingInline: '32px',
-                    pt: '10px',
-                    background: (theme) => theme.palette.background.transparent[0],
-                } }, { children: [_jsx(Skeleton, { sx: { bgcolor: 'gray.300' }, variant: "rounded", width: 60, height: 31 }), _jsx(Skeleton, { sx: { bgcolor: 'gray.300' }, variant: "rounded", width: 60, height: 31 }), _jsx(Skeleton, { sx: { bgcolor: 'gray.300' }, variant: "rounded", width: 60, height: 31 })] })), _jsx(Box, { flex: 1, bgcolor: "#fff" })] })));
-}

package/build/components/MFWidgetLoader/MFWidgetLoader.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { APP_CODES } from '../../constants/index.js';
-import { DefaultMFWidgetLoader } from './DefaultMFWidgetLoader';
-import { ReportsMFWidgetLoader } from './ReportsMFWidgetLoader';
-const MFWidgetLoader = ({ appCode }) => {
-    if (appCode === APP_CODES.reports.code)
-        return _jsx(ReportsMFWidgetLoader, {});
-    return _jsx(DefaultMFWidgetLoader, {});
-};
-export default MFWidgetLoader;