@symply.io/basic-components 1.4.0-beta.6 → 1.4.0-beta.7

package/AlertDialog/index.d.ts

@@ -1,4 +1,4 @@
-import { AlertDialogProps } from "./types";
+import type { AlertDialogProps } from "./types";
 declare const AlertDialog: (props: AlertDialogProps) => JSX.Element;
 export default AlertDialog;
-export * from "./types";
+export type { AlertDialogProps };

package/AlertDialog/index.js

@@ -45,4 +45,3 @@ var AlertDialog = function (props) {
             }, "aria-labelledby": "alert-dialog-title", "aria-describedby": "alert-dialog-description" }, rest, { children: [_jsx(DialogTitle, __assign({ id: "alert-dialog-title" }, { children: title })), _jsx(DialogContent, { children: children }), _jsx(DialogActions, { children: DialogButtons ? (cloneElement(DialogButtons)) : (_jsx(Button, __assign({ onClick: onClose, color: "primary" }, { children: "OK" }))) })] })) })));
 };
 export default AlertDialog;
-export * from "./types";

package/AlertDialog/types.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement, CSSProperties } from "react";
-import { DialogProps } from "@mui/material/Dialog";
-import { DialogContentProps } from "@mui/material/DialogContent";
+import type { ReactElement, CSSProperties } from "react";
+import type { DialogProps } from "@mui/material/Dialog";
+import type { DialogContentProps } from "@mui/material/DialogContent";
 export interface AlertDialogProps {
     title?: string;
     maxWidth?: DialogProps["maxWidth"];

package/Autocomplete/index.d.ts

@@ -1,4 +1,4 @@
-import { AutocompleteProps } from "./types";
+import type { AutocompleteProps, AutocompleteValueType, AutocompleteOptionType } from "./types";
 declare function CustomAutocomplete<T, multiple extends boolean | undefined = false>(props: AutocompleteProps<T, multiple>): JSX.Element;
 export default CustomAutocomplete;
-export * from "./types";
+export type { AutocompleteProps, AutocompleteValueType, AutocompleteOptionType };

package/Autocomplete/index.js

@@ -49,4 +49,3 @@ function CustomAutocomplete(props) {
             }, renderInput: function (params) { return (_jsx(TextField, __assign({}, params, rest, { required: required, size: size, inputProps: __assign(__assign({}, params.inputProps), { required: required && (Array.isArray(value) ? value.length === 0 : !value) }) }))); } }) })));
 }
 export default CustomAutocomplete;
-export * from "./types";

package/Autocomplete/types.d.ts

@@ -1,5 +1,5 @@
-import { CSSProperties } from "react";
-import { TextFieldProps } from "@mui/material/TextField";
+import type { CSSProperties } from "react";
+import type { TextFieldProps } from "@mui/material/TextField";
 export declare type AutocompleteOptionType<T = {
     [name: string]: unknown;
 }> = T & {

package/AutocompleteWithFilter/index.d.ts

@@ -1,4 +1,4 @@
-import { AutocompleteWithFilterProps } from "./types";
+import type { AutocompleteWithFilterProps, AutocompleteWithFilterValueType, AutocompleteWithFilterOptionType } from "./types";
 declare function AutocompleteWithFilter<T, multiple extends boolean | undefined = false>(props: AutocompleteWithFilterProps<T, multiple>): JSX.Element;
 export default AutocompleteWithFilter;
-export * from "./types";
+export type { AutocompleteWithFilterProps, AutocompleteWithFilterValueType, AutocompleteWithFilterOptionType };

package/AutocompleteWithFilter/index.js

@@ -57,4 +57,3 @@ function AutocompleteWithFilter(props) {
             }, renderInput: function (params) { return (_jsx(TextField, __assign({}, params, rest, { variant: "outlined", required: required, inputProps: __assign(__assign({}, params.inputProps), { required: required && (Array.isArray(value) ? value.length === 0 : !value) }) }))); } }) })));
 }
 export default AutocompleteWithFilter;
-export * from "./types";

package/AutocompleteWithFilter/types.d.ts

@@ -1,12 +1,12 @@
-import { CSSProperties } from "react";
-import { TextFieldProps } from "@mui/material/TextField";
+import type { CSSProperties } from "react";
+import type { TextFieldProps } from "@mui/material/TextField";
 export declare type AutocompleteWithFilterOptionType<T> = T & {
     label: string;
     value?: string | number;
 };
-export declare type AutocompleteWithFilterlValueType<T, multiple extends boolean | undefined> = multiple extends false | undefined ? AutocompleteWithFilterOptionType<T> | null : Array<AutocompleteWithFilterOptionType<T>>;
+export declare type AutocompleteWithFilterValueType<T, multiple extends boolean | undefined> = multiple extends false | undefined ? AutocompleteWithFilterOptionType<T> | null : Array<AutocompleteWithFilterOptionType<T>>;
 export interface AutocompleteWithFilterProps<T, multiple extends boolean | undefined> extends Omit<TextFieldProps, "onChange" | "value" | "disabled"> {
-    value: AutocompleteWithFilterlValueType<T, multiple>;
+    value: AutocompleteWithFilterValueType<T, multiple>;
     options: Array<AutocompleteWithFilterOptionType<T>>;
     disableCloseOnSelect?: boolean;
     limitTags?: number;
@@ -15,5 +15,5 @@ export interface AutocompleteWithFilterProps<T, multiple extends boolean | undef
     loading?: boolean;
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];
-    onChange: (value: AutocompleteWithFilterlValueType<T, multiple>) => void;
+    onChange: (value: AutocompleteWithFilterValueType<T, multiple>) => void;
 }

package/BasicModal/index.d.ts

@@ -1,4 +1,4 @@
-import { BasicModalProps } from "./types";
+import type { BasicModalProps } from "./types";
 declare function BasicModal(props: BasicModalProps): JSX.Element;
 export default BasicModal;
-export * from "./types";
+export type { BasicModalProps };

package/BasicModal/index.js

@@ -49,4 +49,3 @@ function BasicModal(props) {
                     } }, { children: _jsx(Content, __assign({}, rest, { noForm: noForm, onClose: onClose, onSubmit: onSubmit })) })) })) })));
 }
 export default BasicModal;
-export * from "./types";

package/BasicModal/types.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode, CSSProperties } from "react";
-import { ButtonProps } from "@mui/material/Button";
+import type { ReactNode, CSSProperties } from "react";
+import type { ButtonProps } from "@mui/material/Button";
 export interface BasicModalContentProps {
     children: ReactNode;
     color?: ButtonProps["color"];

package/BreadCrumbs/index.d.ts

@@ -1,4 +1,4 @@
-import { BreadCrumbsProps } from "./types";
+import type { BreadCrumbsProps } from "./types";
 declare function Crumbs(props: BreadCrumbsProps): JSX.Element;
 export default Crumbs;
-export * from "./types";
+export type { BreadCrumbsProps };

package/BreadCrumbs/index.js

@@ -36,4 +36,3 @@ function Crumbs(props) {
                 })] })) })));
 }
 export default Crumbs;
-export * from "./types";

package/BreadCrumbs/types.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from "react";
+import type { CSSProperties } from "react";
 export interface BreadCrumbsProps {
     routes: Array<{
         href?: string;

package/CheckBox/index.d.ts

@@ -1,3 +1,4 @@
-export { default as CheckBox } from "./CheckBox";
-export { default as CheckBoxGroup } from "./CheckBoxGroup";
-export * from "./types";
+import { CheckBoxProps } from "./types";
+declare function CheckBox(props: CheckBoxProps): JSX.Element;
+export default CheckBox;
+export type { CheckBoxProps };

package/CheckBox/index.js

@@ -1,3 +1,36 @@
-export { default as CheckBox } from "./CheckBox";
-export { default as CheckBoxGroup } from "./CheckBoxGroup";
-export * from "./types";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 Checkbox from "@mui/material/Checkbox";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import ThemeProvider from "@mui/material/styles/ThemeProvider";
+import useCustomTheme from "../useCustomTheme";
+function CheckBox(props) {
+    var label = props.label, onChange = props.onChange, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["label", "onChange", "primaryColor", "secondaryColor"]);
+    var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(FormControlLabel, { control: _jsx(Checkbox, __assign({ onChange: function (event) {
+                    event.stopPropagation();
+                    onChange(event.target.checked);
+                } }, rest)), label: label }) })));
+}
+export default CheckBox;

package/CheckBox/types.d.ts

@@ -1,12 +1,8 @@
-import { CSSProperties, ReactElement } from "react";
-import { CheckboxProps } from "@mui/material/Checkbox";
-import { FormGroupProps } from "@mui/material/FormGroup";
+import type { CSSProperties, ReactElement } from "react";
+import type { CheckboxProps } from "@mui/material/Checkbox";
 export interface CheckBoxProps extends Omit<CheckboxProps, "onChange"> {
     label: string | ReactElement;
     onChange: (val: boolean) => void;
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];
 }
-export interface CheckBoxGroupProps extends FormGroupProps {
-    checkboxes: Array<CheckBoxProps>;
-}

package/CheckBoxGroup/index.d.ts

@@ -0,0 +1,4 @@
+import type { CheckBoxGroupProps } from "./types";
+declare function CheckBoxGroup(props: CheckBoxGroupProps): JSX.Element;
+export default CheckBoxGroup;
+export type { CheckBoxGroupProps };

package/{CheckBox/CheckBoxGroup.js → CheckBoxGroup/index.js}

@@ -22,8 +22,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import FormGroup from "@mui/material/FormGroup";
-import CheckBox from "./CheckBox";
-export function CheckBoxGroup(props) {
+import CheckBox from "../CheckBox";
+function CheckBoxGroup(props) {
     var checkboxes = props.checkboxes, rest = __rest(props, ["checkboxes"]);
     return (_jsx(FormGroup, __assign({}, rest, { children: checkboxes.map(function (checkbox, index) { return (_jsx(CheckBox, __assign({}, checkbox), index)); }) })));
 }

package/CheckBoxGroup/types.d.ts

@@ -0,0 +1,5 @@
+import type { FormGroupProps } from "@mui/material/FormGroup";
+import type { CheckBoxProps } from "../CheckBox";
+export interface CheckBoxGroupProps extends FormGroupProps {
+    checkboxes: Array<CheckBoxProps>;
+}

package/CheckBoxGroup/types.js

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

package/ConfirmPasswordInput/index.d.ts

@@ -0,0 +1,4 @@
+import type { ConfirmPasswordInputProps } from "./types";
+declare function ConfirmPasswordInput(props: ConfirmPasswordInputProps): JSX.Element;
+export default ConfirmPasswordInput;
+export type { ConfirmPasswordInputProps };

package/{PasswordInput/ConfirmPassword.js → ConfirmPasswordInput/index.js}

@@ -25,7 +25,7 @@ import { useMemo } from "react";
 import TextField from "@mui/material/TextField";
 import ThemeProvider from "@mui/material/styles/ThemeProvider";
 import useCustomTheme from "../useCustomTheme";
-function ConfirmPassword(props) {
+function ConfirmPasswordInput(props) {
     var password = props.password, _a = props.helperText, helperText = _a === void 0 ? "Passwords do not match" : _a, value = props.value, _b = props.label, label = _b === void 0 ? "Confirm Password" : _b, _c = props.name, name = _c === void 0 ? "confirmPassword" : _c, _d = props.variant, variant = _d === void 0 ? "outlined" : _d, _e = props.margin, margin = _e === void 0 ? "dense" : _e, disabled = props.disabled, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onChange = props.onChange, rest = __rest(props, ["password", "helperText", "value", "label", "name", "variant", "margin", "disabled", "primaryColor", "secondaryColor", "onChange"]);
     var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
     var isMatched = useMemo(function () {
@@ -39,4 +39,4 @@ function ConfirmPassword(props) {
                 onChange(event.target.value);
             }, fullWidth: true, required: true }, rest)) })));
 }
-export default ConfirmPassword;
+export default ConfirmPasswordInput;

package/ConfirmPasswordInput/types.d.ts

@@ -0,0 +1,9 @@
+import type { CSSProperties } from "react";
+import type { TextFieldProps } from "@mui/material/TextField";
+export interface ConfirmPasswordInputProps extends Omit<TextFieldProps, "onChange"> {
+    password: string;
+    value: string;
+    primaryColor?: CSSProperties["color"];
+    secondaryColor?: CSSProperties["color"];
+    onChange: (value: string) => void;
+}

package/ConfirmPasswordInput/types.js

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

package/Copyright/index.d.ts

@@ -1,4 +1,4 @@
-import { CopyrightProps } from "./types";
+import type { CopyrightProps } from "./types";
 declare function Copyright(props: CopyrightProps): JSX.Element;
 export default Copyright;
-export * from "./types";
+export type { CopyrightProps };

package/Copyright/index.js

@@ -20,4 +20,3 @@ function Copyright(props) {
     return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsxs(Typography, __assign({ sx: { fontSize: 16, fontWeight: 400 }, color: "textSecondary", align: "center" }, { children: ["Copyright © ", _jsx(Link, __assign({ color: "inherit", href: "https://symply.io/" }, { children: "Symply Software Inc" })), "\u00A0", new Date().getFullYear(), "."] })) })));
 }
 export default Copyright;
-export * from "./types";

package/Copyright/types.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from "react";
+import type { CSSProperties } from "react";
 export interface CopyrightProps {
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];

package/DataTable/index.d.ts

@@ -1,5 +1,6 @@
+import useDataTable from "./useTable";
 import { DataTableProps, KvProps } from "./types";
 declare function DataTable<RowProps extends KvProps, ExtendedProps extends KvProps>(props: DataTableProps<RowProps, ExtendedProps>): JSX.Element;
 export default DataTable;
 export * from "./types";
-export { default as useDataTable } from "./useTable";
+export { useDataTable };

package/DataTable/index.js

@@ -15,6 +15,7 @@ import Table from "@mui/material/Table";
 import TableContainer from "@mui/material/TableContainer";
 import ThemeProvider from "@mui/material/styles/ThemeProvider";
 import useCustomTheme from "../useCustomTheme";
+import useDataTable from "./useTable";
 import TableBody from "./TableBody";
 import TableHeader from "./TableHeader";
 import TableFooter from "./TableFooter";
@@ -58,4 +59,4 @@ function DataTable(props) {
 }
 export default DataTable;
 export * from "./types";
-export { default as useDataTable } from "./useTable";
+export { useDataTable };

package/DateInput/index.d.ts

@@ -1,6 +1,7 @@
+import MonthDayInput from "./MonthDayInput";
+import MonthYearInput from "./MonthYearInput";
+import FullDateInput from "./FullDateInput";
 export * from "./MonthDayInput";
 export * from "./MonthYearInput";
 export * from "./FullDateInput";
-export { default as MonthDayInput } from "./MonthDayInput";
-export { default as MonthYearInput } from "./MonthYearInput";
-export { default as FullDateInput } from "./FullDateInput";
+export { MonthDayInput, MonthYearInput, FullDateInput };

package/DateInput/index.js

@@ -1,6 +1,7 @@
+import MonthDayInput from "./MonthDayInput";
+import MonthYearInput from "./MonthYearInput";
+import FullDateInput from "./FullDateInput";
 export * from "./MonthDayInput";
 export * from "./MonthYearInput";
 export * from "./FullDateInput";
-export { default as MonthDayInput } from "./MonthDayInput";
-export { default as MonthYearInput } from "./MonthYearInput";
-export { default as FullDateInput } from "./FullDateInput";
+export { MonthDayInput, MonthYearInput, FullDateInput };

package/DigitInput/index.d.ts

@@ -1,4 +1,4 @@
-import { DigitInputProps } from "./types";
+import type { DigitInputProps } from "./types";
 declare function DigitInput(props: DigitInputProps): JSX.Element;
 export default DigitInput;
-export * from "./types";
+export type { DigitInputProps };

package/DigitInput/index.js

@@ -35,4 +35,3 @@ function DigitInput(props) {
                 }, onChange: handleChange }, rest)) })) })));
 }
 export default DigitInput;
-export * from "./types";

package/DigitInput/types.d.ts

@@ -1,6 +1,6 @@
-import { CSSProperties } from "react";
-import { InputProps } from "@mui/material/Input";
-import { TextFieldProps } from "@mui/material/TextField";
+import type { CSSProperties } from "react";
+import type { InputProps } from "@mui/material/Input";
+import type { TextFieldProps } from "@mui/material/TextField";
 export interface DigitInputProps extends Omit<TextFieldProps, "onChange"> {
     onChange: (value: string) => void;
     value: string;

package/DynamicHeaderBar/HeaderBar.d.ts

@@ -1,15 +1,3 @@
-import { ReactElement, CSSProperties } from "react";
-import { HeaderButtonProps } from "./types";
-export interface HeaderBarProps {
-    title: string | ReactElement;
-    color?: CSSProperties["color"];
-    subtitle?: string | ReactElement;
-    bottomEl?: ReactElement;
-    buttons?: Array<HeaderButtonProps>;
-    showBackButton?: boolean;
-    primaryColor?: CSSProperties["color"];
-    secondaryColor?: CSSProperties["color"];
-    onBack?: () => void;
-}
+import type { HeaderBarProps } from "./types";
 declare function HeaderBar(props: HeaderBarProps): JSX.Element;
 export default HeaderBar;

package/DynamicHeaderBar/HeaderButtons.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties } from "react";
 import { HeaderButtonProps } from "./types";
-export interface HeaderButtonsProps {
+interface HeaderButtonsProps {
     buttons: Array<HeaderButtonProps>;
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];

package/DynamicHeaderBar/HeaderLine.d.ts

@@ -1,8 +1,3 @@
-import { CSSProperties } from "react";
-interface HeaderLineProps {
-    color?: CSSProperties["color"];
-    primaryColor?: CSSProperties["color"];
-    secondaryColor?: CSSProperties["color"];
-}
+import type { HeaderLineProps } from "./types";
 declare function HeaderLine(props: HeaderLineProps): JSX.Element;
 export default HeaderLine;

package/DynamicHeaderBar/index.d.ts

@@ -1,23 +1,7 @@
-import { ReactElement, CSSProperties } from "react";
-import { SxProps } from "@mui/material/styles";
-import { HeaderBarProps } from "./HeaderBar";
-interface HeaderProviderProps {
-    sx?: SxProps;
-    children: ReactElement;
-    primaryColor?: CSSProperties["color"];
-    secondaryColor?: CSSProperties["color"];
-}
-interface HeaderContextProps {
-    onInit: (props: HeaderBarProps) => void;
-    onShow: () => void;
-    onHide: () => void;
-}
+import type { HeaderContextProps, HeaderProviderProps } from "./types";
 export declare function HeaderProvider(props: HeaderProviderProps): JSX.Element;
 export declare function useHeaderBar(): HeaderContextProps;
 export { default } from "./HeaderBar";
 export { default as HeaderButtons } from "./HeaderButtons";
 export { default as HeaderLine } from "./HeaderLine";
-export * from "./HeaderBar";
-export * from "./HeaderButtons";
-export * from "./HeaderLine";
 export * from "./types";

package/DynamicHeaderBar/index.js

@@ -51,7 +51,4 @@ export function useHeaderBar() {
 export { default } from "./HeaderBar";
 export { default as HeaderButtons } from "./HeaderButtons";
 export { default as HeaderLine } from "./HeaderLine";
-export * from "./HeaderBar";
-export * from "./HeaderButtons";
-export * from "./HeaderLine";
 export * from "./types";

package/DynamicHeaderBar/types.d.ts

@@ -1,8 +1,9 @@
-import { ReactElement } from "react";
-import { ButtonProps } from "@mui/material/Button";
-import { IconButtonProps } from "@mui/material/IconButton";
-import { FabProps } from "@mui/material/Fab";
-import { MenuButtonGroupProps } from "../MenuButtonGroup";
+import type { ReactElement, CSSProperties } from "react";
+import type { ButtonProps } from "@mui/material/Button";
+import type { IconButtonProps } from "@mui/material/IconButton";
+import type { FabProps } from "@mui/material/Fab";
+import type { SxProps } from "@mui/material/styles";
+import type { MenuButtonGroupProps } from "../MenuButtonGroup";
 export declare enum HeaderButtonCategory {
     IconButton = "icon",
     TextButton = "text",
@@ -43,4 +44,31 @@ declare type HeaderMenuButtonProps = {
     type: HeaderButtonCategory.MenuButton;
 } & MenuButtonGroupProps;
 export declare type HeaderButtonProps = HeaderFabButtonProps | HeaderTextButtonProps | HeaderIconButtonProps | HeaderMenuButtonProps;
+export interface HeaderLineProps {
+    color?: CSSProperties["color"];
+    primaryColor?: CSSProperties["color"];
+    secondaryColor?: CSSProperties["color"];
+}
+export interface HeaderBarProps {
+    title: string | ReactElement;
+    color?: CSSProperties["color"];
+    subtitle?: string | ReactElement;
+    bottomEl?: ReactElement;
+    buttons?: Array<HeaderButtonProps>;
+    showBackButton?: boolean;
+    primaryColor?: CSSProperties["color"];
+    secondaryColor?: CSSProperties["color"];
+    onBack?: () => void;
+}
+export interface HeaderProviderProps {
+    sx?: SxProps;
+    children: ReactElement;
+    primaryColor?: CSSProperties["color"];
+    secondaryColor?: CSSProperties["color"];
+}
+export interface HeaderContextProps {
+    onInit: (props: HeaderBarProps) => void;
+    onShow: () => void;
+    onHide: () => void;
+}
 export {};

package/FeinInput/index.d.ts

@@ -1,6 +1,6 @@
-import { FeinInputProps } from "./types";
+import type { FeinInputProps } from "./types";
 export declare function FeinInputFormat(str: string): string;
 export declare function onValidateFein(feinString: string): boolean;
 declare function FeinInput(props: FeinInputProps): JSX.Element;
 export default FeinInput;
-export * from "./types";
+export type { FeinInputProps };

package/FeinInput/index.js

@@ -72,4 +72,3 @@ function FeinInput(props) {
             } }, rest)) })));
 }
 export default FeinInput;
-export * from "./types";

package/FeinInput/types.d.ts

@@ -1,5 +1,5 @@
-import { CSSProperties } from "react";
-import { TextFieldProps } from "@mui/material/TextField";
+import type { CSSProperties } from "react";
+import type { TextFieldProps } from "@mui/material/TextField";
 export interface FeinInputProps extends Omit<TextFieldProps, "onChange"> {
     onChange: (value: string) => void;
     onValidate?: (value?: string) => boolean;

package/FileUploader/index.d.ts

@@ -1,4 +1,4 @@
-import { FileUploaderProps } from "./types";
+import type { FileUploaderProps } from "./types";
 declare function FileUploader(props: FileUploaderProps): JSX.Element;
 export default FileUploader;
-export * from "./types";
+export type { FileUploaderProps };

package/FileUploader/index.js

@@ -60,4 +60,3 @@ function FileUploader(props) {
                             }, disabled: disabled }, { children: _jsx(Typography, { children: chooseFileText || "Choose a file" }) }))] })) }))), _jsx(AlertDialog, __assign({ open: alertArgs.open, primaryColor: primaryColor, secondaryColor: secondaryColor, onClose: onCloseAlert }, { children: alertArgs.message }))] })));
 }
 export default FileUploader;
-export * from "./types";

package/FormRadioGroup/index.d.ts

@@ -1,4 +1,4 @@
-import { FormRadioGroupProps } from "./types";
+import type { RadioOption, FormRadioGroupProps } from "./types";
 declare function FormRadioGroup(props: FormRadioGroupProps): JSX.Element;
 export default FormRadioGroup;
-export * from "./types";
+export type { RadioOption, FormRadioGroupProps };

package/FormRadioGroup/index.js

@@ -41,4 +41,3 @@ function FormRadioGroup(props) {
                     }) }))] })) })));
 }
 export default FormRadioGroup;
-export * from "./types";

package/FormRadioGroup/types.d.ts

@@ -1,14 +1,14 @@
 import { CSSProperties } from "react";
 import { FormControlProps } from "@mui/material/FormControl";
 import { FormControlLabelProps } from "@mui/material/FormControlLabel";
-interface IRadioOption {
+export declare type RadioOption = {
     label: string;
     value: string | boolean | number;
     disabled?: boolean;
-}
+};
 export interface FormRadioGroupProps extends Omit<FormControlProps, "onChange"> {
     formLabel: string;
-    options: Array<IRadioOption>;
+    options: Array<RadioOption>;
     value: string | boolean | number;
     tooltip?: string;
     primaryColor?: CSSProperties["color"];
@@ -16,4 +16,3 @@ export interface FormRadioGroupProps extends Omit<FormControlProps, "onChange">
     radioLabelPlacement?: FormControlLabelProps["labelPlacement"];
     onChange: (value: string | boolean | number) => void;
 }
-export {};

package/HelpCaption/index.d.ts

@@ -1,5 +1,5 @@
 import { CSSProperties } from "react";
-export interface HelpCaptionProps {
+export declare type HelpCaptionProps = {
     mainCaption: string;
     subCaption?: string;
     linkUrl?: string;
@@ -7,6 +7,6 @@ export interface HelpCaptionProps {
     linkType?: "WEBPAGE" | "VIDEO";
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];
-}
+};
 declare function HelpCaption(props: HelpCaptionProps): JSX.Element;
 export default HelpCaption;

package/LoadingModal/index.d.ts

@@ -1,4 +1,5 @@
 import LoadingModal from "./Modal";
+import useLoadingModal, { LoadingModalProvider } from "./useLoadingModal";
 export default LoadingModal;
-export * from "./useLoadingModal";
+export { useLoadingModal, LoadingModalProvider };
 export * from "./types";

package/LoadingModal/index.js

@@ -1,4 +1,6 @@
+"use client";
 import LoadingModal from "./Modal";
+import useLoadingModal, { LoadingModalProvider } from "./useLoadingModal";
 export default LoadingModal;
-export * from "./useLoadingModal";
+export { useLoadingModal, LoadingModalProvider };
 export * from "./types";

package/LoadingModal/useLoadingModal.d.ts

@@ -1,3 +1,3 @@
 import { LoadingModalContextProps, LoadingModalProviderProps } from "./types";
 export declare function LoadingModalProvider(props: LoadingModalProviderProps): JSX.Element;
-export declare function useLoadingModal(): LoadingModalContextProps;
+export default function useLoadingModal(): LoadingModalContextProps;

package/LoadingModal/useLoadingModal.js

@@ -52,6 +52,6 @@ export function LoadingModalProvider(props) {
     }, []);
     return (_jsx(LoadingModalContext.Provider, __assign({ value: { onOpenLoadingModal: onOpenLoadingModal, onCloseLoadingModal: onCloseLoadingModal } }, { children: _jsxs(_Fragment, { children: [cloneElement(children), _jsx(LoadingModal, __assign({}, modalArgs, { primaryColor: primaryColor, secondaryColor: secondaryColor }))] }) })));
 }
-export function useLoadingModal() {
+export default function useLoadingModal() {
     return useContext(LoadingModalContext);
 }

package/PasswordInput/index.d.ts

@@ -1,4 +1,6 @@
-export { default as Password } from "./Password";
-export * from "./Password";
-export { default as ConfirmPassword } from "./ConfirmPassword";
-export * from "./ConfirmPassword";
+import type { PasswordInputProps, PasswordStrategyProps } from "./types";
+declare function onValidatePassword(password: string): boolean;
+declare function PasswordInput(props: PasswordInputProps): JSX.Element;
+export default PasswordInput;
+export { onValidatePassword };
+export type { PasswordInputProps, PasswordStrategyProps };

package/PasswordInput/index.js

@@ -1,4 +1,79 @@
-export { default as Password } from "./Password";
-export * from "./Password";
-export { default as ConfirmPassword } from "./ConfirmPassword";
-export * from "./ConfirmPassword";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo } from "react";
+import TextField from "@mui/material/TextField";
+import Typography from "@mui/material/Typography";
+import ThemeProvider from "@mui/material/styles/ThemeProvider";
+import useCustomTheme from "../useCustomTheme";
+function onValidatePassword(password) {
+    var reg = /^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~])([!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~a-zA-z0-9]{8,})$/;
+    return reg.test(password);
+}
+function PasswordInput(props) {
+    var _a = props.strategies, strategies = _a === void 0 ? {
+        uppercaseLetter: { label: "1 Uppercase Letter", regex: /[A-Z]+/ },
+        lowercaseLetter: { label: "1 Lowercase Letter", regex: /[a-z]+/ },
+        specialCharacter: {
+            label: "1 Special Character",
+            regex: /[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]/
+        },
+        number: { label: "1 Number", regex: /\d+/ },
+        minimum8: { label: "Minimum 8 characters", regex: /.{8,}/ }
+    } : _a, _b = props.successColor, successColor = _b === void 0 ? "green" : _b, value = props.value, error = props.error, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onValidate = props.onValidate, onChange = props.onChange, rest = __rest(props, ["strategies", "successColor", "value", "error", "primaryColor", "secondaryColor", "onValidate", "onChange"]);
+    var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
+    var isValidPassword = useMemo(function () {
+        if ((value === null || value === void 0 ? void 0 : value.length) > 0) {
+            return onValidate ? onValidate(value) : onValidatePassword(value);
+        }
+        return true;
+    }, [value, onValidate, onValidatePassword]);
+    var helperTextColor = useMemo(function () {
+        var textColors = Object.keys(strategies).reduce(function (temp, key) {
+            var regex = strategies[key].regex;
+            if (value === "") {
+                temp[key] = undefined;
+            }
+            else if (regex.test(value)) {
+                temp[key] = successColor;
+            }
+            else {
+                temp[key] = "red";
+            }
+            return temp;
+        }, {});
+        return textColors;
+    }, [value, strategies]);
+    var helperText = useMemo(function () {
+        return (_jsx(_Fragment, { children: Object.keys(strategies).map(function (key) {
+                var label = strategies[key].label;
+                return (_jsx(Typography, __assign({ component: "li", variant: "caption", style: { color: helperTextColor[key] } }, { children: label }), key));
+            }) }));
+    }, [helperTextColor, strategies]);
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(TextField, __assign({ error: !isValidPassword || error, helperText: helperText, type: "password", label: "Password", size: "small", margin: "dense", value: value, onChange: function (event) {
+                event.preventDefault();
+                onChange(event.target.value);
+            }, fullWidth: true, required: true }, rest)) })));
+}
+export default PasswordInput;
+export { onValidatePassword };

package/PasswordInput/{Password.d.ts → types.d.ts}

@@ -1,12 +1,12 @@
-import { CSSProperties } from "react";
-import { TextFieldProps } from "@mui/material/TextField";
+import type { CSSProperties } from "react";
+import type { TextFieldProps } from "@mui/material/TextField";
 export interface PasswordStrategyProps {
     [key: string]: {
         label: string;
         regex: RegExp;
     };
 }
-export interface PasswordProps extends Omit<TextFieldProps, "onChange"> {
+export interface PasswordInputProps extends Omit<TextFieldProps, "onChange"> {
     strategies?: PasswordStrategyProps;
     value: string;
     successColor?: CSSProperties["color"];
@@ -15,6 +15,3 @@ export interface PasswordProps extends Omit<TextFieldProps, "onChange"> {
     onChange: (value: string) => void;
     onValidate?: (value: string) => boolean;
 }
-export declare function onValidatePassword(password: string): boolean;
-declare function Password(props: PasswordProps): JSX.Element;
-export default Password;

package/PasswordInput/types.js

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

package/README.md

@@ -237,9 +237,7 @@ It is extended from `@mui/material/Checkbox`, so it includes all properties of `
 ```typescript
 import { CheckBox } from '@symply.io/basic-components/';
 // or 
-import { CheckBox } from '@symply.io/basic-components/CheckBox'; 
-// or 
-import CheckBox from '@symply.io/basic-components/CheckBox/CheckBox'; 
+import CheckBox from '@symply.io/basic-components/CheckBox'; 
 ```
 
 <h5>Props</h5>
@@ -262,9 +260,7 @@ It is extended from `@mui/material/FormGroup`, so it includes all properties of
 ```typescript
 import { CheckBoxGroup } from '@symply.io/basic-components/';
 // or 
-import { CheckBoxGroup } from '@symply.io/basic-components/CheckBox'; 
-// or 
-import CheckBoxGroup from '@symply.io/basic-components/CheckBox/CheckBoxGroup'; 
+import CheckBoxGroup from '@symply.io/basic-components/CheckBoxGroup'; 
 ```
 
 <h5>Props</h5>
@@ -701,9 +697,9 @@ It is extended from `@mui/material/TextField`, so it includes all properties of
 
 ```typescript
 // Password
-import { Password } from '@symply.io/basic-components/PasswordInput';
+import Password from '@symply.io/basic-components/PasswordInput';
 // Confirm Password 
-import { ConfirmPassword } from '@symply.io/basic-components/PasswordInput'; 
+import ConfirmPassword from '@symply.io/basic-components/ConfirmPasswordInput'; 
 ```
 
 <h5>Password Props</h5>

package/SocialInput/index.d.ts

@@ -1,6 +1,6 @@
-import { SocialInputProps } from "./types";
+import type { SocialInputProps } from "./types";
 export declare function SocialInputFormat(str: string): string;
 export declare function onValidateSocial(socialString: string): boolean;
 declare function SocialInput(props: SocialInputProps): JSX.Element;
 export default SocialInput;
-export * from "./types";
+export type { SocialInputProps };

package/SocialInput/index.js

@@ -74,4 +74,3 @@ function SocialInput(props) {
             } }, rest)) })));
 }
 export default SocialInput;
-export * from "./types";

package/TabGroup/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { TabGroupProps } from "./types";
+import type { TabGroupProps } from "./types";
 declare const TabGroup: import("react").ForwardRefExoticComponent<TabGroupProps & import("react").RefAttributes<unknown>>;
 export default TabGroup;
-export * from "./types";
+export type { TabGroupProps };

package/TabGroup/index.js

@@ -48,4 +48,3 @@ var TabGroup = forwardRef(function (props, ref) {
             }) })) })));
 });
 export default TabGroup;
-export * from "./types";

package/TablePagination/index.d.ts

@@ -1,4 +1,4 @@
-import { TablePaginationProps } from "./types";
+import type { TablePaginationProps } from "./types";
 declare function Pagination(props: TablePaginationProps): JSX.Element;
 export default Pagination;
-export * from "./types";
+export type { TablePaginationProps };

package/TablePagination/index.js

@@ -20,4 +20,3 @@ function Pagination(props) {
     return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: count ? (_jsx(TablePagination, { component: "div", colSpan: colSpan, count: count, rowsPerPage: rowsPerPage, page: page, SelectProps: { native: true }, rowsPerPageOptions: rowsPerPageOptions, onPageChange: onPageChange, onRowsPerPageChange: onRowsPerPageChange, ActionsComponent: TablePaginationActions })) : (_jsx(_Fragment, {})) })));
 }
 export default Pagination;
-export * from "./types";

package/TextInput/index.d.ts

@@ -9,5 +9,5 @@ export interface TextInputProps extends Omit<TextFieldProps, "onChange"> {
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];
 }
-declare const TextInput: (props: TextInputProps) => JSX.Element;
+declare function TextInput(props: TextInputProps): JSX.Element;
 export default TextInput;

package/TextInput/index.js

@@ -26,7 +26,7 @@ import Field from "@mui/material/TextField";
 import ThemeProvider from "@mui/material/styles/ThemeProvider";
 import useInteractions from "./useInteractions";
 import useCustomTheme from "../useCustomTheme";
-var TextInput = function (props) {
+function TextInput(props) {
     var _a = props.type, type = _a === void 0 ? "text" : _a, onChange = props.onChange, value = props.value, _b = props.size, size = _b === void 0 ? "small" : _b, tooltip = props.tooltip, _c = props.maxLength, maxLength = _c === void 0 ? 999 : _c, _d = props.minLength, minLength = _d === void 0 ? 0 : _d, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onBlur = props.onBlur, onFocus = props.onFocus, rest = __rest(props, ["type", "onChange", "value", "size", "tooltip", "maxLength", "minLength", "primaryColor", "secondaryColor", "onBlur", "onFocus"]);
     var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
     var _e = useInteractions(), tooltipOpen = _e.tooltipOpen, onOpenTooltip = _e.onOpenTooltip, onCloseTooltip = _e.onCloseTooltip;
@@ -42,5 +42,5 @@ var TextInput = function (props) {
                     event.preventDefault();
                     onChange(event.target.value);
                 }, inputProps: { maxLength: maxLength, minLength: minLength } }, rest)) })) })));
-};
+}
 export default TextInput;

package/VideoPlayerModal/index.d.ts

@@ -1,4 +1,4 @@
-import { VideoPlayerModalProps } from "./types";
+import type { VideoPlayerModalProps } from "./types";
 declare function VideoPlayerModal(props: VideoPlayerModalProps): JSX.Element;
 export default VideoPlayerModal;
-export * from "./types";
+export type { VideoPlayerModalProps };

package/VideoPlayerModal/index.js

@@ -40,4 +40,3 @@ function VideoPlayerModal(props) {
                         } }, playerProps)) }), _jsx(DialogActions, { children: _jsxs(Grid, __assign({ container: true, direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 1 }, { children: [extraButtons.map(function (buttonProps, index) { return (_jsx(Grid, __assign({ item: true, xs: 12, md: 3, lg: 2 }, { children: _jsx(Button, __assign({}, buttonProps)) }), "extraButton_".concat(index))); }), _jsx(Grid, __assign({ item: true, xs: 12, md: 2, lg: 1 }, { children: _jsx(Button, __assign({ variant: "outlined", fullWidth: true, color: "secondary", onClick: onClose }, { children: "Close" })) }))] })) })] })) })));
 }
 export default VideoPlayerModal;
-export * from "./types";

package/index.d.ts

@@ -4,6 +4,8 @@ export * from "./AutocompleteWithFilter";
 export * from "./BasicModal";
 export * from "./BreadCrumbs";
 export * from "./CheckBox";
+export * from "./CheckBoxGroup";
+export * from "./ConfirmPasswordInput";
 export * from "./Copyright";
 export * from "./DataTable";
 export * from "./DateInput";
@@ -31,6 +33,9 @@ export { default as Autocomplete } from "./Autocomplete";
 export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
 export { default as BasicModal } from "./BasicModal";
 export { default as BreadCrumbs } from "./BreadCrumbs";
+export { default as CheckBox } from "./CheckBox";
+export { default as CheckBoxGroup } from "./CheckBoxGroup";
+export { default as ConfirmPasswordInput } from "./ConfirmPasswordInput";
 export { default as Copyright } from "./Copyright";
 export { default as DataTable } from "./DataTable";
 export { default as DigitInput } from "./DigitInput";
@@ -42,6 +47,7 @@ export { default as HelpCaption } from "./HelpCaption";
 export { default as LoadingModal } from "./LoadingModal";
 export { default as MenuButtonGroup } from "./MenuButtonGroup";
 export { default as NumberInput } from "./NumberInput";
+export { default as PasswordInput } from "./PasswordInput";
 export { default as PhoneNumberInput } from "./PhoneNumberInput";
 export { default as Sidebar } from "./Sidebar";
 export { default as SocialInput } from "./SocialInput";

package/index.js

@@ -4,6 +4,8 @@ export * from "./AutocompleteWithFilter";
 export * from "./BasicModal";
 export * from "./BreadCrumbs";
 export * from "./CheckBox";
+export * from "./CheckBoxGroup";
+export * from "./ConfirmPasswordInput";
 export * from "./Copyright";
 export * from "./DataTable";
 export * from "./DateInput";
@@ -31,6 +33,9 @@ export { default as Autocomplete } from "./Autocomplete";
 export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
 export { default as BasicModal } from "./BasicModal";
 export { default as BreadCrumbs } from "./BreadCrumbs";
+export { default as CheckBox } from "./CheckBox";
+export { default as CheckBoxGroup } from "./CheckBoxGroup";
+export { default as ConfirmPasswordInput } from "./ConfirmPasswordInput";
 export { default as Copyright } from "./Copyright";
 export { default as DataTable } from "./DataTable";
 export { default as DigitInput } from "./DigitInput";
@@ -42,6 +47,7 @@ export { default as HelpCaption } from "./HelpCaption";
 export { default as LoadingModal } from "./LoadingModal";
 export { default as MenuButtonGroup } from "./MenuButtonGroup";
 export { default as NumberInput } from "./NumberInput";
+export { default as PasswordInput } from "./PasswordInput";
 export { default as PhoneNumberInput } from "./PhoneNumberInput";
 export { default as Sidebar } from "./Sidebar";
 export { default as SocialInput } from "./SocialInput";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symply.io/basic-components",
-  "version": "1.4.0-beta.6",
+  "version": "1.4.0-beta.7",
   "description": "Basic and reusable components for all frontend of Symply apps",
   "keywords": [
     "react",
@@ -8,7 +8,6 @@
     "material-ui"
   ],
   "main": "index.js",
-  "type": "module",
   "types": "**/*.d.ts",
   "license": "MIT",
   "private": false,

package/CheckBox/CheckBox.d.ts

@@ -1,3 +0,0 @@
-import { CheckBoxProps } from "./types";
-export declare function CheckBox(props: CheckBoxProps): JSX.Element;
-export default CheckBox;

package/CheckBox/CheckBox.js

@@ -1,36 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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 Checkbox from "@mui/material/Checkbox";
-import FormControlLabel from "@mui/material/FormControlLabel";
-import ThemeProvider from "@mui/material/styles/ThemeProvider";
-import useCustomTheme from "../useCustomTheme";
-export function CheckBox(props) {
-    var label = props.label, onChange = props.onChange, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["label", "onChange", "primaryColor", "secondaryColor"]);
-    var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(FormControlLabel, { control: _jsx(Checkbox, __assign({ onChange: function (event) {
-                    event.stopPropagation();
-                    onChange(event.target.checked);
-                } }, rest)), label: label }) })));
-}
-export default CheckBox;

package/CheckBox/CheckBoxGroup.d.ts

@@ -1,3 +0,0 @@
-import { CheckBoxGroupProps } from "./types";
-export declare function CheckBoxGroup(props: CheckBoxGroupProps): JSX.Element;
-export default CheckBoxGroup;

package/PasswordInput/ConfirmPassword.d.ts

@@ -1,11 +0,0 @@
-import { CSSProperties } from "react";
-import { TextFieldProps } from "@mui/material/TextField";
-export interface ConfirmPasswordProps extends Omit<TextFieldProps, "onChange"> {
-    password: string;
-    value: string;
-    primaryColor?: CSSProperties["color"];
-    secondaryColor?: CSSProperties["color"];
-    onChange: (value: string) => void;
-}
-declare function ConfirmPassword(props: ConfirmPasswordProps): JSX.Element;
-export default ConfirmPassword;

package/PasswordInput/Password.js

@@ -1,78 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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, Fragment as _Fragment } from "react/jsx-runtime";
-import { useMemo } from "react";
-import TextField from "@mui/material/TextField";
-import Typography from "@mui/material/Typography";
-import ThemeProvider from "@mui/material/styles/ThemeProvider";
-import useCustomTheme from "../useCustomTheme";
-export function onValidatePassword(password) {
-    var reg = /^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~])([!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~a-zA-z0-9]{8,})$/;
-    return reg.test(password);
-}
-function Password(props) {
-    var _a = props.strategies, strategies = _a === void 0 ? {
-        uppercaseLetter: { label: "1 Uppercase Letter", regex: /[A-Z]+/ },
-        lowercaseLetter: { label: "1 Lowercase Letter", regex: /[a-z]+/ },
-        specialCharacter: {
-            label: "1 Special Character",
-            regex: /[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]/
-        },
-        number: { label: "1 Number", regex: /\d+/ },
-        minimum8: { label: "Minimum 8 characters", regex: /.{8,}/ }
-    } : _a, _b = props.successColor, successColor = _b === void 0 ? "green" : _b, value = props.value, error = props.error, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onValidate = props.onValidate, onChange = props.onChange, rest = __rest(props, ["strategies", "successColor", "value", "error", "primaryColor", "secondaryColor", "onValidate", "onChange"]);
-    var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
-    var isValidPassword = useMemo(function () {
-        if ((value === null || value === void 0 ? void 0 : value.length) > 0) {
-            return onValidate ? onValidate(value) : onValidatePassword(value);
-        }
-        return true;
-    }, [value, onValidate, onValidatePassword]);
-    var helperTextColor = useMemo(function () {
-        var textColors = Object.keys(strategies).reduce(function (temp, key) {
-            var regex = strategies[key].regex;
-            if (value === "") {
-                temp[key] = undefined;
-            }
-            else if (regex.test(value)) {
-                temp[key] = successColor;
-            }
-            else {
-                temp[key] = "red";
-            }
-            return temp;
-        }, {});
-        return textColors;
-    }, [value, strategies]);
-    var helperText = useMemo(function () {
-        return (_jsx(_Fragment, { children: Object.keys(strategies).map(function (key) {
-                var label = strategies[key].label;
-                return (_jsx(Typography, __assign({ component: "li", variant: "caption", style: { color: helperTextColor[key] } }, { children: label }), key));
-            }) }));
-    }, [helperTextColor, strategies]);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(TextField, __assign({ error: !isValidPassword || error, helperText: helperText, type: "password", label: "Password", size: "small", margin: "dense", value: value, onChange: function (event) {
-                event.preventDefault();
-                onChange(event.target.value);
-            }, fullWidth: true, required: true }, rest)) })));
-}
-export default Password;