@fixefy/fixefy-ui-components 0.0.9 → 0.0.10

package/dist-cjs/FxProgressCircle/styles/progress_circle.styles.jsx

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SliderBar = exports.SliderCircle = exports.Slider = exports.Label = exports.Container = void 0;
-const styles_1 = require("@mui/material/styles");
-exports.Container = (0, styles_1.styled)("div")(({ theme }) => ({
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-}));
-exports.Label = (0, styles_1.styled)("span")(({ theme }) => (Object.assign(Object.assign({}, theme.typography.body1), { color: theme.palette.typography.title, marginRight: 8 })));
-exports.Slider = (0, styles_1.styled)("svg")(({ theme }) => ({
-    display: "block",
-    width: 22,
-    height: 22,
-    transform: "rotate(-90deg)",
-}));
-exports.SliderCircle = (0, styles_1.styled)("circle")(({ theme, color }) => ({
-    fill: "transparent",
-    stroke: color !== null && color !== void 0 ? color : theme.palette.green2scale.main,
-    opacity: 0.1,
-}));
-exports.SliderBar = (0, styles_1.styled)("circle")(({ theme, color }) => ({
-    fill: "transparent",
-    stroke: color !== null && color !== void 0 ? color : theme.palette.green2scale.main,
-    strokeDashoffset: 0,
-    strokeDasharray: 0,
-}));

package/dist-cjs/FxProgressCounter/ProgressCounter.jsx

@@ -1,45 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxProgressCounter = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const material_1 = require("@mui/material");
-const fxutils_images_1 = require("@fixefy/fxutils.images");
-const progress_counter_styles_1 = require("./styles/progress_counter.styles");
-const image_1 = tslib_1.__importDefault(require("next/image"));
-function FxProgressCounter(_a) {
-    var _b, _c;
-    var { values, structure, filter } = _a, rest = tslib_1.__rest(_a, ["values", "structure", "filter"]);
-    const initialValues = {
-        count: (_b = values === null || values === void 0 ? void 0 : values.count) !== null && _b !== void 0 ? _b : 0,
-        current: (_c = values === null || values === void 0 ? void 0 : values.current) !== null && _c !== void 0 ? _c : 0,
-    };
-    const normalizeNumber = (number) => {
-        return (number / initialValues.count) * 100;
-    };
-    return (<progress_counter_styles_1.Container>
-      
-      <material_1.Box position={'relative'} textAlign={'center'} justifyContent={'center'} mt={1.2}>
-        <image_1.default alt={'approve'} width={16} height={16} loader={() => (0, fxutils_images_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'invoices/approve-small-white.svg',
-        })} src={'invoices/approve-small-white.svg'} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-
-        <material_1.Box mt={0.5}>
-          <material_1.Typography fontSize={19} fontWeight={600}>
-            {initialValues.current}/{initialValues.count}
-          </material_1.Typography>
-        </material_1.Box>
-
-        <material_1.Typography fontSize={11} sx={{ opacity: 0.6 }}>
-          Charges
-        </material_1.Typography>
-      </material_1.Box>
-
-      <progress_counter_styles_1.ProgressContainer>
-        <progress_counter_styles_1.MainBar variant="determinate" value={normalizeNumber(initialValues.current)} color={'inherit'} {...rest}/>
-        <progress_counter_styles_1.BackgroundBar variant="determinate" value={initialValues.count > 100 ? 100 : initialValues.count} color={'inherit'} {...rest}/>
-      </progress_counter_styles_1.ProgressContainer>
-    </progress_counter_styles_1.Container>);
-}
-exports.FxProgressCounter = FxProgressCounter;

package/dist-cjs/FxProgressCounter/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxProgressCounter = void 0;
-var ProgressCounter_1 = require("./ProgressCounter");
-Object.defineProperty(exports, "FxProgressCounter", { enumerable: true, get: function () { return ProgressCounter_1.FxProgressCounter; } });

package/dist-cjs/FxProgressCounter/styles/progress_counter.styles.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Container = exports.ProgressContainer = exports.BackgroundBar = exports.MainBar = exports.BaseProgress = void 0;
-const styles_1 = require("@mui/material/styles");
-const material_1 = require("@mui/material");
-exports.BaseProgress = (0, styles_1.styled)(material_1.LinearProgress)(({ theme }) => ({
-    borderRadius: '8px',
-    width: '70%',
-    position: 'absolute',
-    zIndex: 2,
-    height: 3,
-}));
-exports.MainBar = (0, styles_1.styled)(exports.BaseProgress)(({ theme }) => ({
-    opacity: 1,
-}));
-exports.BackgroundBar = (0, styles_1.styled)(exports.BaseProgress)(({ theme }) => ({
-    opacity: 0.2,
-}));
-exports.ProgressContainer = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
-    alignItems: 'center',
-    display: 'flex',
-    width: '100%',
-    margin: '8px 0',
-    position: 'relative',
-    justifyContent: 'center',
-}));
-exports.Container = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
-    width: 104,
-    height: 104,
-    minWidth: 104,
-    maxWidth: 104,
-    borderRadius: 8,
-    position: 'relative',
-    color: theme.palette.common.white,
-    backgroundColor: theme.palette.score.excellent,
-}));

package/dist-cjs/FxScore/FxScore.jsx

@@ -1,57 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxScore = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const graphql_tag_1 = require("graphql-tag");
-const client_1 = require("@apollo/client");
-const score_styles_1 = require("./styles/score.styles");
-const fixefy_ui_utils_1 = require("@fixefy/fixefy-ui-utils");
-const material_1 = require("@mui/material");
-const FxScore = (_a) => {
-    var _b;
-    var { value, structure, filter, variant = 'box', hasLabel = true, title: propsTitle = 'score', Sizes: propsSizes = {} } = _a, rest = tslib_1.__rest(_a, ["value", "structure", "filter", "variant", "hasLabel", "title", "Sizes"]);
-    const Sizes = Object.assign({ box: {
-            boxWidth: 104,
-            progressWidth: 68,
-        }, circle: { boxWidth: 40, progressWidth: 36 } }, propsSizes);
-    const { extended, title } = structure || {};
-    const { gql_operation, object_path: objectPath, title_path: titlePath, filter: structureFilter } = extended || {};
-    const gqlOperation = gql_operation !== null && gql_operation !== void 0 ? gql_operation : 'query GET_SCORE($where: Json) { score: chargesAvg( where: $where data: { fields: ["score"], fragment: "{ score }" } ) }';
-    let _filter = structureFilter;
-    if (filter) {
-        _filter = Object.assign(Object.assign({}, _filter), filter);
-    }
-    const [fetchData, { data, error, loading }] = (0, client_1.useLazyQuery)((0, graphql_tag_1.gql)(gqlOperation));
-    (0, react_1.useEffect)(() => {
-        if (!value && structure) {
-            fetchData({
-                variables: {
-                    where: Object.assign({}, _filter),
-                },
-            });
-        }
-    }, []);
-    const ScoreValue = data ? data[objectPath] * 100 : value;
-    const _classes = (0, score_styles_1.useStyles)({
-        scoreColor: (0, fixefy_ui_utils_1.getScoreColor)(ScoreValue || 0),
-        variant,
-    });
-    return loading ? (<material_1.Box className={_classes.container}>
-      <material_1.Skeleton animation="wave" variant="circular" width={68} height={68}/>
-    </material_1.Box>) : (<material_1.Box className={_classes.container} sx={{
-            width: Sizes[variant].boxWidth,
-            height: Sizes[variant].boxWidth,
-            minWidth: Sizes[variant].boxWidth,
-            maxWidth: Sizes[variant].boxWidth,
-            borderRadius: variant === 'box' ? '8px' : '50%',
-        }}>
-      <material_1.CircularProgress size={Sizes[variant].progressWidth} variant="determinate" value={ScoreValue} color="inherit" thickness={2} className={_classes.mainCircle} {...rest}/>
-      <material_1.CircularProgress size={Sizes[variant].progressWidth} variant="determinate" value={100} color="inherit" thickness={2} className={_classes.backgroundCircle} {...rest}/>
-      <material_1.Box className={_classes.content}>
-        <material_1.Typography variant={variant === 'box' ? 'h5' : 'table'} className={_classes.scoreNumber}>{`${(_b = Math.round(Number(ScoreValue))) !== null && _b !== void 0 ? _b : 0}%`}</material_1.Typography>
-        {hasLabel && <material_1.Typography className={_classes.scoreText}>{(0, fixefy_ui_utils_1.titleCase)(title !== null && title !== void 0 ? title : propsTitle)}</material_1.Typography>}
-      </material_1.Box>
-    </material_1.Box>);
-};
-exports.FxScore = FxScore;

package/dist-cjs/FxScore/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxScore = void 0;
-var FxScore_1 = require("./FxScore");
-Object.defineProperty(exports, "FxScore", { enumerable: true, get: function () { return FxScore_1.FxScore; } });

package/dist-cjs/FxScore/styles/score.styles.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-const styles_1 = require("@mui/styles");
-exports.useStyles = (0, styles_1.makeStyles)((theme) => ({
-    container: {
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        position: 'relative',
-        color: theme.palette.common.white,
-        backgroundColor: (props) => theme.palette.score[props.scoreColor],
-    },
-    content: {
-        position: 'absolute',
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        flexDirection: 'column',
-    },
-    scoreNumber: {
-        color: theme.palette.common.white,
-    },
-    scoreText: Object.assign(Object.assign({}, theme.typography.table), { fontWeight: 400, color: theme.palette.common.white, opacity: 0.6 }),
-    mainCircle: {
-        position: 'absolute',
-        zIndex: 2,
-    },
-    backgroundCircle: {
-        position: 'absolute',
-        opacity: 0.2,
-    },
-}));

package/dist-cjs/FxShowMore/FxShowMore.jsx

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxShowMore = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const material_1 = require("@mui/material");
-const show_more_styles_1 = require("./styles/show_more.styles");
-const KeyboardArrowDown_1 = tslib_1.__importDefault(require("@mui/icons-material/KeyboardArrowDown"));
-function FxShowMore({ items, label, children, title }) {
-    const [anchorEl, setAnchorEl] = react_1.default.useState(null);
-    const handleClick = (event) => {
-        setAnchorEl(event.currentTarget);
-    };
-    const handleClose = () => {
-        setAnchorEl(null);
-    };
-    const open = Boolean(anchorEl);
-    const id = open ? 'simple-popover' : undefined;
-    return (<show_more_styles_1.ShowMoreWrapper>
-      {children}
-
-      <show_more_styles_1.ShowMoreBtn onClick={handleClick}>
-        <show_more_styles_1.ShowMoreIcon isOpen={open}>
-          <KeyboardArrowDown_1.default />
-        </show_more_styles_1.ShowMoreIcon>
-        {title ? title : 'SHOW MORE'}
-      </show_more_styles_1.ShowMoreBtn>
-
-      <show_more_styles_1.StyledPopover id={id} open={open} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{
-            vertical: 'bottom',
-            horizontal: 'center',
-        }} transformOrigin={{
-            vertical: 'top',
-            horizontal: 'center',
-        }}>
-        <show_more_styles_1.StyledLabel>
-          {label} ({items.length})
-        </show_more_styles_1.StyledLabel>
-        <show_more_styles_1.StyledDivider />
-        {items === null || items === void 0 ? void 0 : items.map((item, index) => (<div key={index}>
-            <material_1.Typography variant="body1">{item}</material_1.Typography>
-            {index + 1 !== items.length && <show_more_styles_1.StyledDivider />}
-          </div>))}
-      </show_more_styles_1.StyledPopover>
-    </show_more_styles_1.ShowMoreWrapper>);
-}
-exports.FxShowMore = FxShowMore;

package/dist-cjs/FxShowMore/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxShowMore = void 0;
-var FxShowMore_1 = require("./FxShowMore");
-Object.defineProperty(exports, "FxShowMore", { enumerable: true, get: function () { return FxShowMore_1.FxShowMore; } });

package/dist-cjs/FxShowMore/styles/show_more.styles.js

@@ -1,43 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledLabel = exports.StyledDivider = exports.StyledPopover = exports.ShowMoreIcon = exports.ShowMoreBtn = exports.ShowMoreWrapper = void 0;
-const styles_1 = require("@mui/material/styles");
-const material_1 = require("@mui/material");
-exports.ShowMoreWrapper = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
-    borderRadius: '8px',
-}));
-exports.ShowMoreBtn = (0, styles_1.styled)(material_1.Button)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.button), { fontWeight: 600, fontSize: 12, textTransform: 'uppercase', color: theme.palette.primary[800], padding: 0, display: 'flex', justifyContent: 'flex-start', alignItems: 'center' })));
-exports.ShowMoreIcon = (0, styles_1.styled)(material_1.Box)(({ theme, isOpen }) => ({
-    width: 16,
-    height: 16,
-    color: theme.palette.primary[800],
-    borderRadius: '50%',
-    border: '1px solid',
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginRight: 8,
-    ['& svg']: {
-        width: 14,
-        height: 14,
-        color: theme.palette.primary[800],
-        transform: isOpen ? 'rotate(180deg)' : 'rotate(0deg)',
-        transition: 'all 0.5s',
-    },
-}));
-exports.StyledPopover = (0, styles_1.styled)(material_1.Popover)(({ theme }) => ({
-    ['.MuiPaper-root']: {
-        background: theme.palette.common.white,
-        boxShadow: '0px 0px 10px rgba(86, 135, 147, 0.3)',
-        borderRadius: 8,
-        padding: 24,
-        marginTop: 8,
-        minWidth: 226,
-        maxWidth: 328,
-    },
-}));
-exports.StyledDivider = (0, styles_1.styled)(material_1.Divider)(({ theme }) => ({
-    marginTop: 8,
-    marginBottom: 8,
-}));
-exports.StyledLabel = (0, styles_1.styled)(material_1.Typography)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.overLineCaption), { color: '#8B9092' })));

package/dist-cjs/FxSlider/FxSlider.jsx

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxSlider = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const material_1 = require("@mui/material");
-function FxSlider(props) {
-    return <material_1.Slider {...props}/>;
-}
-exports.FxSlider = FxSlider;

package/dist-cjs/FxSlider/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxSlider = void 0;
-var FxSlider_1 = require("./FxSlider");
-Object.defineProperty(exports, "FxSlider", { enumerable: true, get: function () { return FxSlider_1.FxSlider; } });

package/dist-cjs/FxStatisticsBar/FxStatisticsBar.jsx

@@ -1,95 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxStatisticsBar = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const graphql_tag_1 = require("graphql-tag");
-const client_1 = require("@apollo/client");
-const material_1 = require("@mui/material");
-const fixefy_ui_utils_1 = require("@fixefy/fixefy-ui-utils");
-const fixefy_ui_utils_2 = require("@fixefy/fixefy-ui-utils");
-const statistics_styles_1 = require("./styles/statistics.styles");
-function FxStatisticsBar({ value, type = 'currency', label, structure, collapsed, filter }) {
-    const _classes = (0, statistics_styles_1.useStyles)();
-    const { extended, input_type, title } = structure || {};
-    const { gql_operation, object_path, filter: structurefilter, variables } = extended || {};
-    const gqlOperation = gql_operation !== null && gql_operation !== void 0 ? gql_operation : 'query GET_SCORE($where: Json) { score: chargesAvg( where: $where data: { fields: ["score"], fragment: "{ score }" } ) }';
-    let _filter = structurefilter;
-    if (filter) {
-        _filter = Object.assign(Object.assign({}, _filter), filter);
-    }
-    const [fetchData, { data, error, loading }] = (0, client_1.useLazyQuery)((0, graphql_tag_1.gql)(gqlOperation));
-    const convertValue = (value) => {
-        var _a;
-        let newValue = '';
-        let sign = '';
-        if (value < 1000) {
-            newValue = value;
-        }
-        else if (value >= 1000 && value < 1000000) {
-            newValue = (value / 1000).toFixed(2);
-            sign = 'K';
-        }
-        else {
-            newValue = (value / 1000000).toFixed(2);
-            sign = 'M';
-        }
-        return (new Intl.NumberFormat('en-US', {
-            style: 'currency',
-            currency: ((_a = (0, fixefy_ui_utils_2.getCurrency)(null)) === null || _a === void 0 ? void 0 : _a.code.toUpperCase()) || 'USD',
-        }).format(Number(newValue)) + sign);
-    };
-    const checkIsCollapsed = () => {
-        let collapsedFromStructureIsDefined = false;
-        if (variables && variables.collapsed !== undefined && variables.collapsed !== null) {
-            collapsedFromStructureIsDefined = true;
-        }
-        if (collapsedFromStructureIsDefined) {
-            return variables.collapsed;
-        }
-        else {
-            return collapsed;
-        }
-    };
-    const getValue = (value) => {
-        var _a;
-        const statisticsType = (input_type === null || input_type === void 0 ? void 0 : input_type.value) || type;
-        switch (statisticsType) {
-            case 'percentage': {
-                return new Intl.NumberFormat('en-US', {
-                    style: 'percent',
-                }).format(Number(value));
-            }
-            case 'currency': {
-                if (checkIsCollapsed()) {
-                    return convertValue(value);
-                }
-                else {
-                    return new Intl.NumberFormat('en-US', {
-                        style: 'currency',
-                        currency: ((_a = (0, fixefy_ui_utils_2.getCurrency)(null)) === null || _a === void 0 ? void 0 : _a.code.toUpperCase()) || 'USD',
-                    }).format(Number(value));
-                }
-            }
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        if (!value && structure) {
-            fetchData({
-                variables: {
-                    where: Object.assign({}, _filter),
-                },
-            });
-        }
-    }, []);
-    const statisticsTitle = label ? label : title;
-    const statisticsValue = data && data[object_path] != null ? getValue(data[object_path]) : getValue(value);
-    return loading ? (<material_1.Box sx={{ width: 100 }}>
-      <material_1.Skeleton animation="wave" width={100} height={30}/>
-      <material_1.Skeleton animation="wave" width={100} height={20}/>
-    </material_1.Box>) : (<div className={_classes.container}>
-      <span className={(variables === null || variables === void 0 ? void 0 : variables.contrast) ? _classes.contrastValue : _classes.value}>{statisticsValue}</span>
-      <span className={(variables === null || variables === void 0 ? void 0 : variables.contrast) ? _classes.contrastLabel : _classes.label}>{(0, fixefy_ui_utils_1.titleCase)(statisticsTitle)}</span>
-    </div>);
-}
-exports.FxStatisticsBar = FxStatisticsBar;

package/dist-cjs/FxStatisticsBar/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxStatisticsBar = void 0;
-var FxStatisticsBar_1 = require("./FxStatisticsBar");
-Object.defineProperty(exports, "FxStatisticsBar", { enumerable: true, get: function () { return FxStatisticsBar_1.FxStatisticsBar; } });

package/dist-cjs/FxStatisticsBar/styles/statistics.styles.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-const styles_1 = require("@mui/styles");
-require("@fixefy/fxutils.page_context");
-exports.useStyles = (0, styles_1.makeStyles)((theme) => ({
-    container: {
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        flexDirection: 'column',
-        minHeight: 56,
-    },
-    contrastLabel: {
-        fontWeight: 'normal',
-        fontSize: 11,
-        lineHeight: '16px',
-        letterSpacing: '0.1px',
-        opacity: 0.7,
-        color: theme.palette.common.white,
-        textOverflow: 'ellipsis',
-        whiteSpace: 'nowrap',
-    },
-    contrastValue: {
-        fontWeight: 600,
-        fontSize: 19,
-        lineHeight: '28px',
-        letterSpacing: '0.15px',
-        color: theme.palette.common.white,
-    },
-    label: Object.assign(Object.assign({}, theme.typography.table), { color: theme.palette.statistics.label, textOverflow: 'ellipsis', whiteSpace: 'nowrap' }),
-    value: Object.assign(Object.assign({}, theme.typography.h5), { color: theme.palette.statistics.value }),
-}));

package/dist-cjs/FxStatusBar/FxStatusBar.jsx

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxStatusBar = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const material_1 = require("@mui/material");
-const FxChip_1 = require("../FxChip");
-const constants_1 = require("./helpers/constants");
-const fixefy_ui_utils_1 = require("@fixefy/fixefy-ui-utils");
-const statusBar_styles_1 = require("./styles/statusBar.styles");
-const FxStatusBar = ({ onChangeStatus, onSearch, defaultStatus, title, options, chipsVariant = 'filled' }) => {
-    const [selectedStatus, setSelectedStatus] = (0, react_1.useState)([]);
-    const [searchValue, setSearchValue] = (0, react_1.useState)('');
-    (0, react_1.useEffect)(() => {
-        if (defaultStatus) {
-            typeof defaultStatus === 'string' ? setSelectedStatus([defaultStatus]) : setSelectedStatus(defaultStatus);
-        }
-        else {
-            setSelectedStatus(['all']);
-        }
-    }, [defaultStatus]);
-    const onStatusClick = (status) => {
-        if (status === 'all') {
-            setSelectedStatus(() => {
-                if (selectedStatus.includes(status)) {
-                    return [];
-                }
-                else {
-                    return ['all'];
-                }
-            });
-        }
-        else {
-            setSelectedStatus((prevState) => {
-                if (selectedStatus.includes(status)) {
-                    const rv = prevState.filter((_status) => _status !== status && _status !== 'all');
-                    return rv.length == 0 ? ['all'] : rv;
-                }
-                else {
-                    const rv = prevState.filter((_status) => _status !== status && _status !== 'all');
-                    return [...rv, status];
-                }
-            });
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        onChangeStatus(selectedStatus);
-    }, [selectedStatus]);
-    (0, react_1.useEffect)(() => {
-        onSearch && onSearch(searchValue);
-    }, [searchValue]);
-    const __options = options !== null && options !== void 0 ? options : constants_1.statuses;
-    return (<statusBar_styles_1.StatusBarCard>
-      {title && <statusBar_styles_1.StatusBarTitle style={{ marginRight: '8px' }}>{(0, fixefy_ui_utils_1.titleCase)(title)}</statusBar_styles_1.StatusBarTitle>}
-
-      <material_1.Stack direction="row" spacing={1}>
-        <statusBar_styles_1.StatusChipStyled onClick={() => onStatusClick('all')} label="All" variant={selectedStatus.includes('all') ? 'filled' : 'outlined'}/>
-        {Object.keys(__options).map((key, index) => {
-            return <FxChip_1.FxChip onClick={() => onStatusClick(__options[key])} key={index} label={(0, fixefy_ui_utils_1.titleCase)(key)} variant={chipsVariant} status={selectedStatus.includes(__options[key]) ? __options[key] : ''}/>;
-        })}
-      </material_1.Stack>
-    </statusBar_styles_1.StatusBarCard>);
-};
-exports.FxStatusBar = FxStatusBar;

package/dist-cjs/FxStatusBar/helpers/constants.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.statuses = void 0;
-exports.statuses = {
-    Declined: 'declined',
-    Pending: 'pending',
-    Approved: 'approved',
-    Active: 'active',
-    Challenge: 'challenged',
-    in_review: 'in_review',
-    Discrepancy: 'discrepancy',
-    no_pricing: 'no_pricing',
-    in_progress: 'in_progress',
-    Duplicated: 'duplicated',
-};

package/dist-cjs/FxStatusBar/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxStatusBar = void 0;
-var FxStatusBar_1 = require("./FxStatusBar");
-Object.defineProperty(exports, "FxStatusBar", { enumerable: true, get: function () { return FxStatusBar_1.FxStatusBar; } });

package/dist-cjs/FxStatusBar/styles/statusBar.styles.jsx

@@ -1,39 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StatusChipStyled = exports.StatusBarTitle = exports.StatusBarCard = void 0;
-const styles_1 = require("@mui/material/styles");
-const material_1 = require("@mui/material");
-exports.StatusBarCard = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
-    background: theme.palette.common.white,
-    borderRadius: 4,
-    padding: 16,
-    boxShadow: "0px 0px 10px rgba(86, 135, 147, 0.3)",
-    display: "flex",
-    alignItems: "center",
-    width: "fit-content",
-}));
-exports.StatusBarTitle = (0, styles_1.styled)("span")(({ theme }) => (Object.assign(Object.assign({}, theme.typography.body1), { color: theme.palette.common.black })));
-exports.StatusChipStyled = (0, styles_1.styled)(material_1.Chip)(({ theme, variant }) => {
-    let backgroundColor, border, labelColor;
-    if (variant === "filled") {
-        backgroundColor = theme.palette.primary.light;
-        labelColor = theme.palette.common.white;
-    }
-    else {
-        backgroundColor = theme.palette.common.white;
-    }
-    border = "#F0F0F0";
-    return {
-        height: 20,
-        minWidth: 34,
-        maxWidth: 120,
-        ["& .MuiChip-label"]: {
-            fontSize: 9,
-            fontWeight: 600,
-            lineHeight: "12px",
-            color: labelColor ? labelColor : theme.palette["statistics"].label,
-        },
-        backgroundColor,
-        border: `1px solid ${border}`,
-    };
-});