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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/AlertDialog/index.d.ts +2 -2
  2. package/AlertDialog/index.js +0 -1
  3. package/AlertDialog/types.d.ts +3 -3
  4. package/Autocomplete/index.d.ts +2 -2
  5. package/Autocomplete/index.js +0 -1
  6. package/Autocomplete/types.d.ts +2 -2
  7. package/AutocompleteWithFilter/index.d.ts +2 -2
  8. package/AutocompleteWithFilter/index.js +0 -1
  9. package/AutocompleteWithFilter/types.d.ts +5 -5
  10. package/BasicModal/index.d.ts +2 -2
  11. package/BasicModal/index.js +0 -1
  12. package/BasicModal/types.d.ts +2 -2
  13. package/BreadCrumbs/index.d.ts +2 -2
  14. package/BreadCrumbs/index.js +0 -1
  15. package/BreadCrumbs/types.d.ts +1 -1
  16. package/CheckBox/index.d.ts +4 -3
  17. package/CheckBox/index.js +36 -3
  18. package/CheckBox/types.d.ts +2 -6
  19. package/CheckBoxGroup/index.d.ts +4 -0
  20. package/{CheckBox/CheckBoxGroup.js → CheckBoxGroup/index.js} +2 -2
  21. package/CheckBoxGroup/types.d.ts +5 -0
  22. package/CheckBoxGroup/types.js +1 -0
  23. package/ConfirmPasswordInput/index.d.ts +4 -0
  24. package/{PasswordInput/ConfirmPassword.js → ConfirmPasswordInput/index.js} +2 -2
  25. package/ConfirmPasswordInput/types.d.ts +9 -0
  26. package/ConfirmPasswordInput/types.js +1 -0
  27. package/Copyright/index.d.ts +2 -2
  28. package/Copyright/index.js +0 -1
  29. package/Copyright/types.d.ts +1 -1
  30. package/DataTable/index.d.ts +2 -1
  31. package/DataTable/index.js +2 -1
  32. package/DateInput/index.d.ts +4 -3
  33. package/DateInput/index.js +4 -3
  34. package/DigitInput/index.d.ts +2 -2
  35. package/DigitInput/index.js +0 -1
  36. package/DigitInput/types.d.ts +3 -3
  37. package/DynamicHeaderBar/HeaderBar.d.ts +1 -13
  38. package/DynamicHeaderBar/HeaderButtons.d.ts +1 -1
  39. package/DynamicHeaderBar/HeaderLine.d.ts +1 -6
  40. package/DynamicHeaderBar/index.d.ts +1 -17
  41. package/DynamicHeaderBar/index.js +0 -3
  42. package/DynamicHeaderBar/types.d.ts +33 -5
  43. package/FeinInput/index.d.ts +2 -2
  44. package/FeinInput/index.js +0 -1
  45. package/FeinInput/types.d.ts +2 -2
  46. package/FileUploader/index.d.ts +2 -2
  47. package/FileUploader/index.js +0 -1
  48. package/FormRadioGroup/index.d.ts +2 -2
  49. package/FormRadioGroup/index.js +0 -1
  50. package/FormRadioGroup/types.d.ts +3 -4
  51. package/HelpCaption/index.d.ts +2 -2
  52. package/LoadingModal/index.d.ts +2 -1
  53. package/LoadingModal/index.js +3 -1
  54. package/LoadingModal/useLoadingModal.d.ts +1 -1
  55. package/LoadingModal/useLoadingModal.js +1 -1
  56. package/PasswordInput/index.d.ts +6 -4
  57. package/PasswordInput/index.js +79 -4
  58. package/PasswordInput/{Password.d.ts → types.d.ts} +3 -6
  59. package/PasswordInput/types.js +1 -0
  60. package/README.md +4 -8
  61. package/SocialInput/index.d.ts +2 -2
  62. package/SocialInput/index.js +0 -1
  63. package/TabGroup/index.d.ts +2 -2
  64. package/TabGroup/index.js +0 -1
  65. package/TablePagination/index.d.ts +2 -2
  66. package/TablePagination/index.js +0 -1
  67. package/TextInput/index.d.ts +1 -1
  68. package/TextInput/index.js +2 -2
  69. package/ToastPrompt/Prompt.js +1 -1
  70. package/VideoPlayerModal/index.d.ts +2 -2
  71. package/VideoPlayerModal/index.js +0 -1
  72. package/index.d.ts +6 -0
  73. package/index.js +6 -0
  74. package/package.json +1 -2
  75. package/CheckBox/CheckBox.d.ts +0 -3
  76. package/CheckBox/CheckBox.js +0 -36
  77. package/CheckBox/CheckBoxGroup.d.ts +0 -3
  78. package/PasswordInput/ConfirmPassword.d.ts +0 -11
  79. package/PasswordInput/Password.js +0 -78
@@ -1,4 +1,4 @@
1
- import { AlertDialogProps } from "./types";
1
+ import type { AlertDialogProps } from "./types";
2
2
  declare const AlertDialog: (props: AlertDialogProps) => JSX.Element;
3
3
  export default AlertDialog;
4
- export * from "./types";
4
+ export type { AlertDialogProps };
@@ -45,4 +45,3 @@ var AlertDialog = function (props) {
45
45
  }, "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" }))) })] })) })));
46
46
  };
47
47
  export default AlertDialog;
48
- export * from "./types";
@@ -1,6 +1,6 @@
1
- import { ReactElement, CSSProperties } from "react";
2
- import { DialogProps } from "@mui/material/Dialog";
3
- import { DialogContentProps } from "@mui/material/DialogContent";
1
+ import type { ReactElement, CSSProperties } from "react";
2
+ import type { DialogProps } from "@mui/material/Dialog";
3
+ import type { DialogContentProps } from "@mui/material/DialogContent";
4
4
  export interface AlertDialogProps {
5
5
  title?: string;
6
6
  maxWidth?: DialogProps["maxWidth"];
@@ -1,4 +1,4 @@
1
- import { AutocompleteProps } from "./types";
1
+ import type { AutocompleteProps, AutocompleteValueType, AutocompleteOptionType } from "./types";
2
2
  declare function CustomAutocomplete<T, multiple extends boolean | undefined = false>(props: AutocompleteProps<T, multiple>): JSX.Element;
3
3
  export default CustomAutocomplete;
4
- export * from "./types";
4
+ export type { AutocompleteProps, AutocompleteValueType, AutocompleteOptionType };
@@ -49,4 +49,3 @@ function CustomAutocomplete(props) {
49
49
  }, 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) }) }))); } }) })));
50
50
  }
51
51
  export default CustomAutocomplete;
52
- export * from "./types";
@@ -1,5 +1,5 @@
1
- import { CSSProperties } from "react";
2
- import { TextFieldProps } from "@mui/material/TextField";
1
+ import type { CSSProperties } from "react";
2
+ import type { TextFieldProps } from "@mui/material/TextField";
3
3
  export declare type AutocompleteOptionType<T = {
4
4
  [name: string]: unknown;
5
5
  }> = T & {
@@ -1,4 +1,4 @@
1
- import { AutocompleteWithFilterProps } from "./types";
1
+ import type { AutocompleteWithFilterProps, AutocompleteWithFilterValueType, AutocompleteWithFilterOptionType } from "./types";
2
2
  declare function AutocompleteWithFilter<T, multiple extends boolean | undefined = false>(props: AutocompleteWithFilterProps<T, multiple>): JSX.Element;
3
3
  export default AutocompleteWithFilter;
4
- export * from "./types";
4
+ export type { AutocompleteWithFilterProps, AutocompleteWithFilterValueType, AutocompleteWithFilterOptionType };
@@ -57,4 +57,3 @@ function AutocompleteWithFilter(props) {
57
57
  }, 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) }) }))); } }) })));
58
58
  }
59
59
  export default AutocompleteWithFilter;
60
- export * from "./types";
@@ -1,12 +1,12 @@
1
- import { CSSProperties } from "react";
2
- import { TextFieldProps } from "@mui/material/TextField";
1
+ import type { CSSProperties } from "react";
2
+ import type { TextFieldProps } from "@mui/material/TextField";
3
3
  export declare type AutocompleteWithFilterOptionType<T> = T & {
4
4
  label: string;
5
5
  value?: string | number;
6
6
  };
7
- export declare type AutocompleteWithFilterlValueType<T, multiple extends boolean | undefined> = multiple extends false | undefined ? AutocompleteWithFilterOptionType<T> | null : Array<AutocompleteWithFilterOptionType<T>>;
7
+ export declare type AutocompleteWithFilterValueType<T, multiple extends boolean | undefined> = multiple extends false | undefined ? AutocompleteWithFilterOptionType<T> | null : Array<AutocompleteWithFilterOptionType<T>>;
8
8
  export interface AutocompleteWithFilterProps<T, multiple extends boolean | undefined> extends Omit<TextFieldProps, "onChange" | "value" | "disabled"> {
9
- value: AutocompleteWithFilterlValueType<T, multiple>;
9
+ value: AutocompleteWithFilterValueType<T, multiple>;
10
10
  options: Array<AutocompleteWithFilterOptionType<T>>;
11
11
  disableCloseOnSelect?: boolean;
12
12
  limitTags?: number;
@@ -15,5 +15,5 @@ export interface AutocompleteWithFilterProps<T, multiple extends boolean | undef
15
15
  loading?: boolean;
16
16
  primaryColor?: CSSProperties["color"];
17
17
  secondaryColor?: CSSProperties["color"];
18
- onChange: (value: AutocompleteWithFilterlValueType<T, multiple>) => void;
18
+ onChange: (value: AutocompleteWithFilterValueType<T, multiple>) => void;
19
19
  }
@@ -1,4 +1,4 @@
1
- import { BasicModalProps } from "./types";
1
+ import type { BasicModalProps } from "./types";
2
2
  declare function BasicModal(props: BasicModalProps): JSX.Element;
3
3
  export default BasicModal;
4
- export * from "./types";
4
+ export type { BasicModalProps };
@@ -49,4 +49,3 @@ function BasicModal(props) {
49
49
  } }, { children: _jsx(Content, __assign({}, rest, { noForm: noForm, onClose: onClose, onSubmit: onSubmit })) })) })) })));
50
50
  }
51
51
  export default BasicModal;
52
- export * from "./types";
@@ -1,5 +1,5 @@
1
- import { ReactNode, CSSProperties } from "react";
2
- import { ButtonProps } from "@mui/material/Button";
1
+ import type { ReactNode, CSSProperties } from "react";
2
+ import type { ButtonProps } from "@mui/material/Button";
3
3
  export interface BasicModalContentProps {
4
4
  children: ReactNode;
5
5
  color?: ButtonProps["color"];
@@ -1,4 +1,4 @@
1
- import { BreadCrumbsProps } from "./types";
1
+ import type { BreadCrumbsProps } from "./types";
2
2
  declare function Crumbs(props: BreadCrumbsProps): JSX.Element;
3
3
  export default Crumbs;
4
- export * from "./types";
4
+ export type { BreadCrumbsProps };
@@ -36,4 +36,3 @@ function Crumbs(props) {
36
36
  })] })) })));
37
37
  }
38
38
  export default Crumbs;
39
- export * from "./types";
@@ -1,4 +1,4 @@
1
- import { CSSProperties } from "react";
1
+ import type { CSSProperties } from "react";
2
2
  export interface BreadCrumbsProps {
3
3
  routes: Array<{
4
4
  href?: string;
@@ -1,3 +1,4 @@
1
- export { default as CheckBox } from "./CheckBox";
2
- export { default as CheckBoxGroup } from "./CheckBoxGroup";
3
- export * from "./types";
1
+ import { CheckBoxProps } from "./types";
2
+ declare function CheckBox(props: CheckBoxProps): JSX.Element;
3
+ export default CheckBox;
4
+ export type { CheckBoxProps };
package/CheckBox/index.js CHANGED
@@ -1,3 +1,36 @@
1
- export { default as CheckBox } from "./CheckBox";
2
- export { default as CheckBoxGroup } from "./CheckBoxGroup";
3
- export * from "./types";
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import { jsx as _jsx } from "react/jsx-runtime";
24
+ import Checkbox from "@mui/material/Checkbox";
25
+ import FormControlLabel from "@mui/material/FormControlLabel";
26
+ import ThemeProvider from "@mui/material/styles/ThemeProvider";
27
+ import useCustomTheme from "../useCustomTheme";
28
+ function CheckBox(props) {
29
+ var label = props.label, onChange = props.onChange, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["label", "onChange", "primaryColor", "secondaryColor"]);
30
+ var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
31
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(FormControlLabel, { control: _jsx(Checkbox, __assign({ onChange: function (event) {
32
+ event.stopPropagation();
33
+ onChange(event.target.checked);
34
+ } }, rest)), label: label }) })));
35
+ }
36
+ export default CheckBox;
@@ -1,12 +1,8 @@
1
- import { CSSProperties, ReactElement } from "react";
2
- import { CheckboxProps } from "@mui/material/Checkbox";
3
- import { FormGroupProps } from "@mui/material/FormGroup";
1
+ import type { CSSProperties, ReactElement } from "react";
2
+ import type { CheckboxProps } from "@mui/material/Checkbox";
4
3
  export interface CheckBoxProps extends Omit<CheckboxProps, "onChange"> {
5
4
  label: string | ReactElement;
6
5
  onChange: (val: boolean) => void;
7
6
  primaryColor?: CSSProperties["color"];
8
7
  secondaryColor?: CSSProperties["color"];
9
8
  }
10
- export interface CheckBoxGroupProps extends FormGroupProps {
11
- checkboxes: Array<CheckBoxProps>;
12
- }
@@ -0,0 +1,4 @@
1
+ import type { CheckBoxGroupProps } from "./types";
2
+ declare function CheckBoxGroup(props: CheckBoxGroupProps): JSX.Element;
3
+ export default CheckBoxGroup;
4
+ export type { CheckBoxGroupProps };
@@ -22,8 +22,8 @@ var __rest = (this && this.__rest) || function (s, e) {
22
22
  };
23
23
  import { jsx as _jsx } from "react/jsx-runtime";
24
24
  import FormGroup from "@mui/material/FormGroup";
25
- import CheckBox from "./CheckBox";
26
- export function CheckBoxGroup(props) {
25
+ import CheckBox from "../CheckBox";
26
+ function CheckBoxGroup(props) {
27
27
  var checkboxes = props.checkboxes, rest = __rest(props, ["checkboxes"]);
28
28
  return (_jsx(FormGroup, __assign({}, rest, { children: checkboxes.map(function (checkbox, index) { return (_jsx(CheckBox, __assign({}, checkbox), index)); }) })));
29
29
  }
@@ -0,0 +1,5 @@
1
+ import type { FormGroupProps } from "@mui/material/FormGroup";
2
+ import type { CheckBoxProps } from "../CheckBox";
3
+ export interface CheckBoxGroupProps extends FormGroupProps {
4
+ checkboxes: Array<CheckBoxProps>;
5
+ }
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,4 @@
1
+ import type { ConfirmPasswordInputProps } from "./types";
2
+ declare function ConfirmPasswordInput(props: ConfirmPasswordInputProps): JSX.Element;
3
+ export default ConfirmPasswordInput;
4
+ export type { ConfirmPasswordInputProps };
@@ -25,7 +25,7 @@ import { useMemo } from "react";
25
25
  import TextField from "@mui/material/TextField";
26
26
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
27
27
  import useCustomTheme from "../useCustomTheme";
28
- function ConfirmPassword(props) {
28
+ function ConfirmPasswordInput(props) {
29
29
  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"]);
30
30
  var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
31
31
  var isMatched = useMemo(function () {
@@ -39,4 +39,4 @@ function ConfirmPassword(props) {
39
39
  onChange(event.target.value);
40
40
  }, fullWidth: true, required: true }, rest)) })));
41
41
  }
42
- export default ConfirmPassword;
42
+ export default ConfirmPasswordInput;
@@ -0,0 +1,9 @@
1
+ import type { CSSProperties } from "react";
2
+ import type { TextFieldProps } from "@mui/material/TextField";
3
+ export interface ConfirmPasswordInputProps extends Omit<TextFieldProps, "onChange"> {
4
+ password: string;
5
+ value: string;
6
+ primaryColor?: CSSProperties["color"];
7
+ secondaryColor?: CSSProperties["color"];
8
+ onChange: (value: string) => void;
9
+ }
@@ -0,0 +1 @@
1
+ export {};
@@ -1,4 +1,4 @@
1
- import { CopyrightProps } from "./types";
1
+ import type { CopyrightProps } from "./types";
2
2
  declare function Copyright(props: CopyrightProps): JSX.Element;
3
3
  export default Copyright;
4
- export * from "./types";
4
+ export type { CopyrightProps };
@@ -20,4 +20,3 @@ function Copyright(props) {
20
20
  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(), "."] })) })));
21
21
  }
22
22
  export default Copyright;
23
- export * from "./types";
@@ -1,4 +1,4 @@
1
- import { CSSProperties } from "react";
1
+ import type { CSSProperties } from "react";
2
2
  export interface CopyrightProps {
3
3
  primaryColor?: CSSProperties["color"];
4
4
  secondaryColor?: CSSProperties["color"];
@@ -1,5 +1,6 @@
1
+ import useDataTable from "./useTable";
1
2
  import { DataTableProps, KvProps } from "./types";
2
3
  declare function DataTable<RowProps extends KvProps, ExtendedProps extends KvProps>(props: DataTableProps<RowProps, ExtendedProps>): JSX.Element;
3
4
  export default DataTable;
4
5
  export * from "./types";
5
- export { default as useDataTable } from "./useTable";
6
+ export { useDataTable };
@@ -15,6 +15,7 @@ import Table from "@mui/material/Table";
15
15
  import TableContainer from "@mui/material/TableContainer";
16
16
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
17
17
  import useCustomTheme from "../useCustomTheme";
18
+ import useDataTable from "./useTable";
18
19
  import TableBody from "./TableBody";
19
20
  import TableHeader from "./TableHeader";
20
21
  import TableFooter from "./TableFooter";
@@ -58,4 +59,4 @@ function DataTable(props) {
58
59
  }
59
60
  export default DataTable;
60
61
  export * from "./types";
61
- export { default as useDataTable } from "./useTable";
62
+ export { useDataTable };
@@ -1,6 +1,7 @@
1
+ import MonthDayInput from "./MonthDayInput";
2
+ import MonthYearInput from "./MonthYearInput";
3
+ import FullDateInput from "./FullDateInput";
1
4
  export * from "./MonthDayInput";
2
5
  export * from "./MonthYearInput";
3
6
  export * from "./FullDateInput";
4
- export { default as MonthDayInput } from "./MonthDayInput";
5
- export { default as MonthYearInput } from "./MonthYearInput";
6
- export { default as FullDateInput } from "./FullDateInput";
7
+ export { MonthDayInput, MonthYearInput, FullDateInput };
@@ -1,6 +1,7 @@
1
+ import MonthDayInput from "./MonthDayInput";
2
+ import MonthYearInput from "./MonthYearInput";
3
+ import FullDateInput from "./FullDateInput";
1
4
  export * from "./MonthDayInput";
2
5
  export * from "./MonthYearInput";
3
6
  export * from "./FullDateInput";
4
- export { default as MonthDayInput } from "./MonthDayInput";
5
- export { default as MonthYearInput } from "./MonthYearInput";
6
- export { default as FullDateInput } from "./FullDateInput";
7
+ export { MonthDayInput, MonthYearInput, FullDateInput };
@@ -1,4 +1,4 @@
1
- import { DigitInputProps } from "./types";
1
+ import type { DigitInputProps } from "./types";
2
2
  declare function DigitInput(props: DigitInputProps): JSX.Element;
3
3
  export default DigitInput;
4
- export * from "./types";
4
+ export type { DigitInputProps };
@@ -35,4 +35,3 @@ function DigitInput(props) {
35
35
  }, onChange: handleChange }, rest)) })) })));
36
36
  }
37
37
  export default DigitInput;
38
- export * from "./types";
@@ -1,6 +1,6 @@
1
- import { CSSProperties } from "react";
2
- import { InputProps } from "@mui/material/Input";
3
- import { TextFieldProps } from "@mui/material/TextField";
1
+ import type { CSSProperties } from "react";
2
+ import type { InputProps } from "@mui/material/Input";
3
+ import type { TextFieldProps } from "@mui/material/TextField";
4
4
  export interface DigitInputProps extends Omit<TextFieldProps, "onChange"> {
5
5
  onChange: (value: string) => void;
6
6
  value: string;
@@ -1,15 +1,3 @@
1
- import { ReactElement, CSSProperties } from "react";
2
- import { HeaderButtonProps } from "./types";
3
- export interface HeaderBarProps {
4
- title: string | ReactElement;
5
- color?: CSSProperties["color"];
6
- subtitle?: string | ReactElement;
7
- bottomEl?: ReactElement;
8
- buttons?: Array<HeaderButtonProps>;
9
- showBackButton?: boolean;
10
- primaryColor?: CSSProperties["color"];
11
- secondaryColor?: CSSProperties["color"];
12
- onBack?: () => void;
13
- }
1
+ import type { HeaderBarProps } from "./types";
14
2
  declare function HeaderBar(props: HeaderBarProps): JSX.Element;
15
3
  export default HeaderBar;
@@ -1,6 +1,6 @@
1
1
  import { CSSProperties } from "react";
2
2
  import { HeaderButtonProps } from "./types";
3
- export interface HeaderButtonsProps {
3
+ interface HeaderButtonsProps {
4
4
  buttons: Array<HeaderButtonProps>;
5
5
  primaryColor?: CSSProperties["color"];
6
6
  secondaryColor?: CSSProperties["color"];
@@ -1,8 +1,3 @@
1
- import { CSSProperties } from "react";
2
- interface HeaderLineProps {
3
- color?: CSSProperties["color"];
4
- primaryColor?: CSSProperties["color"];
5
- secondaryColor?: CSSProperties["color"];
6
- }
1
+ import type { HeaderLineProps } from "./types";
7
2
  declare function HeaderLine(props: HeaderLineProps): JSX.Element;
8
3
  export default HeaderLine;
@@ -1,23 +1,7 @@
1
- import { ReactElement, CSSProperties } from "react";
2
- import { SxProps } from "@mui/material/styles";
3
- import { HeaderBarProps } from "./HeaderBar";
4
- interface HeaderProviderProps {
5
- sx?: SxProps;
6
- children: ReactElement;
7
- primaryColor?: CSSProperties["color"];
8
- secondaryColor?: CSSProperties["color"];
9
- }
10
- interface HeaderContextProps {
11
- onInit: (props: HeaderBarProps) => void;
12
- onShow: () => void;
13
- onHide: () => void;
14
- }
1
+ import type { HeaderContextProps, HeaderProviderProps } from "./types";
15
2
  export declare function HeaderProvider(props: HeaderProviderProps): JSX.Element;
16
3
  export declare function useHeaderBar(): HeaderContextProps;
17
4
  export { default } from "./HeaderBar";
18
5
  export { default as HeaderButtons } from "./HeaderButtons";
19
6
  export { default as HeaderLine } from "./HeaderLine";
20
- export * from "./HeaderBar";
21
- export * from "./HeaderButtons";
22
- export * from "./HeaderLine";
23
7
  export * from "./types";
@@ -51,7 +51,4 @@ export function useHeaderBar() {
51
51
  export { default } from "./HeaderBar";
52
52
  export { default as HeaderButtons } from "./HeaderButtons";
53
53
  export { default as HeaderLine } from "./HeaderLine";
54
- export * from "./HeaderBar";
55
- export * from "./HeaderButtons";
56
- export * from "./HeaderLine";
57
54
  export * from "./types";
@@ -1,8 +1,9 @@
1
- import { ReactElement } from "react";
2
- import { ButtonProps } from "@mui/material/Button";
3
- import { IconButtonProps } from "@mui/material/IconButton";
4
- import { FabProps } from "@mui/material/Fab";
5
- import { MenuButtonGroupProps } from "../MenuButtonGroup";
1
+ import type { ReactElement, CSSProperties } from "react";
2
+ import type { ButtonProps } from "@mui/material/Button";
3
+ import type { IconButtonProps } from "@mui/material/IconButton";
4
+ import type { FabProps } from "@mui/material/Fab";
5
+ import type { SxProps } from "@mui/material/styles";
6
+ import type { MenuButtonGroupProps } from "../MenuButtonGroup";
6
7
  export declare enum HeaderButtonCategory {
7
8
  IconButton = "icon",
8
9
  TextButton = "text",
@@ -43,4 +44,31 @@ declare type HeaderMenuButtonProps = {
43
44
  type: HeaderButtonCategory.MenuButton;
44
45
  } & MenuButtonGroupProps;
45
46
  export declare type HeaderButtonProps = HeaderFabButtonProps | HeaderTextButtonProps | HeaderIconButtonProps | HeaderMenuButtonProps;
47
+ export interface HeaderLineProps {
48
+ color?: CSSProperties["color"];
49
+ primaryColor?: CSSProperties["color"];
50
+ secondaryColor?: CSSProperties["color"];
51
+ }
52
+ export interface HeaderBarProps {
53
+ title: string | ReactElement;
54
+ color?: CSSProperties["color"];
55
+ subtitle?: string | ReactElement;
56
+ bottomEl?: ReactElement;
57
+ buttons?: Array<HeaderButtonProps>;
58
+ showBackButton?: boolean;
59
+ primaryColor?: CSSProperties["color"];
60
+ secondaryColor?: CSSProperties["color"];
61
+ onBack?: () => void;
62
+ }
63
+ export interface HeaderProviderProps {
64
+ sx?: SxProps;
65
+ children: ReactElement;
66
+ primaryColor?: CSSProperties["color"];
67
+ secondaryColor?: CSSProperties["color"];
68
+ }
69
+ export interface HeaderContextProps {
70
+ onInit: (props: HeaderBarProps) => void;
71
+ onShow: () => void;
72
+ onHide: () => void;
73
+ }
46
74
  export {};
@@ -1,6 +1,6 @@
1
- import { FeinInputProps } from "./types";
1
+ import type { FeinInputProps } from "./types";
2
2
  export declare function FeinInputFormat(str: string): string;
3
3
  export declare function onValidateFein(feinString: string): boolean;
4
4
  declare function FeinInput(props: FeinInputProps): JSX.Element;
5
5
  export default FeinInput;
6
- export * from "./types";
6
+ export type { FeinInputProps };
@@ -72,4 +72,3 @@ function FeinInput(props) {
72
72
  } }, rest)) })));
73
73
  }
74
74
  export default FeinInput;
75
- export * from "./types";
@@ -1,5 +1,5 @@
1
- import { CSSProperties } from "react";
2
- import { TextFieldProps } from "@mui/material/TextField";
1
+ import type { CSSProperties } from "react";
2
+ import type { TextFieldProps } from "@mui/material/TextField";
3
3
  export interface FeinInputProps extends Omit<TextFieldProps, "onChange"> {
4
4
  onChange: (value: string) => void;
5
5
  onValidate?: (value?: string) => boolean;
@@ -1,4 +1,4 @@
1
- import { FileUploaderProps } from "./types";
1
+ import type { FileUploaderProps } from "./types";
2
2
  declare function FileUploader(props: FileUploaderProps): JSX.Element;
3
3
  export default FileUploader;
4
- export * from "./types";
4
+ export type { FileUploaderProps };
@@ -60,4 +60,3 @@ function FileUploader(props) {
60
60
  }, 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 }))] })));
61
61
  }
62
62
  export default FileUploader;
63
- export * from "./types";
@@ -1,4 +1,4 @@
1
- import { FormRadioGroupProps } from "./types";
1
+ import type { RadioOption, FormRadioGroupProps } from "./types";
2
2
  declare function FormRadioGroup(props: FormRadioGroupProps): JSX.Element;
3
3
  export default FormRadioGroup;
4
- export * from "./types";
4
+ export type { RadioOption, FormRadioGroupProps };
@@ -41,4 +41,3 @@ function FormRadioGroup(props) {
41
41
  }) }))] })) })));
42
42
  }
43
43
  export default FormRadioGroup;
44
- export * from "./types";
@@ -1,14 +1,14 @@
1
1
  import { CSSProperties } from "react";
2
2
  import { FormControlProps } from "@mui/material/FormControl";
3
3
  import { FormControlLabelProps } from "@mui/material/FormControlLabel";
4
- interface IRadioOption {
4
+ export declare type RadioOption = {
5
5
  label: string;
6
6
  value: string | boolean | number;
7
7
  disabled?: boolean;
8
- }
8
+ };
9
9
  export interface FormRadioGroupProps extends Omit<FormControlProps, "onChange"> {
10
10
  formLabel: string;
11
- options: Array<IRadioOption>;
11
+ options: Array<RadioOption>;
12
12
  value: string | boolean | number;
13
13
  tooltip?: string;
14
14
  primaryColor?: CSSProperties["color"];
@@ -16,4 +16,3 @@ export interface FormRadioGroupProps extends Omit<FormControlProps, "onChange">
16
16
  radioLabelPlacement?: FormControlLabelProps["labelPlacement"];
17
17
  onChange: (value: string | boolean | number) => void;
18
18
  }
19
- export {};
@@ -1,5 +1,5 @@
1
1
  import { CSSProperties } from "react";
2
- export interface HelpCaptionProps {
2
+ export declare type HelpCaptionProps = {
3
3
  mainCaption: string;
4
4
  subCaption?: string;
5
5
  linkUrl?: string;
@@ -7,6 +7,6 @@ export interface HelpCaptionProps {
7
7
  linkType?: "WEBPAGE" | "VIDEO";
8
8
  primaryColor?: CSSProperties["color"];
9
9
  secondaryColor?: CSSProperties["color"];
10
- }
10
+ };
11
11
  declare function HelpCaption(props: HelpCaptionProps): JSX.Element;
12
12
  export default HelpCaption;
@@ -1,4 +1,5 @@
1
1
  import LoadingModal from "./Modal";
2
+ import useLoadingModal, { LoadingModalProvider } from "./useLoadingModal";
2
3
  export default LoadingModal;
3
- export * from "./useLoadingModal";
4
+ export { useLoadingModal, LoadingModalProvider };
4
5
  export * from "./types";
@@ -1,4 +1,6 @@
1
+ "use client";
1
2
  import LoadingModal from "./Modal";
3
+ import useLoadingModal, { LoadingModalProvider } from "./useLoadingModal";
2
4
  export default LoadingModal;
3
- export * from "./useLoadingModal";
5
+ export { useLoadingModal, LoadingModalProvider };
4
6
  export * from "./types";
@@ -1,3 +1,3 @@
1
1
  import { LoadingModalContextProps, LoadingModalProviderProps } from "./types";
2
2
  export declare function LoadingModalProvider(props: LoadingModalProviderProps): JSX.Element;
3
- export declare function useLoadingModal(): LoadingModalContextProps;
3
+ export default function useLoadingModal(): LoadingModalContextProps;
@@ -52,6 +52,6 @@ export function LoadingModalProvider(props) {
52
52
  }, []);
53
53
  return (_jsx(LoadingModalContext.Provider, __assign({ value: { onOpenLoadingModal: onOpenLoadingModal, onCloseLoadingModal: onCloseLoadingModal } }, { children: _jsxs(_Fragment, { children: [cloneElement(children), _jsx(LoadingModal, __assign({}, modalArgs, { primaryColor: primaryColor, secondaryColor: secondaryColor }))] }) })));
54
54
  }
55
- export function useLoadingModal() {
55
+ export default function useLoadingModal() {
56
56
  return useContext(LoadingModalContext);
57
57
  }
@@ -1,4 +1,6 @@
1
- export { default as Password } from "./Password";
2
- export * from "./Password";
3
- export { default as ConfirmPassword } from "./ConfirmPassword";
4
- export * from "./ConfirmPassword";
1
+ import type { PasswordInputProps, PasswordStrategyProps } from "./types";
2
+ declare function onValidatePassword(password: string): boolean;
3
+ declare function PasswordInput(props: PasswordInputProps): JSX.Element;
4
+ export default PasswordInput;
5
+ export { onValidatePassword };
6
+ export type { PasswordInputProps, PasswordStrategyProps };
@@ -1,4 +1,79 @@
1
- export { default as Password } from "./Password";
2
- export * from "./Password";
3
- export { default as ConfirmPassword } from "./ConfirmPassword";
4
- export * from "./ConfirmPassword";
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
24
+ import { useMemo } from "react";
25
+ import TextField from "@mui/material/TextField";
26
+ import Typography from "@mui/material/Typography";
27
+ import ThemeProvider from "@mui/material/styles/ThemeProvider";
28
+ import useCustomTheme from "../useCustomTheme";
29
+ function onValidatePassword(password) {
30
+ var reg = /^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~])([!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~a-zA-z0-9]{8,})$/;
31
+ return reg.test(password);
32
+ }
33
+ function PasswordInput(props) {
34
+ var _a = props.strategies, strategies = _a === void 0 ? {
35
+ uppercaseLetter: { label: "1 Uppercase Letter", regex: /[A-Z]+/ },
36
+ lowercaseLetter: { label: "1 Lowercase Letter", regex: /[a-z]+/ },
37
+ specialCharacter: {
38
+ label: "1 Special Character",
39
+ regex: /[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]/
40
+ },
41
+ number: { label: "1 Number", regex: /\d+/ },
42
+ minimum8: { label: "Minimum 8 characters", regex: /.{8,}/ }
43
+ } : _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"]);
44
+ var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
45
+ var isValidPassword = useMemo(function () {
46
+ if ((value === null || value === void 0 ? void 0 : value.length) > 0) {
47
+ return onValidate ? onValidate(value) : onValidatePassword(value);
48
+ }
49
+ return true;
50
+ }, [value, onValidate, onValidatePassword]);
51
+ var helperTextColor = useMemo(function () {
52
+ var textColors = Object.keys(strategies).reduce(function (temp, key) {
53
+ var regex = strategies[key].regex;
54
+ if (value === "") {
55
+ temp[key] = undefined;
56
+ }
57
+ else if (regex.test(value)) {
58
+ temp[key] = successColor;
59
+ }
60
+ else {
61
+ temp[key] = "red";
62
+ }
63
+ return temp;
64
+ }, {});
65
+ return textColors;
66
+ }, [value, strategies]);
67
+ var helperText = useMemo(function () {
68
+ return (_jsx(_Fragment, { children: Object.keys(strategies).map(function (key) {
69
+ var label = strategies[key].label;
70
+ return (_jsx(Typography, __assign({ component: "li", variant: "caption", style: { color: helperTextColor[key] } }, { children: label }), key));
71
+ }) }));
72
+ }, [helperTextColor, strategies]);
73
+ 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) {
74
+ event.preventDefault();
75
+ onChange(event.target.value);
76
+ }, fullWidth: true, required: true }, rest)) })));
77
+ }
78
+ export default PasswordInput;
79
+ export { onValidatePassword };
@@ -1,12 +1,12 @@
1
- import { CSSProperties } from "react";
2
- import { TextFieldProps } from "@mui/material/TextField";
1
+ import type { CSSProperties } from "react";
2
+ import type { TextFieldProps } from "@mui/material/TextField";
3
3
  export interface PasswordStrategyProps {
4
4
  [key: string]: {
5
5
  label: string;
6
6
  regex: RegExp;
7
7
  };
8
8
  }
9
- export interface PasswordProps extends Omit<TextFieldProps, "onChange"> {
9
+ export interface PasswordInputProps extends Omit<TextFieldProps, "onChange"> {
10
10
  strategies?: PasswordStrategyProps;
11
11
  value: string;
12
12
  successColor?: CSSProperties["color"];
@@ -15,6 +15,3 @@ export interface PasswordProps extends Omit<TextFieldProps, "onChange"> {
15
15
  onChange: (value: string) => void;
16
16
  onValidate?: (value: string) => boolean;
17
17
  }
18
- export declare function onValidatePassword(password: string): boolean;
19
- declare function Password(props: PasswordProps): JSX.Element;
20
- export default Password;
@@ -0,0 +1 @@
1
+ export {};
package/README.md CHANGED
@@ -237,9 +237,7 @@ It is extended from `@mui/material/Checkbox`, so it includes all properties of `
237
237
  ```typescript
238
238
  import { CheckBox } from '@symply.io/basic-components/';
239
239
  // or
240
- import { CheckBox } from '@symply.io/basic-components/CheckBox';
241
- // or
242
- import CheckBox from '@symply.io/basic-components/CheckBox/CheckBox';
240
+ import CheckBox from '@symply.io/basic-components/CheckBox';
243
241
  ```
244
242
 
245
243
  <h5>Props</h5>
@@ -262,9 +260,7 @@ It is extended from `@mui/material/FormGroup`, so it includes all properties of
262
260
  ```typescript
263
261
  import { CheckBoxGroup } from '@symply.io/basic-components/';
264
262
  // or
265
- import { CheckBoxGroup } from '@symply.io/basic-components/CheckBox';
266
- // or
267
- import CheckBoxGroup from '@symply.io/basic-components/CheckBox/CheckBoxGroup';
263
+ import CheckBoxGroup from '@symply.io/basic-components/CheckBoxGroup';
268
264
  ```
269
265
 
270
266
  <h5>Props</h5>
@@ -701,9 +697,9 @@ It is extended from `@mui/material/TextField`, so it includes all properties of
701
697
 
702
698
  ```typescript
703
699
  // Password
704
- import { Password } from '@symply.io/basic-components/PasswordInput';
700
+ import Password from '@symply.io/basic-components/PasswordInput';
705
701
  // Confirm Password
706
- import { ConfirmPassword } from '@symply.io/basic-components/PasswordInput';
702
+ import ConfirmPassword from '@symply.io/basic-components/ConfirmPasswordInput';
707
703
  ```
708
704
 
709
705
  <h5>Password Props</h5>
@@ -1,6 +1,6 @@
1
- import { SocialInputProps } from "./types";
1
+ import type { SocialInputProps } from "./types";
2
2
  export declare function SocialInputFormat(str: string): string;
3
3
  export declare function onValidateSocial(socialString: string): boolean;
4
4
  declare function SocialInput(props: SocialInputProps): JSX.Element;
5
5
  export default SocialInput;
6
- export * from "./types";
6
+ export type { SocialInputProps };
@@ -74,4 +74,3 @@ function SocialInput(props) {
74
74
  } }, rest)) })));
75
75
  }
76
76
  export default SocialInput;
77
- export * from "./types";
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- import { TabGroupProps } from "./types";
2
+ import type { TabGroupProps } from "./types";
3
3
  declare const TabGroup: import("react").ForwardRefExoticComponent<TabGroupProps & import("react").RefAttributes<unknown>>;
4
4
  export default TabGroup;
5
- export * from "./types";
5
+ export type { TabGroupProps };
package/TabGroup/index.js CHANGED
@@ -48,4 +48,3 @@ var TabGroup = forwardRef(function (props, ref) {
48
48
  }) })) })));
49
49
  });
50
50
  export default TabGroup;
51
- export * from "./types";
@@ -1,4 +1,4 @@
1
- import { TablePaginationProps } from "./types";
1
+ import type { TablePaginationProps } from "./types";
2
2
  declare function Pagination(props: TablePaginationProps): JSX.Element;
3
3
  export default Pagination;
4
- export * from "./types";
4
+ export type { TablePaginationProps };
@@ -20,4 +20,3 @@ function Pagination(props) {
20
20
  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, {})) })));
21
21
  }
22
22
  export default Pagination;
23
- export * from "./types";
@@ -9,5 +9,5 @@ export interface TextInputProps extends Omit<TextFieldProps, "onChange"> {
9
9
  primaryColor?: CSSProperties["color"];
10
10
  secondaryColor?: CSSProperties["color"];
11
11
  }
12
- declare const TextInput: (props: TextInputProps) => JSX.Element;
12
+ declare function TextInput(props: TextInputProps): JSX.Element;
13
13
  export default TextInput;
@@ -26,7 +26,7 @@ import Field from "@mui/material/TextField";
26
26
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
27
27
  import useInteractions from "./useInteractions";
28
28
  import useCustomTheme from "../useCustomTheme";
29
- var TextInput = function (props) {
29
+ function TextInput(props) {
30
30
  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"]);
31
31
  var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
32
32
  var _e = useInteractions(), tooltipOpen = _e.tooltipOpen, onOpenTooltip = _e.onOpenTooltip, onCloseTooltip = _e.onCloseTooltip;
@@ -42,5 +42,5 @@ var TextInput = function (props) {
42
42
  event.preventDefault();
43
43
  onChange(event.target.value);
44
44
  }, inputProps: { maxLength: maxLength, minLength: minLength } }, rest)) })) })));
45
- };
45
+ }
46
46
  export default TextInput;
@@ -22,6 +22,6 @@ function Transition(args) {
22
22
  function Prompt(props) {
23
23
  var open = props.open, type = props.type, message = props.message, timeout = props.timeout, onClose = props.onClose;
24
24
  var theme = useCustomTheme();
25
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Snackbar, __assign({ anchorOrigin: { vertical: "bottom", horizontal: "left" }, open: open, onClose: onClose, autoHideDuration: timeout, TransitionComponent: Transition, sx: { zIndex: 99999 } }, { children: _jsxs(Alert, __assign({ variant: "filled", severity: type, sx: { width: "100%", fontSize: 14, fontWeight: 700 }, onClose: onClose }, { children: [_jsx(AlertTitle, __assign({ sx: { textTransform: "capitalize", fontSize: 14, fontWeight: 700 } }, { children: type })), message] })) }), "".concat(Date.now() * Math.round(Math.random()))) })));
25
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Snackbar, __assign({ anchorOrigin: { vertical: "bottom", horizontal: "left" }, open: open, onClose: onClose, autoHideDuration: timeout, TransitionComponent: Transition, sx: { zIndex: 99999 } }, { children: _jsxs(Alert, __assign({ variant: "filled", severity: type, sx: { width: "100%", fontSize: 14, fontWeight: 700 }, onClose: onClose }, { children: [_jsx(AlertTitle, __assign({ sx: { textTransform: "capitalize", fontSize: 16, fontWeight: 900 } }, { children: type })), message] })) }), "".concat(Date.now() * Math.round(Math.random()))) })));
26
26
  }
27
27
  export default Prompt;
@@ -1,4 +1,4 @@
1
- import { VideoPlayerModalProps } from "./types";
1
+ import type { VideoPlayerModalProps } from "./types";
2
2
  declare function VideoPlayerModal(props: VideoPlayerModalProps): JSX.Element;
3
3
  export default VideoPlayerModal;
4
- export * from "./types";
4
+ export type { VideoPlayerModalProps };
@@ -40,4 +40,3 @@ function VideoPlayerModal(props) {
40
40
  } }, 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" })) }))] })) })] })) })));
41
41
  }
42
42
  export default VideoPlayerModal;
43
- export * from "./types";
package/index.d.ts CHANGED
@@ -4,6 +4,8 @@ export * from "./AutocompleteWithFilter";
4
4
  export * from "./BasicModal";
5
5
  export * from "./BreadCrumbs";
6
6
  export * from "./CheckBox";
7
+ export * from "./CheckBoxGroup";
8
+ export * from "./ConfirmPasswordInput";
7
9
  export * from "./Copyright";
8
10
  export * from "./DataTable";
9
11
  export * from "./DateInput";
@@ -31,6 +33,9 @@ export { default as Autocomplete } from "./Autocomplete";
31
33
  export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
32
34
  export { default as BasicModal } from "./BasicModal";
33
35
  export { default as BreadCrumbs } from "./BreadCrumbs";
36
+ export { default as CheckBox } from "./CheckBox";
37
+ export { default as CheckBoxGroup } from "./CheckBoxGroup";
38
+ export { default as ConfirmPasswordInput } from "./ConfirmPasswordInput";
34
39
  export { default as Copyright } from "./Copyright";
35
40
  export { default as DataTable } from "./DataTable";
36
41
  export { default as DigitInput } from "./DigitInput";
@@ -42,6 +47,7 @@ export { default as HelpCaption } from "./HelpCaption";
42
47
  export { default as LoadingModal } from "./LoadingModal";
43
48
  export { default as MenuButtonGroup } from "./MenuButtonGroup";
44
49
  export { default as NumberInput } from "./NumberInput";
50
+ export { default as PasswordInput } from "./PasswordInput";
45
51
  export { default as PhoneNumberInput } from "./PhoneNumberInput";
46
52
  export { default as Sidebar } from "./Sidebar";
47
53
  export { default as SocialInput } from "./SocialInput";
package/index.js CHANGED
@@ -4,6 +4,8 @@ export * from "./AutocompleteWithFilter";
4
4
  export * from "./BasicModal";
5
5
  export * from "./BreadCrumbs";
6
6
  export * from "./CheckBox";
7
+ export * from "./CheckBoxGroup";
8
+ export * from "./ConfirmPasswordInput";
7
9
  export * from "./Copyright";
8
10
  export * from "./DataTable";
9
11
  export * from "./DateInput";
@@ -31,6 +33,9 @@ export { default as Autocomplete } from "./Autocomplete";
31
33
  export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
32
34
  export { default as BasicModal } from "./BasicModal";
33
35
  export { default as BreadCrumbs } from "./BreadCrumbs";
36
+ export { default as CheckBox } from "./CheckBox";
37
+ export { default as CheckBoxGroup } from "./CheckBoxGroup";
38
+ export { default as ConfirmPasswordInput } from "./ConfirmPasswordInput";
34
39
  export { default as Copyright } from "./Copyright";
35
40
  export { default as DataTable } from "./DataTable";
36
41
  export { default as DigitInput } from "./DigitInput";
@@ -42,6 +47,7 @@ export { default as HelpCaption } from "./HelpCaption";
42
47
  export { default as LoadingModal } from "./LoadingModal";
43
48
  export { default as MenuButtonGroup } from "./MenuButtonGroup";
44
49
  export { default as NumberInput } from "./NumberInput";
50
+ export { default as PasswordInput } from "./PasswordInput";
45
51
  export { default as PhoneNumberInput } from "./PhoneNumberInput";
46
52
  export { default as Sidebar } from "./Sidebar";
47
53
  export { default as SocialInput } from "./SocialInput";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@symply.io/basic-components",
3
- "version": "1.4.0-beta.6",
3
+ "version": "1.4.0-beta.8",
4
4
  "description": "Basic and reusable components for all frontend of Symply apps",
5
5
  "keywords": [
6
6
  "react",
@@ -8,7 +8,6 @@
8
8
  "material-ui"
9
9
  ],
10
10
  "main": "index.js",
11
- "type": "module",
12
11
  "types": "**/*.d.ts",
13
12
  "license": "MIT",
14
13
  "private": false,
@@ -1,3 +0,0 @@
1
- import { CheckBoxProps } from "./types";
2
- export declare function CheckBox(props: CheckBoxProps): JSX.Element;
3
- export default CheckBox;
@@ -1,36 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { jsx as _jsx } from "react/jsx-runtime";
24
- import Checkbox from "@mui/material/Checkbox";
25
- import FormControlLabel from "@mui/material/FormControlLabel";
26
- import ThemeProvider from "@mui/material/styles/ThemeProvider";
27
- import useCustomTheme from "../useCustomTheme";
28
- export function CheckBox(props) {
29
- var label = props.label, onChange = props.onChange, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["label", "onChange", "primaryColor", "secondaryColor"]);
30
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
31
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(FormControlLabel, { control: _jsx(Checkbox, __assign({ onChange: function (event) {
32
- event.stopPropagation();
33
- onChange(event.target.checked);
34
- } }, rest)), label: label }) })));
35
- }
36
- export default CheckBox;
@@ -1,3 +0,0 @@
1
- import { CheckBoxGroupProps } from "./types";
2
- export declare function CheckBoxGroup(props: CheckBoxGroupProps): JSX.Element;
3
- export default CheckBoxGroup;
@@ -1,11 +0,0 @@
1
- import { CSSProperties } from "react";
2
- import { TextFieldProps } from "@mui/material/TextField";
3
- export interface ConfirmPasswordProps extends Omit<TextFieldProps, "onChange"> {
4
- password: string;
5
- value: string;
6
- primaryColor?: CSSProperties["color"];
7
- secondaryColor?: CSSProperties["color"];
8
- onChange: (value: string) => void;
9
- }
10
- declare function ConfirmPassword(props: ConfirmPasswordProps): JSX.Element;
11
- export default ConfirmPassword;
@@ -1,78 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
24
- import { useMemo } from "react";
25
- import TextField from "@mui/material/TextField";
26
- import Typography from "@mui/material/Typography";
27
- import ThemeProvider from "@mui/material/styles/ThemeProvider";
28
- import useCustomTheme from "../useCustomTheme";
29
- export function onValidatePassword(password) {
30
- var reg = /^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~])([!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~a-zA-z0-9]{8,})$/;
31
- return reg.test(password);
32
- }
33
- function Password(props) {
34
- var _a = props.strategies, strategies = _a === void 0 ? {
35
- uppercaseLetter: { label: "1 Uppercase Letter", regex: /[A-Z]+/ },
36
- lowercaseLetter: { label: "1 Lowercase Letter", regex: /[a-z]+/ },
37
- specialCharacter: {
38
- label: "1 Special Character",
39
- regex: /[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]/
40
- },
41
- number: { label: "1 Number", regex: /\d+/ },
42
- minimum8: { label: "Minimum 8 characters", regex: /.{8,}/ }
43
- } : _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"]);
44
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
45
- var isValidPassword = useMemo(function () {
46
- if ((value === null || value === void 0 ? void 0 : value.length) > 0) {
47
- return onValidate ? onValidate(value) : onValidatePassword(value);
48
- }
49
- return true;
50
- }, [value, onValidate, onValidatePassword]);
51
- var helperTextColor = useMemo(function () {
52
- var textColors = Object.keys(strategies).reduce(function (temp, key) {
53
- var regex = strategies[key].regex;
54
- if (value === "") {
55
- temp[key] = undefined;
56
- }
57
- else if (regex.test(value)) {
58
- temp[key] = successColor;
59
- }
60
- else {
61
- temp[key] = "red";
62
- }
63
- return temp;
64
- }, {});
65
- return textColors;
66
- }, [value, strategies]);
67
- var helperText = useMemo(function () {
68
- return (_jsx(_Fragment, { children: Object.keys(strategies).map(function (key) {
69
- var label = strategies[key].label;
70
- return (_jsx(Typography, __assign({ component: "li", variant: "caption", style: { color: helperTextColor[key] } }, { children: label }), key));
71
- }) }));
72
- }, [helperTextColor, strategies]);
73
- 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) {
74
- event.preventDefault();
75
- onChange(event.target.value);
76
- }, fullWidth: true, required: true }, rest)) })));
77
- }
78
- export default Password;