@symply.io/basic-components 1.3.11-alpha.1 → 1.3.11-alpha.11

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 (76) hide show
  1. package/AlertDialog/index.js +8 -30
  2. package/Autocomplete/index.js +10 -32
  3. package/Autocomplete/useInteractions.js +3 -3
  4. package/AutocompleteWithFilter/index.js +12 -35
  5. package/BasicModal/Content.js +5 -16
  6. package/BasicModal/index.js +9 -31
  7. package/BreadCrumbs/index.js +8 -19
  8. package/CheckBox/CheckBox.js +4 -26
  9. package/CheckBox/CheckBoxGroup.js +2 -24
  10. package/Copyright/index.js +3 -14
  11. package/DataTable/TableBody.js +2 -24
  12. package/DataTable/TableBodyRow.js +41 -52
  13. package/DataTable/TableFooter.js +30 -41
  14. package/DataTable/TableHeader.js +36 -47
  15. package/DataTable/index.js +17 -28
  16. package/DataTable/useTable.js +46 -54
  17. package/DateInput/FullDateInput/index.js +20 -42
  18. package/DateInput/FullDateInput/useInteractions.js +10 -10
  19. package/DateInput/MonthDayInput/index.js +14 -36
  20. package/DateInput/MonthDayInput/useInteractions.js +9 -9
  21. package/DateInput/MonthYearInput/index.js +14 -36
  22. package/DateInput/MonthYearInput/useInteractions.js +9 -9
  23. package/DigitInput/index.js +6 -28
  24. package/DigitInput/useInteractions.js +9 -9
  25. package/DynamicHeaderBar/HeaderBar.js +6 -17
  26. package/DynamicHeaderBar/HeaderButtons.js +13 -24
  27. package/DynamicHeaderBar/HeaderLine.js +2 -2
  28. package/DynamicHeaderBar/index.js +15 -26
  29. package/FeinInput/index.js +16 -38
  30. package/FeinInput/useInteractions.js +9 -9
  31. package/FileUploader/index.js +11 -33
  32. package/FileUploader/useInteractions.js +29 -44
  33. package/FormRadioGroup/index.js +4 -29
  34. package/FormSelector/MultipleSelector.js +9 -32
  35. package/FormSelector/SimpleSelector.js +9 -32
  36. package/FormSelector/useInteractions.js +7 -7
  37. package/HelpCaption/index.js +6 -17
  38. package/HelpCaption/useInteractions.js +2 -2
  39. package/LoadingModal/Modal.js +4 -15
  40. package/LoadingModal/useLoadingModal.js +15 -33
  41. package/MenuButtonGroup/MenuItem.js +3 -14
  42. package/MenuButtonGroup/index.js +14 -82
  43. package/NumberInput/index.js +5 -27
  44. package/NumberInput/useInteractions.js +17 -17
  45. package/PasswordInput/ConfirmPassword.js +6 -28
  46. package/PasswordInput/Password.js +15 -37
  47. package/PhoneNumberInput/index.js +17 -39
  48. package/PhoneNumberInput/useInteractions.js +10 -10
  49. package/Sidebar/SidebarItem.js +6 -17
  50. package/Sidebar/SidebarItemsGroup.js +10 -21
  51. package/Sidebar/SidebarLink.js +5 -27
  52. package/Sidebar/index.js +6 -17
  53. package/SocialInput/index.js +18 -40
  54. package/SocialInput/useInteractions.js +14 -14
  55. package/TabGroup/index.js +14 -25
  56. package/TablePagination/Actions.js +4 -15
  57. package/TablePagination/index.js +3 -14
  58. package/TablePagination/useInteractions.js +9 -9
  59. package/TextInput/index.js +8 -30
  60. package/TextInput/useInteractions.js +4 -4
  61. package/ToastPrompt/Prompt.d.ts +3 -0
  62. package/ToastPrompt/Prompt.js +63 -0
  63. package/ToastPrompt/index.d.ts +2 -13
  64. package/ToastPrompt/index.js +10 -25
  65. package/ToastPrompt/types.d.ts +35 -0
  66. package/ToastPrompt/types.js +1 -0
  67. package/ToastPrompt/useInteractions.d.ts +14 -0
  68. package/ToastPrompt/useInteractions.js +27 -0
  69. package/VideoPlayerModal/index.js +5 -27
  70. package/package.json +1 -1
  71. package/useCustomTheme.js +11 -16
  72. package/utils/uuid.js +10 -11
  73. package/ToastPrompt/Logics.d.ts +0 -12
  74. package/ToastPrompt/Logics.js +0 -37
  75. package/ToastPrompt/Presentation.d.ts +0 -16
  76. package/ToastPrompt/Presentation.js +0 -82
@@ -1,25 +1,3 @@
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
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
24
2
  import { forwardRef, cloneElement } from "react";
25
3
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
@@ -31,18 +9,18 @@ import DialogContent from "@mui/material/DialogContent";
31
9
  import useMediaQuery from "@mui/material/useMediaQuery";
32
10
  import Slide from "@mui/material/Slide";
33
11
  import useCustomTheme from "../useCustomTheme";
34
- var Transition = forwardRef(function Transition(props, ref) {
35
- return _jsx(Slide, __assign({ direction: "up" }, props, { ref: ref }));
12
+ const Transition = forwardRef(function Transition(props, ref) {
13
+ return _jsx(Slide, { direction: "up", ...props, ref: ref });
36
14
  });
37
- var AlertDialog = function (props) {
38
- var _a = props.title, title = _a === void 0 ? "Info" : _a, _b = props.maxWidth, maxWidth = _b === void 0 ? "md" : _b, children = props.children, open = props.open, onClose = props.onClose, DialogButtons = props.DialogButtons, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["title", "maxWidth", "children", "open", "onClose", "DialogButtons", "primaryColor", "secondaryColor"]);
39
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
40
- var fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
41
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsxs(Dialog, __assign({ maxWidth: maxWidth, fullScreen: fullScreen, TransitionComponent: Transition, open: open, onClose: function (_, reason) {
15
+ const AlertDialog = (props) => {
16
+ const { title = "Info", maxWidth = "md", children, open, onClose, DialogButtons, primaryColor, secondaryColor, ...rest } = props;
17
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
18
+ const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
19
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsxs(Dialog, { maxWidth: maxWidth, fullScreen: fullScreen, TransitionComponent: Transition, open: open, onClose: (_, reason) => {
42
20
  if (reason !== "backdropClick") {
43
21
  onClose();
44
22
  }
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" }))) })] })) })));
23
+ }, "aria-labelledby": "alert-dialog-title", "aria-describedby": "alert-dialog-description", ...rest, children: [_jsx(DialogTitle, { id: "alert-dialog-title", children: title }), _jsx(DialogContent, { children: children }), _jsx(DialogActions, { children: DialogButtons ? (cloneElement(DialogButtons)) : (_jsx(Button, { onClick: onClose, color: "primary", children: "OK" })) })] }) }));
46
24
  };
47
25
  export default AlertDialog;
48
26
  export * from "./types";
@@ -1,25 +1,3 @@
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
1
  import { jsx as _jsx } from "react/jsx-runtime";
24
2
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
25
3
  import Autocomplete from "@mui/material/Autocomplete";
@@ -27,16 +5,13 @@ import TextField from "@mui/material/TextField";
27
5
  import useInteractions from "./useInteractions";
28
6
  import useCustomTheme from "../useCustomTheme";
29
7
  function CustomAutocomplete(props) {
30
- var size = props.size, value = props.value, loading = props.loading, options = props.options, multiple = props.multiple, disabled = props.disabled, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onChange = props.onChange, required = props.required, limitTags = props.limitTags, rest = __rest(props, ["size", "value", "loading", "options", "multiple", "disabled", "primaryColor", "secondaryColor", "onChange", "required", "limitTags"]);
31
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
32
- var _a = useInteractions(), inputValue = _a.inputValue, onInputChange = _a.onInputChange;
33
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, disabled: disabled, limitTags: limitTags !== null && limitTags !== void 0 ? limitTags : -1, options: options, multiple: multiple, onChange: function (event, val) {
8
+ const { size, value, loading, options, multiple, disabled, primaryColor, secondaryColor, onChange, required, limitTags, ...rest } = props;
9
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
10
+ const { inputValue, onInputChange } = useInteractions();
11
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, disabled: disabled, limitTags: limitTags ?? -1, options: options, multiple: multiple, onChange: (event, val) => {
34
12
  event.preventDefault();
35
13
  onChange(val);
36
- }, getOptionLabel: function (option) { return option.label || ""; }, renderOption: function (props, option) {
37
- var _a, _b;
38
- return (_jsx("li", __assign({}, __assign(__assign({}, props), { key: (_b = (_a = option.value) !== null && _a !== void 0 ? _a : option.label) !== null && _b !== void 0 ? _b : option }), { children: option.label || "" })));
39
- }, isOptionEqualToValue: function (opt, val) {
14
+ }, getOptionLabel: option => option.label || "", renderOption: (props, option) => (_jsx("li", { ...{ ...props, key: option.value ?? option.label ?? option }, children: option.label || "" })), isOptionEqualToValue: (opt, val) => {
40
15
  if (typeof opt === "string") {
41
16
  return opt === val;
42
17
  }
@@ -44,9 +19,12 @@ function CustomAutocomplete(props) {
44
19
  return String(opt.value) === String(val.value);
45
20
  }
46
21
  return opt.label === val.label;
47
- }, value: value, inputValue: inputValue, onInputChange: function (event, val) {
22
+ }, value: value, inputValue: inputValue, onInputChange: (event, val) => {
48
23
  onInputChange(val);
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) }) }))); } }) })));
24
+ }, renderInput: params => (_jsx(TextField, { ...params, ...rest, required: required, size: size, inputProps: {
25
+ ...params.inputProps,
26
+ required: required && (Array.isArray(value) ? value.length === 0 : !value)
27
+ } })) }) }));
50
28
  }
51
29
  export default CustomAutocomplete;
52
30
  export * from "./types";
@@ -1,9 +1,9 @@
1
1
  import { useState, useCallback } from "react";
2
2
  function useInteractions() {
3
- var _a = useState(""), inputValue = _a[0], setInputValue = _a[1];
4
- var onInputChange = useCallback(function (value) {
3
+ const [inputValue, setInputValue] = useState("");
4
+ const onInputChange = useCallback((value) => {
5
5
  setInputValue(value);
6
6
  }, []);
7
- return { inputValue: inputValue, onInputChange: onInputChange };
7
+ return { inputValue, onInputChange };
8
8
  }
9
9
  export default useInteractions;
@@ -1,25 +1,3 @@
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
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
24
2
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
25
3
  import Checkbox from "@mui/material/Checkbox";
@@ -28,21 +6,21 @@ import Autocomplete, { createFilterOptions } from "@mui/material/Autocomplete";
28
6
  import CheckBoxOutlineBlankIcon from "@mui/icons-material/CheckBoxOutlineBlank";
29
7
  import CheckBoxIcon from "@mui/icons-material/CheckBox";
30
8
  import useCustomTheme from "../useCustomTheme";
31
- var icon = _jsx(CheckBoxOutlineBlankIcon, { fontSize: "small" });
32
- var checkedIcon = _jsx(CheckBoxIcon, { fontSize: "small" });
9
+ const icon = _jsx(CheckBoxOutlineBlankIcon, { fontSize: "small" });
10
+ const checkedIcon = _jsx(CheckBoxIcon, { fontSize: "small" });
33
11
  function AutocompleteWithFilter(props) {
34
- var size = props.size, value = props.value, options = props.options, loading = props.loading, multiple = props.multiple, disabled = props.disabled, disableCloseOnSelect = props.disableCloseOnSelect, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, onChange = props.onChange, required = props.required, limitTags = props.limitTags, rest = __rest(props, ["size", "value", "options", "loading", "multiple", "disabled", "disableCloseOnSelect", "primaryColor", "secondaryColor", "onChange", "required", "limitTags"]);
35
- var filter = createFilterOptions({
12
+ const { size, value, options, loading, multiple, disabled, disableCloseOnSelect, primaryColor, secondaryColor, onChange, required, limitTags, ...rest } = props;
13
+ const filter = createFilterOptions({
36
14
  ignoreCase: true,
37
15
  ignoreAccents: true,
38
16
  trim: true,
39
- stringify: function (option) { return option.label; }
17
+ stringify: (option) => option.label
40
18
  });
41
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
42
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, limitTags: limitTags !== null && limitTags !== void 0 ? limitTags : -1, options: options, disabled: disabled, multiple: multiple, filterOptions: filter, onChange: function (event, val) {
19
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
20
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, limitTags: limitTags ?? -1, options: options, disabled: disabled, multiple: multiple, filterOptions: filter, onChange: (event, val) => {
43
21
  event.preventDefault();
44
22
  onChange(val);
45
- }, value: value, disableCloseOnSelect: disableCloseOnSelect || multiple, getOptionLabel: function (option) { return option.label; }, isOptionEqualToValue: function (opt, val) {
23
+ }, value: value, disableCloseOnSelect: disableCloseOnSelect || multiple, getOptionLabel: option => option.label, isOptionEqualToValue: (opt, val) => {
46
24
  if (typeof opt === "string") {
47
25
  return opt === val;
48
26
  }
@@ -50,11 +28,10 @@ function AutocompleteWithFilter(props) {
50
28
  return String(opt.value) === String(val.value);
51
29
  }
52
30
  return opt.label === val.label;
53
- }, renderOption: function (props, option, _a) {
54
- var _b, _c;
55
- var selected = _a.selected;
56
- return (_jsxs("li", __assign({}, __assign(__assign({}, props), { key: (_c = (_b = option.value) !== null && _b !== void 0 ? _b : option.label) !== null && _c !== void 0 ? _c : option }), { children: [_jsx(Checkbox, { icon: icon, color: "primary", checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }), option.label || ""] })));
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) }) }))); } }) })));
31
+ }, renderOption: (props, option, { selected }) => (_jsxs("li", { ...{ ...props, key: option.value ?? option.label ?? option }, children: [_jsx(Checkbox, { icon: icon, color: "primary", checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }), option.label || ""] })), renderInput: params => (_jsx(TextField, { ...params, ...rest, variant: "outlined", required: required, inputProps: {
32
+ ...params.inputProps,
33
+ required: required && (Array.isArray(value) ? value.length === 0 : !value)
34
+ } })) }) }));
58
35
  }
59
36
  export default AutocompleteWithFilter;
60
37
  export * from "./types";
@@ -1,14 +1,3 @@
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
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
13
2
  import { cloneElement } from "react";
14
3
  import useTheme from "@mui/material/styles/useTheme";
@@ -21,17 +10,17 @@ import IconButton from "@mui/material/IconButton";
21
10
  import CloseIcon from "@mui/icons-material/Close";
22
11
  import Grid from "@mui/material/Grid";
23
12
  function Content(props) {
24
- var children = props.children, title = props.title, desc = props.desc, _a = props.color, color = _a === void 0 ? "primary" : _a, loading = props.loading, disabled = props.disabled, buttons = props.buttons, _b = props.submitText, submitText = _b === void 0 ? "Save" : _b, _c = props.cancelText, cancelText = _c === void 0 ? "Cancel" : _c, _d = props.showTopRightCloseButton, showTopRightCloseButton = _d === void 0 ? false : _d, _e = props.hideBottomButtons, hideBottomButtons = _e === void 0 ? false : _e, _f = props.noForm, noForm = _f === void 0 ? false : _f, onClose = props.onClose, onSubmit = props.onSubmit;
25
- var theme = useTheme();
26
- return (_jsxs(_Fragment, { children: [_jsxs(DialogTitle, __assign({ sx: {
13
+ const { children, title, desc, color = "primary", loading, disabled, buttons, submitText = "Save", cancelText = "Cancel", showTopRightCloseButton = false, hideBottomButtons = false, noForm = false, onClose, onSubmit } = props;
14
+ const theme = useTheme();
15
+ return (_jsxs(_Fragment, { children: [_jsxs(DialogTitle, { sx: {
27
16
  "& > span": {
28
17
  fontWeight: "700!important"
29
18
  }
30
- } }, { children: [_jsx("span", { children: title }), showTopRightCloseButton ? (_jsx(IconButton, __assign({ "aria-label": "close", onClick: onClose, sx: {
19
+ }, children: [_jsx("span", { children: title }), showTopRightCloseButton ? (_jsx(IconButton, { "aria-label": "close", onClick: onClose, sx: {
31
20
  position: "absolute",
32
21
  right: 8,
33
22
  top: 8,
34
23
  color: theme.palette.grey[500]
35
- } }, { children: _jsx(CloseIcon, {}) }))) : null] })), _jsxs(DialogContent, __assign({ sx: { paddingTop: theme.spacing(1.25) } }, { children: [desc && _jsx(DialogContentText, { children: desc }), Boolean(children) && cloneElement(children)] })), !hideBottomButtons && (_jsx(DialogActions, __assign({ sx: { padding: theme.spacing(1.25) } }, { children: _jsx(Grid, __assign({ container: true, spacing: 2, justifyContent: "flex-end", alignItems: "center", sx: { margin: 0 } }, { children: buttons || (_jsxs(_Fragment, { children: [_jsx(Grid, __assign({ item: true, xs: 12, md: 3, xl: 2 }, { children: _jsx(Button, __assign({ onClick: onClose, variant: "outlined", color: color, disabled: loading, fullWidth: true }, { children: cancelText })) })), _jsx(Grid, __assign({ item: true, xs: 12, md: 3, xl: 2 }, { children: _jsx(Button, __assign({ type: noForm ? "button" : "submit", onClick: noForm ? onSubmit : undefined, variant: "contained", color: color, disabled: loading || disabled, fullWidth: true }, { children: submitText })) }))] })) })) })))] }));
24
+ }, children: _jsx(CloseIcon, {}) })) : null] }), _jsxs(DialogContent, { sx: { paddingTop: theme.spacing(1.25) }, children: [desc && _jsx(DialogContentText, { children: desc }), Boolean(children) && cloneElement(children)] }), !hideBottomButtons && (_jsx(DialogActions, { sx: { padding: theme.spacing(1.25) }, children: _jsx(Grid, { container: true, spacing: 2, justifyContent: "flex-end", alignItems: "center", sx: { margin: 0 }, children: buttons || (_jsxs(_Fragment, { children: [_jsx(Grid, { item: true, xs: 12, md: 3, xl: 2, children: _jsx(Button, { onClick: onClose, variant: "outlined", color: color, disabled: loading, fullWidth: true, children: cancelText }) }), _jsx(Grid, { item: true, xs: 12, md: 3, xl: 2, children: _jsx(Button, { type: noForm ? "button" : "submit", onClick: noForm ? onSubmit : undefined, variant: "contained", color: color, disabled: loading || disabled, fullWidth: true, children: submitText }) })] })) }) }))] }));
36
25
  }
37
26
  export default Content;
@@ -1,25 +1,3 @@
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
1
  import { jsx as _jsx } from "react/jsx-runtime";
24
2
  import { forwardRef } from "react";
25
3
  import Grid from "@mui/material/Grid";
@@ -29,24 +7,24 @@ import useMediaQuery from "@mui/material/useMediaQuery";
29
7
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
30
8
  import Content from "./Content";
31
9
  import useCustomTheme from "../useCustomTheme";
32
- var Transition = forwardRef(function Transition(props, ref) {
33
- return _jsx(Slide, __assign({ direction: "up" }, props, { ref: ref }));
10
+ const Transition = forwardRef(function Transition(props, ref) {
11
+ return _jsx(Slide, { direction: "up", ...props, ref: ref });
34
12
  });
35
13
  function BasicModal(props) {
36
- var onClose = props.onClose, onSubmit = props.onSubmit, _a = props.maxWidth, maxWidth = _a === void 0 ? "sm" : _a, _b = props.open, open = _b === void 0 ? false : _b, _c = props.noForm, noForm = _c === void 0 ? false : _c, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, rest = __rest(props, ["onClose", "onSubmit", "maxWidth", "open", "noForm", "primaryColor", "secondaryColor"]);
37
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
38
- var fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
39
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Dialog, __assign({ disableEnforceFocus: true, open: open, onClose: function (_, reason) {
14
+ const { onClose, onSubmit, maxWidth = "sm", open = false, noForm = false, primaryColor, secondaryColor, ...rest } = props;
15
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
16
+ const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
17
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Dialog, { disableEnforceFocus: true, open: open, onClose: (_, reason) => {
40
18
  if (reason !== "backdropClick") {
41
19
  onClose();
42
20
  }
43
- }, maxWidth: maxWidth, fullWidth: true, TransitionComponent: Transition, "aria-labelledby": "form-dialog-title", fullScreen: fullScreen, disableEscapeKeyDown: true }, { children: _jsx(Grid, __assign({ component: noForm ? "div" : "form", onSubmit: noForm
21
+ }, maxWidth: maxWidth, fullWidth: true, TransitionComponent: Transition, "aria-labelledby": "form-dialog-title", fullScreen: fullScreen, disableEscapeKeyDown: true, children: _jsx(Grid, { component: noForm ? "div" : "form", onSubmit: noForm
44
22
  ? undefined
45
- : function (e) {
23
+ : (e) => {
46
24
  e.preventDefault();
47
25
  e.stopPropagation();
48
26
  onSubmit();
49
- } }, { children: _jsx(Content, __assign({}, rest, { noForm: noForm, onClose: onClose, onSubmit: onSubmit })) })) })) })));
27
+ }, children: _jsx(Content, { ...rest, noForm: noForm, onClose: onClose, onSubmit: onSubmit }) }) }) }));
50
28
  }
51
29
  export default BasicModal;
52
30
  export * from "./types";
@@ -1,14 +1,3 @@
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
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
2
  import { useCallback } from "react";
14
3
  import { navigate } from "@reach/router";
@@ -18,22 +7,22 @@ import ThemeProvider from "@mui/material/styles/ThemeProvider";
18
7
  import NavigateNextIcon from "@mui/icons-material/NavigateNext";
19
8
  import useCustomTheme from "../useCustomTheme";
20
9
  function Crumbs(props) {
21
- var routes = props.routes, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor;
22
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
23
- var onNavigateTo = useCallback(function (url) {
10
+ const { routes, primaryColor, secondaryColor } = props;
11
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
12
+ const onNavigateTo = useCallback((url) => {
24
13
  navigate(url, { replace: true });
25
14
  }, []);
26
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsxs(Breadcrumbs, __assign({ "aria-label": "breadcrumb", separator: _jsx(NavigateNextIcon, { fontSize: "small" }) }, { children: [_jsx(Typography, {}), routes.map(function (route) {
27
- var href = route.href, label = route.label;
28
- return href ? (_jsx(Typography, __assign({ color: "inherit", sx: {
15
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsxs(Breadcrumbs, { "aria-label": "breadcrumb", separator: _jsx(NavigateNextIcon, { fontSize: "small" }), children: [_jsx(Typography, {}), routes.map(route => {
16
+ const { href, label } = route;
17
+ return href ? (_jsx(Typography, { color: "inherit", sx: {
29
18
  fontSize: 16,
30
19
  fontWeight: 500,
31
20
  "&:hover": {
32
21
  cursor: "pointer",
33
22
  color: theme.palette.primary.light
34
23
  }
35
- }, onClick: function () { return onNavigateTo(href); } }, { children: label }), label)) : (_jsx(Typography, __assign({ sx: { fontSize: 16, fontWeight: 500 }, color: "primary" }, { children: label }), label));
36
- })] })) })));
24
+ }, onClick: () => onNavigateTo(href), children: label }, label)) : (_jsx(Typography, { sx: { fontSize: 16, fontWeight: 500 }, color: "primary", children: label }, label));
25
+ })] }) }));
37
26
  }
38
27
  export default Crumbs;
39
28
  export * from "./types";
@@ -1,36 +1,14 @@
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
1
  import { jsx as _jsx } from "react/jsx-runtime";
24
2
  import Checkbox from "@mui/material/Checkbox";
25
3
  import FormControlLabel from "@mui/material/FormControlLabel";
26
4
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
27
5
  import useCustomTheme from "../useCustomTheme";
28
6
  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) {
7
+ const { label, onChange, primaryColor, secondaryColor, ...rest } = props;
8
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
9
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsx(FormControlLabel, { control: _jsx(Checkbox, { onChange: event => {
32
10
  event.stopPropagation();
33
11
  onChange(event.target.checked);
34
- } }, rest)), label: label }) })));
12
+ }, ...rest }), label: label }) }));
35
13
  }
36
14
  export default CheckBox;
@@ -1,30 +1,8 @@
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
1
  import { jsx as _jsx } from "react/jsx-runtime";
24
2
  import FormGroup from "@mui/material/FormGroup";
25
3
  import CheckBox from "./CheckBox";
26
4
  export function CheckBoxGroup(props) {
27
- var checkboxes = props.checkboxes, rest = __rest(props, ["checkboxes"]);
28
- return (_jsx(FormGroup, __assign({}, rest, { children: checkboxes.map(function (checkbox, index) { return (_jsx(CheckBox, __assign({}, checkbox), index)); }) })));
5
+ const { checkboxes, ...rest } = props;
6
+ return (_jsx(FormGroup, { ...rest, children: checkboxes.map((checkbox, index) => (_jsx(CheckBox, { ...checkbox }, index))) }));
29
7
  }
30
8
  export default CheckBoxGroup;
@@ -1,23 +1,12 @@
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
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
2
  import Link from "@mui/material/Link";
14
3
  import Typography from "@mui/material/Typography";
15
4
  import ThemeProvider from "@mui/material/styles/ThemeProvider";
16
5
  import useCustomTheme from "../useCustomTheme";
17
6
  function Copyright(props) {
18
- var primaryColor = props.primaryColor, secondaryColor = props.secondaryColor;
19
- var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
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(), "."] })) })));
7
+ const { primaryColor, secondaryColor } = props;
8
+ const theme = useCustomTheme({ primaryColor, secondaryColor });
9
+ return (_jsx(ThemeProvider, { theme: theme, children: _jsxs(Typography, { sx: { fontSize: 16, fontWeight: 400 }, color: "textSecondary", align: "center", children: ["Copyright © ", _jsx(Link, { color: "inherit", href: "https://symply.io/", children: "Symply Software Inc" }), "\u00A0", new Date().getFullYear(), "."] }) }));
21
10
  }
22
11
  export default Copyright;
23
12
  export * from "./types";
@@ -1,32 +1,10 @@
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
1
  import { jsx as _jsx } from "react/jsx-runtime";
24
2
  import TableRow from "@mui/material/TableRow";
25
3
  import TableBody from "@mui/material/TableBody";
26
4
  import TableCell from "@mui/material/TableCell";
27
5
  import TableBodyRow from "./TableBodyRow";
28
6
  function TBody(props) {
29
- var rows = props.rows, columns = props.columns, _a = props.noDataText, noDataText = _a === void 0 ? "No Data!" : _a, rest = __rest(props, ["rows", "columns", "noDataText"]);
30
- return (_jsx(TableBody, { children: rows.length > 0 ? (rows.map(function (row, index) { return (_jsx(TableBodyRow, __assign({ row: row, rows: rows, columns: columns }, rest), "DataTable_".concat(index))); })) : (_jsx(TableRow, { children: _jsx(TableCell, __assign({ colSpan: columns.length, align: "center" }, { children: noDataText })) })) }));
7
+ const { rows, columns, noDataText = "No Data!", ...rest } = props;
8
+ return (_jsx(TableBody, { children: rows.length > 0 ? (rows.map((row, index) => (_jsx(TableBodyRow, { row: row, rows: rows, columns: columns, ...rest }, `DataTable_${index}`)))) : (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: columns.length, align: "center", children: noDataText }) })) }));
31
9
  }
32
10
  export default TBody;