mui-design-system 0.0.21 → 0.0.22

package/dist/components/custom-auto-complete-advanced/components/RenderInput.d.ts

@@ -1,23 +0,0 @@
-import { FC, ReactNode } from 'react';
-import { AutocompleteRenderInputParams, TextFieldVariants } from '@mui/material';
-import { TextFieldProps } from '@mui/material';
-import { TInputLabelMode } from '../../input-list/type';
-interface IRenderInputProps extends Omit<TextFieldProps, 'label'> {
-    params: AutocompleteRenderInputParams;
-    label?: ReactNode;
-    loading: boolean | undefined;
-    inputMaxHeight?: string | number;
-    variant?: TextFieldVariants;
-    placeholder?: string;
-    validation?: {
-        isInvalid: boolean;
-        message: string;
-    };
-    inputLabelMode?: TInputLabelMode;
-    helperText?: string;
-    textFieldProps?: TextFieldProps;
-    handleSearch?: (e: any) => void;
-    handleChange?: (e: string) => void;
-}
-declare const RenderInput: FC<IRenderInputProps>;
-export default RenderInput;

package/dist/components/custom-auto-complete-advanced/components/RenderInput.js

@@ -1,51 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import { CircularProgress, InputAdornment, TextField, } from '@mui/material';
-import debounce from '../../../methods/debounce';
-import InfoCircle from '../../../icons/InfoCircle';
-const RenderInput = (props) => {
-    const { params, inputMaxHeight, sx, label, loading, helperText, variant, placeholder, disabled, validation, inputLabelMode, textFieldProps, handleSearch, handleChange, } = props;
-    const debouncedSearch = useCallback(debounce((e) => {
-        if (handleSearch) {
-            handleSearch(e);
-        }
-    }, 500), [handleSearch]);
-    return (_jsx(TextField, { ...params, variant: variant, ...(inputLabelMode === 'relative' && { label: label }), helperText: validation?.message
-            ? validation?.message ?? helperText ?? ' '
-            : undefined, error: validation?.isInvalid, placeholder: placeholder, disabled: disabled, InputProps: {
-            ...params.InputProps,
-            ...(validation?.isInvalid && {
-                startAdornment: (_jsx(InputAdornment, { sx: { pl: 2, stroke: ({ palette }) => palette.error.main }, position: 'start', children: _jsx(InfoCircle, { primarycolor: 'inherit' }) })),
-            }),
-            endAdornment: (_jsxs(InputAdornment, { position: 'end', children: [loading ? _jsx(CircularProgress, { color: 'inherit', size: 20 }) : null, params.InputProps.endAdornment] })),
-        }, ...textFieldProps, onChange: (e) => {
-            debouncedSearch(e.target.value);
-            handleChange?.(e.target.value);
-        }, sx: [
-            ...(Array.isArray(sx) ? sx : [sx]),
-            {
-                ...(inputMaxHeight && {
-                    minHeight: 0,
-                    maxHeight: inputMaxHeight ?? 'unset',
-                }),
-                minWidth: 0,
-                height: '100%',
-                overflow: 'auto',
-                '& .MuiFilledInput-root': {
-                    ...(inputLabelMode === 'relative' && {
-                        alignItems: 'flex-end',
-                    }),
-                },
-                '.MuiAutocomplete-input': {
-                    padding: '0',
-                },
-                '.MuiOutlinedInput-root': {
-                    paddingY: '4px !important',
-                },
-                '.MuiAutocomplete-popupIndicator': {
-                    transition: '0.3s ease all',
-                },
-            },
-        ] }));
-};
-export default RenderInput;

package/dist/components/custom-auto-complete-advanced/components/RenderTags.d.ts

@@ -1,9 +0,0 @@
-import { TextFieldProps, AutocompleteRenderGetTagProps } from '@mui/material';
-interface IRenderTagsProps extends Omit<TextFieldProps, 'label'> {
-    getTagProps: AutocompleteRenderGetTagProps;
-    value: any[];
-    variant: 'filled' | 'outlined';
-    size: 'small' | 'medium';
-}
-declare const RenderTags: (value: IRenderTagsProps['value'], getTagProps: IRenderTagsProps['getTagProps'], variant?: IRenderTagsProps['variant'], size?: IRenderTagsProps['size']) => import("react/jsx-runtime").JSX.Element[];
-export default RenderTags;

package/dist/components/custom-auto-complete-advanced/components/RenderTags.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Chip, } from '@mui/material';
-import SvgAdd from '../../../icons/Add';
-const RenderTags = (value, getTagProps, variant = 'filled', size = 'medium') => value.map((option, index) => {
-    const { key, ...tagProps } = getTagProps({ index });
-    return (_jsx(Chip, { variant: variant, label: option.label, size: size, ...tagProps, deleteIcon: _jsx(SvgAdd, { style: { transform: 'rotate(45deg)' }, primarycolor: 'inherit' }), sx: {
-            border: 'none',
-            backgroundColor: 'primary.3',
-            ':hover': {
-                backgroundColor: 'primary.4',
-                cursor: 'default',
-            },
-            py: '0 !important',
-            maxHeight: size === 'small' ? 28 : 32,
-            color: 'text.primary',
-            stroke: ({ palette }) => palette.text.primary,
-            borderRadius: '999px',
-            fontSize: ({ typography }) => typography['caption3.medium'].fontSize,
-            fontWeight: ({ typography }) => typography['caption3.medium'].fontWeight,
-        } }, key));
-});
-export default RenderTags;

package/dist/components/custom-breadcrumbs/CustomBreadcrumbs.d.ts

@@ -1,17 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-import { BreadcrumbsProps, LinkOwnProps } from '@mui/material';
-export interface ICustomBreadcrumbsProps {
-    separator?: ReactNode | string;
-    collapse?: boolean;
-    items: {
-        title: ReactNode | string;
-        href: string;
-    }[];
-    itemProps?: {
-        linkProps?: LinkOwnProps;
-        textProps?: HTMLAttributes<HTMLDivElement>;
-    };
-    breadCrumbProps?: BreadcrumbsProps;
-}
-declare const CustomBreadcrumbs: ({ separator, collapse, items, itemProps, breadCrumbProps, }: ICustomBreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
-export default CustomBreadcrumbs;

package/dist/components/custom-breadcrumbs/CustomBreadcrumbs.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Breadcrumbs, Link, } from '@mui/material';
-const CustomBreadcrumbs = ({ separator, collapse, items, itemProps, breadCrumbProps, }) => {
-    return (_jsx(Breadcrumbs, { maxItems: collapse ? 2 : undefined, separator: separator, ...breadCrumbProps, children: items.map((item, index) => (_jsx(Link, { underline: 'none', color: 'inherit', href: item.href, ...itemProps?.linkProps, children: _jsx("div", { style: {
-                    display: 'flex',
-                    alignItems: 'center',
-                    fontSize: 14,
-                    fontWeight: 400,
-                }, ...itemProps?.textProps, children: item.title }) }, index))) }));
-};
-export default CustomBreadcrumbs;

package/dist/components/custom-card/CustomHorizontalCard.d.ts

@@ -1,3 +0,0 @@
-import { CustomCardProps } from "./types";
-declare function CustomHorizontalCard({ Image, Title, Subtitle, Date, Actions, ...restProps }: CustomCardProps): import("react/jsx-runtime").JSX.Element;
-export default CustomHorizontalCard;

package/dist/components/custom-card/CustomHorizontalCard.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Box from "@mui/material/Box";
-import { useTheme } from "@mui/material";
-function CustomHorizontalCard({ Image, Title, Subtitle, Date, Actions, ...restProps }) {
-    const theme = useTheme();
-    const { sx, ...props } = restProps;
-    return (_jsx(Box, { sx: { width: 350, border: `1px solid ${theme.palette.mode === "light" ? theme.palette.text[7] : theme.palette.grey[6]}`, borderRadius: 2, backgroundColor: theme.palette.background.default, overflow: 'hidden', ...restProps.sx }, ...props, children: _jsxs(Box, { sx: { display: 'flex', gap: 2 }, children: [_jsx(Box, { children: Image }), _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', width: '100%', padding: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', justifyContent: 'space-between' }, children: [_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column' }, children: [Title, Subtitle] }), Date] }), Actions] })] }) }));
-}
-export default CustomHorizontalCard;

package/dist/components/custom-card/CustomVerticalCard.d.ts

@@ -1,3 +0,0 @@
-import { CustomCardProps } from "./types";
-declare function CustomVerticalCard({ Image, Title, Subtitle, Date, Description, Chip, Actions, ...restProps }: CustomCardProps): import("react/jsx-runtime").JSX.Element;
-export default CustomVerticalCard;

package/dist/components/custom-card/CustomVerticalCard.js

@@ -1,9 +0,0 @@
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { useTheme } from "@mui/material";
-import Box from "@mui/material/Box";
-function CustomVerticalCard({ Image, Title, Subtitle, Date, Description, Chip, Actions, ...restProps }) {
-    const theme = useTheme();
-    const { sx, ...props } = restProps;
-    return (_jsxs(Box, { sx: { width: 350, border: `1px solid ${theme.palette.mode === "light" ? theme.palette.text[7] : theme.palette.grey[6]}`, borderRadius: 2, backgroundColor: theme.palette.background.default, overflow: 'hidden', p: 2, ...restProps.sx }, ...props, children: [Image, _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', justifyContent: 'space-between' }, children: [Title, Chip] }), _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column' }, children: [Subtitle, Date] }), Description, Actions] }));
-}
-export default CustomVerticalCard;

package/dist/components/custom-chip/CustomChip.d.ts

@@ -1,12 +0,0 @@
-import { FC, ReactNode } from 'react';
-import { ChipProps } from "@mui/material";
-import { TypographyProps } from "@mui/material/Typography";
-export interface ICustomChipProps {
-    label: ReactNode;
-    endIcon?: ReactNode;
-    startIcon?: ReactNode;
-    labelProps?: TypographyProps;
-    chipProps?: ChipProps;
-}
-declare const CustomChip: FC<ICustomChipProps>;
-export default CustomChip;

package/dist/components/custom-chip/CustomChip.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Chip from "@mui/material/Chip";
-import Box from "@mui/material/Box";
-import Typography from "@mui/material/Typography";
-const CustomChip = ({ label, endIcon, startIcon, labelProps, chipProps }) => {
-    const isLarge = chipProps?.size === 'large';
-    const { sx, ...props } = chipProps || {};
-    return (_jsx(Chip, { sx: { ...(chipProps?.rounded && { borderRadius: '9999px' }), ...sx }, color: props.color, label: _jsxs(Box, { display: "flex", gap: 2, alignItems: 'center', children: [_jsx(Box, { display: 'flex', id: "custom-chip__start-icon", children: startIcon }), _jsx(Typography, { id: "custom-chip__label", lineHeight: props.size === 'small' ? '24px' : 'normal', variant: isLarge ? 'caption2.medium' : 'caption3', color: "#ffffff", ...labelProps, children: label }), _jsx(Box, { display: 'flex', id: "custom-chip__start-icon", children: endIcon })] }), ...props }));
-};
-export default CustomChip;

package/dist/components/custom-date-picker/CustomComponent.d.ts

@@ -1,17 +0,0 @@
-import { FC } from 'react';
-import { TextFieldVariants } from '@mui/material';
-import { BaseTextFieldProps } from '@mui/material/TextField/TextField';
-import { TInputLabelMode } from '../input-list/type';
-interface Props extends BaseTextFieldProps {
-    openCalendar: any;
-    value?: any;
-    handleValueChange?: () => void;
-    disabled?: boolean;
-    error?: any;
-    readonly?: boolean;
-    variant?: TextFieldVariants;
-    inputLabelMode: TInputLabelMode;
-    withoutHelperText?: boolean;
-}
-declare const CustomComponent: FC<Props>;
-export default CustomComponent;

package/dist/components/custom-date-picker/CustomComponent.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { InputAdornment, TextField } from '@mui/material';
-import SvgCalendar from '../../icons/Calendar';
-const CustomComponent = ({ openCalendar, value, handleValueChange, disabled, error, readonly, variant, lang, placeholder, inputLabelMode, label, withoutHelperText, ...rest }) => {
-    const { sx, helperText, ...props } = rest;
-    return (_jsx(TextField, { placeholder: placeholder ?? lang === 'fa' ? 'انتخاب کنید' : 'Pick a date', error: Boolean(error), ...(inputLabelMode === 'static' && { hiddenLabel: true }), ...(inputLabelMode === 'relative' && { label: label }), fullWidth: true, variant: variant, sx: {
-            // ...(inputLabelMode === "static" && {
-            //   ".MuiFilledInput-input": {
-            //     py: "16px !important",
-            //     pr: "3px !important",
-            //   },
-            // }),
-            borderRadius: '8px',
-            pointerEvents: readonly ? 'none' : 'unset',
-            // backgroundColor: readonly ? "background.paper" : "unset",
-            '& .MuiOutlinedInput-input ,& .MuiOutlinedInput-root': {
-                // backgroundColor: readonly ? "background.paper" : "unset",
-                // color: readonly ? "text.50" : "unset",
-                borderRadius: '8px',
-            },
-            '& .MuiFormHelperText-root': {
-                position: 'absolute',
-                top: 55,
-                left: 0,
-            },
-            width: '100%',
-            ...sx,
-        }, InputProps: {
-            endAdornment: (_jsx(InputAdornment, { position: 'end', sx: {
-                    stroke: (theme) => readonly
-                        ? `${theme.palette.text.disabled} !important`
-                        : 'text.primary',
-                }, children: _jsx(SvgCalendar, { primarycolor: 'inherit' }) })),
-        }, disabled: disabled, value: value, onFocus: openCalendar, onClick: openCalendar, onChange: handleValueChange, helperText: withoutHelperText ? undefined : error?.message ?? helperText ?? ' ', ...props }));
-};
-export default CustomComponent;

package/dist/components/custom-date-picker/CustomDatePicker.d.ts

@@ -1,14 +0,0 @@
-import { FC } from "react";
-import "../../styles/datePicker.css";
-import { CalendarProps } from "react-multi-date-picker";
-import { BaseTextFieldProps } from "@mui/material/TextField/TextField";
-import { TInputLabelMode } from "../input-list/type";
-export interface ICustomDatePickerProps extends CalendarProps {
-    error: any;
-    textFieldProps?: BaseTextFieldProps;
-    inputLabelMode: TInputLabelMode;
-    label: string;
-    withoutHelperText?: boolean;
-}
-declare const CustomDatePicker: FC<ICustomDatePickerProps>;
-export default CustomDatePicker;

package/dist/components/custom-date-picker/CustomDatePicker.js

@@ -1,55 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
-import "../../styles/datePicker.css";
-import DatePicker from "react-multi-date-picker";
-import CustomComponent from "./CustomComponent";
-import { useTheme } from "@mui/material";
-import persian from "react-date-object/calendars/persian";
-import persian_fa from "react-date-object/locales/persian_fa";
-const CustomDatePicker = ({ onChange, value, disabled, error, readOnly, textFieldProps, label, inputLabelMode, withoutHelperText, ...rest }) => {
-    const handleChange = (selectedDates) => {
-        if (onChange && selectedDates) {
-            const convertDate = new Date(selectedDates.toDate());
-            onChange(convertDate);
-        }
-    };
-    let lang = document.documentElement.lang;
-    const { palette } = useTheme();
-    const [portalTarget, setPortalTarget] = useState();
-    useEffect(() => {
-        setColors(palette);
-        lang = document.documentElement.lang;
-    }, [palette.mode, document.documentElement.lang]);
-    useEffect(() => {
-        const portalDiv = document.createElement("div");
-        portalDiv.id = "myPortalDiv";
-        portalDiv.style.zIndex = "1500";
-        portalDiv.style.position = "relative";
-        document.body.appendChild(portalDiv);
-        setPortalTarget(portalDiv);
-        return () => {
-            document.body.removeChild(portalDiv);
-        };
-    }, []);
-    const defaultWeekDays = ["ش", "ی", "د", "س", "چ", "پ", "ج"];
-    return (_jsx(DatePicker, { className: "custom-calender", value: value ? new Date(value) : null, portal: true, portalTarget: portalTarget, hideOnScroll: true, onChange: handleChange, ...(lang === "fa" && {
-            weekDays: defaultWeekDays,
-            calendar: persian,
-            locale: persian_fa,
-        }), calendarPosition: "bottom-left", editable: false, disabled: disabled, containerStyle: { width: "100%" }, ...rest, render: _jsx(CustomComponent, { lang: lang, error: error, disabled: disabled, readonly: readOnly, label: label, inputLabelMode: inputLabelMode, openCalendar: undefined, value: value, handleValueChange: undefined, withoutHelperText: withoutHelperText, ...textFieldProps }) }));
-};
-export default CustomDatePicker;
-const setColors = (colors) => {
-    const { primary: primaryThemeColor, background: bgThemeColor, text: textThemeColor, } = colors;
-    const params = [
-        { className: "--rmdp-primary-theme", value: primaryThemeColor?.main },
-        { className: "--rmdp-secondary-theme", value: primaryThemeColor?.[2] },
-        { className: "--rmdp-shadow-theme", value: primaryThemeColor?.[1] },
-        { className: "--rmdp-today-theme", value: primaryThemeColor?.[5] },
-        { className: "--rmdp-hover-theme", value: primaryThemeColor?.[4] },
-        { className: "--rmdp-deselect-theme", value: primaryThemeColor?.[9] },
-        { className: "--rmdp-background-theme", value: bgThemeColor?.paper },
-        { className: "--rmdp-text-theme", value: textThemeColor?.primary },
-    ];
-    params?.forEach((param) => document.documentElement.style.setProperty(param?.className, param?.value));
-};

package/dist/components/custom-dialog/CustomDialog.d.ts

@@ -1,41 +0,0 @@
-import { ReactNode } from "react";
-import { ButtonProps, DialogActionsProps, DialogContentProps, DialogProps, DialogTitleProps } from "@mui/material";
-import { StackProps } from "@mui/material/Stack";
-export interface IDialogButton extends ButtonProps {
-    label: ReactNode;
-    isLoading?: ButtonProps["isLoading"];
-}
-export interface IDialogHeader {
-    component?: ReactNode;
-    title: string | ReactNode;
-    withoutButton?: boolean;
-    headerProps?: StackProps;
-    titleProps?: DialogTitleProps;
-    button?: {
-        icon?: ReactNode;
-        props?: ButtonProps;
-        label?: string | ReactNode;
-    };
-}
-export interface ICustomDialog extends DialogProps {
-    header?: IDialogHeader;
-    withoutHeader?: boolean;
-    withoutBoxShadow?: boolean;
-    dialogContent?: {
-        props?: DialogContentProps;
-        image?: ReactNode;
-        body?: {
-            title?: string | ReactNode;
-            content?: string | ReactNode;
-            props?: StackProps;
-        };
-    };
-    dialogActions?: {
-        actionButtons?: IDialogButton[];
-        actionComponent?: ReactNode | string;
-        props?: DialogActionsProps;
-    };
-    onClose?: () => void;
-}
-declare const CustomDialog: ({ withoutHeader, withoutBoxShadow, dialogContent, children, header, dialogActions, onClose, PaperProps, ...rest }: ICustomDialog) => import("react/jsx-runtime").JSX.Element;
-export default CustomDialog;

package/dist/components/custom-dialog/CustomDialog.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Dialog, DialogActions, DialogContent, DialogTitle, useTheme, } from "@mui/material";
-import Stack from "@mui/material/Stack";
-import Box from "@mui/material/Box";
-import Typography from "@mui/material/Typography";
-import CloseCircle from "../../icons/CloseCircle";
-const CustomDialog = ({ withoutHeader = false, withoutBoxShadow = false, dialogContent, children, header, dialogActions, onClose, PaperProps, ...rest }) => {
-    const { direction } = useTheme();
-    return (_jsxs(Dialog, { keepMounted: true, dir: direction, onClose: onClose, ...rest, withoutBoxShadow: withoutBoxShadow, children: [!withoutHeader &&
-                (header?.component ?? (_jsxs(Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", ...header?.headerProps, children: [_jsx(DialogTitle, { sx: { padding: "0px" }, variant: "caption1", ...header?.titleProps, children: header?.title ?? "Title" }), !header?.withoutButton && (_jsxs(Button, { onClick: onClose, variant: "text", sx: {
-                                padding: "0px",
-                                minWidth: "max-content",
-                                minHeight: "max-content",
-                                transition: "transform 0.1s ease",
-                                stroke: (theme) => theme.palette.text.primary,
-                                ":hover": { backgroundColor: "background.main" },
-                                ":active": {
-                                    transform: "scale(90%)",
-                                },
-                            }, ...header?.button?.props, children: [header?.button?.label, header?.button?.icon ?? (_jsx(CloseCircle, { primarycolor: "inherit" }))] }))] }))), _jsxs(DialogContent, { ...dialogContent?.props, children: [!!dialogContent?.image && (_jsx(Box, { width: "max-content", minHeight: "80px", mx: "auto", children: dialogContent?.image })), !!dialogContent?.body && (_jsxs(Stack, { maxWidth: "490px", ...dialogContent?.body?.props, children: [_jsx(Typography, { variant: typeof dialogContent?.body?.title === "string"
-                                    ? "caption1.bold"
-                                    : "inherit", component: typeof dialogContent?.body?.title === "string" ? "span" : "div", children: dialogContent?.body?.title }), _jsx(Typography, { variant: typeof dialogContent?.body?.content === "string"
-                                    ? "caption2"
-                                    : "inherit", textAlign: "justify", component: typeof dialogContent?.body?.content === "string"
-                                    ? "span"
-                                    : "div", children: dialogContent?.body?.content })] })), children] }), dialogActions && (_jsxs(DialogActions, { sx: {
-                    display: "flex",
-                    width: "100%",
-                    gap: 4,
-                    p: 0,
-                    justifyContent: "space-between",
-                    alignItems: "flex-end",
-                }, ...dialogActions?.props, children: [dialogActions?.actionButtons?.map((actionButton, idx) => (_jsx(Button, { ...actionButton, sx: {
-                            stroke: (theme) => theme.palette.text.primary,
-                            ...actionButton.sx,
-                        }, children: actionButton?.label }, idx))), dialogActions?.actionComponent] }))] }));
-};
-export default CustomDialog;

package/dist/components/custom-input/CustomNumericInput.d.ts

@@ -1,9 +0,0 @@
-import { FC, ReactNode } from 'react';
-import { TextFieldProps } from '@mui/material/TextField';
-export interface ICustomNumericInputProps extends Omit<TextFieldProps, 'onChange' | 'value'> {
-    onChange?: (value: string | number) => void;
-    value?: string | number;
-    currencyIcon?: ReactNode;
-}
-declare const CustomNumericInput: FC<ICustomNumericInputProps>;
-export default CustomNumericInput;

package/dist/components/custom-input/CustomNumericInput.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import TextField from '@mui/material/TextField';
-const CustomNumericInput = ({ onChange, value, ...props }) => {
-    useEffect(() => {
-        setCustomValue(formatAsCurrency(value) ?? "");
-    }, [value]);
-    const [customValue, setCustomValue] = useState(formatAsCurrency(value));
-    function formatAsCurrency(number) {
-        // Use toLocaleString to format the number as currency
-        return number?.toLocaleString(); // Remove 'USD' and a space at the beginning
-    }
-    function convertCurrencyToNumber(currencyString) {
-        // Replace Persian numerals with Arabic numerals
-        const numericString = currencyString.replace(/[۰-۹]/g, (match) => String.fromCharCode(match.charCodeAt(0) - 1728));
-        // Remove all non-numeric characters except for the decimal point
-        const sanitizedNumericString = numericString.replace(/[^0-9.]/g, '');
-        // Parse the numeric string to a floating-point number
-        const numberValue = parseFloat(sanitizedNumericString);
-        // Check if the parsed value is a valid number (not NaN)
-        return isNaN(numberValue) ? '' : numberValue;
-    }
-    const handleChange = (e) => {
-        const value = e.target.value;
-        setCustomValue(formatAsCurrency(convertCurrencyToNumber(value)));
-        if (onChange) {
-            onChange(convertCurrencyToNumber(value));
-        }
-    };
-    return (_jsx(_Fragment, { children: _jsx(TextField, { fullWidth: true, className: 'numeric-input', value: customValue, onChange: handleChange, ...props }) }));
-};
-export default CustomNumericInput;

package/dist/components/custom-mobile-date-picker/CustomBottomSheet.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { DialogProps } from '@mui/material';
-interface ICustomBottomSheet extends DialogProps {
-    children?: React.ReactNode;
-    handleClose: (event?: object | undefined, reason?: string | undefined) => void;
-    withoutCloseButton?: boolean;
-}
-declare const CustomBottomSheet: ({ children, handleClose, open, sx, title, withoutCloseButton, ...dialogProps }: ICustomBottomSheet) => import("react/jsx-runtime").JSX.Element;
-export default CustomBottomSheet;

package/dist/components/custom-mobile-date-picker/CustomBottomSheet.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import Slide from '@mui/material/Slide';
-import { Box, Dialog, IconButton, Stack, styled, Typography, } from '@mui/material';
-import SvgAdd from '../../icons/Add';
-const CustomBottomSheet = ({ children, handleClose, open, sx, title, withoutCloseButton, ...dialogProps }) => {
-    return (_jsxs(Dialog, { fullScreen: true, open: open, onClose: handleClose, TransitionComponent: Transition, keepMounted: true, sx: [style, ...(Array.isArray(sx) ? sx : [sx])], ...dialogProps, children: [_jsxs(DialogHeader, { children: [_jsx(Typography, { variant: 'body3.bold', children: title }), !withoutCloseButton && (_jsx(IconButton, { "aria-label": 'close', onClick: handleClose, children: _jsx(SvgAdd, { style: { transform: 'rotate(45deg) scale(150%)' } }) }))] }), _jsx(Stack, { p: 6, gap: 8, children: children })] }));
-};
-export default CustomBottomSheet;
-const Transition = React.forwardRef(function Transition(props, ref) {
-    return (_jsx(Slide, { direction: 'up', ref: ref, ...props, style: { transitionDuration: '0.4s' } }));
-});
-const style = {
-    '.MuiDialog-paper': {
-        minWidth: '0px',
-        maxHeight: '80%',
-        minHeight: '60%',
-        height: 'max-content',
-        padding: 0,
-        transform: 'translateY(40%)',
-        maxWidth: 360,
-    },
-};
-const DialogHeader = styled(Box)({
-    width: '100%',
-    display: 'flex',
-    justifyContent: 'space-between',
-    padding: 12,
-});

package/dist/components/custom-mobile-date-picker/CustomMobileDatePicker.d.ts

@@ -1,19 +0,0 @@
-/// <reference types="react-date-object" />
-import { FC } from 'react';
-import { UseFormReturn } from 'react-hook-form';
-import { IDatePickerMobileForm } from '../input-list/type';
-type Props = IDatePickerMobileForm & {
-    form: UseFormReturn<any>;
-    error?: any;
-};
-export type TSelectedDate = {
-    month: number | null;
-    day: number | null;
-    year: number | null;
-};
-export declare const PERSIAN_CALENDARS: {
-    calendar: Omit<import("react-date-object").Calendar, "leapsLength">;
-    locale: import("react-date-object").Locale;
-};
-declare const MobileDatePicker: FC<Props>;
-export default MobileDatePicker;

package/dist/components/custom-mobile-date-picker/CustomMobileDatePicker.js

@@ -1,98 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { Controller } from 'react-hook-form';
-import { TextField, InputAdornment } from '@mui/material';
-import SvgCalendar from '../../icons/Calendar';
-import persian from 'react-date-object/calendars/persian';
-import persian_fa from 'react-date-object/locales/persian_fa';
-import { DateObject } from 'react-multi-date-picker';
-import DatePickerBottomSheet from './DatePickerBottomSheet';
-export const PERSIAN_CALENDARS = {
-    calendar: persian,
-    locale: persian_fa,
-};
-const calculateDaysInMonth = (isLeap) => [
-    31,
-    31,
-    31,
-    31,
-    31,
-    31,
-    30,
-    30,
-    30,
-    30,
-    30,
-    isLeap ? 30 : 29,
-];
-const createDateObject = (date, lang) => {
-    if (date)
-        return new DateObject({
-            date: new Date(date),
-            ...(lang.includes('fa') && {
-                calendar: persian,
-                locale: persian_fa,
-            }),
-        });
-};
-const MobileDatePicker = ({ form, name, defaultValue, label, rules, readonly, disabled, placeholder, error, itemProps, props, helperText, variant = 'outlined', withoutHelperText, inputLabelMode, }) => {
-    const lang = document.documentElement.lang;
-    const [open, setOpen] = useState(false);
-    const defaultValueDate = defaultValue
-        ? createDateObject(new Date(defaultValue), lang)
-        : form.getValues(name)
-            ? createDateObject(new Date(form.getValues(name)), lang)
-            : //Returns undefined because if Date Object bug for showing undefined year as -1 value
-                undefined;
-    const [value, setValue] = useState({
-        day: defaultValueDate?.day ?? null,
-        month: defaultValueDate?.month?.number ?? null,
-        year: defaultValueDate?.year && defaultValueDate.year > 1
-            ? defaultValueDate.year
-            : null,
-    });
-    const selectedDate = new DateObject({
-        ...(lang.includes('fa') && PERSIAN_CALENDARS),
-        date: `${value?.year}/${value?.month}/${value?.day}`,
-    });
-    const handleChange = () => {
-        form.setValue(name, selectedDate.toDate() || defaultValueDate?.toDate());
-        setOpen(false);
-    };
-    const getHelperText = () => {
-        if (withoutHelperText)
-            return undefined;
-        return error?.message ?? helperText ?? ' ';
-    };
-    const handleTextFieldClick = (e) => {
-        e.preventDefault();
-        setOpen(true);
-    };
-    const dayOptions = calculateDaysInMonth(selectedDate.isLeap)?.[(value?.month || 1) - 1];
-    const monthOptions = [{ name: '' }, ...selectedDate.months, { name: '' }];
-    return (_jsxs(_Fragment, { children: [_jsx(Controller, { control: form?.control, name: name, rules: { ...rules }, defaultValue: selectedDate.isValid ? selectedDate?.toDate() : undefined, render: ({ field }) => (_jsx(TextField, { ...(inputLabelMode === 'static' && { hiddenLabel: true }), ...(inputLabelMode === 'relative' && { label: label }), ...(defaultValue && {
-                        defaultValue: defaultValueDate,
-                    }), onChange: () => {
-                        form
-                            .register(name, { ...rules })
-                            .onChange({ target: { current: selectedDate.toDate() } });
-                    }, onBlur: () => {
-                        form
-                            .register(name, { ...rules })
-                            .onBlur({ target: { current: selectedDate.toDate() } });
-                    }, value: selectedDate?.format('YYYY/MM/DD'), defaultValue: selectedDate?.format('YYYY/MM/DD'), variant: variant, fullWidth: true, id: field?.name, error: !!error, onClick: !(disabled || readonly) && handleTextFieldClick, onTouchEnd: !(disabled || readonly) && handleTextFieldClick, placeholder: placeholder, helperText: getHelperText(), "aria-readonly": readonly, disabled: disabled, inputProps: { readOnly: readonly }, InputProps: {
-                        endAdornment: (_jsx(InputAdornment, { position: 'end', sx: {
-                                '& .MuiInputAdornment-positionStart': {
-                                    marginTop: '0 important',
-                                    backgroundColor: 'red',
-                                },
-                                stroke: ({ palette }) => disabled || readonly
-                                    ? palette.text.disabled
-                                    : error
-                                        ? palette.error.main
-                                        : palette.text.primary,
-                            }, children: _jsx(SvgCalendar, { primarycolor: 'inherit' }) })),
-                        ...itemProps?.InputProps,
-                    }, ...itemProps, ...props })) }), _jsx(DatePickerBottomSheet, { dayOptions: dayOptions, defaultValue: defaultValueDate, handleChange: setValue, handleClose: handleChange, handleSubmit: handleChange, label: String(label), monthOptions: monthOptions, open: open, value: value }, 'date-picker-bottom-sheet')] }));
-};
-export default MobileDatePicker;

package/dist/components/custom-mobile-date-picker/DatePickerBottomSheet.d.ts

@@ -1,19 +0,0 @@
-import { Dispatch, FC, SetStateAction } from 'react';
-import { Month } from 'react-date-object';
-import { DateObject } from 'react-multi-date-picker';
-import { TSelectedDate } from './CustomMobileDatePicker';
-type TDatePickerBottomSheetProps = {
-    open: boolean;
-    handleClose: () => void;
-    label: string;
-    handleChange: Dispatch<SetStateAction<TSelectedDate>>;
-    monthOptions: Month[] | {
-        name: string;
-    }[];
-    dayOptions: number;
-    value: TSelectedDate;
-    handleSubmit: () => void;
-    defaultValue: DateObject | undefined;
-};
-declare const DatePickerBottomSheet: FC<TDatePickerBottomSheetProps>;
-export default DatePickerBottomSheet;