@symply.io/basic-components 1.3.11-alpha.8 → 1.4.0-alpha.1
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.
- package/AlertDialog/index.js +30 -8
- package/Autocomplete/index.js +32 -10
- package/Autocomplete/useInteractions.js +3 -3
- package/AutocompleteWithFilter/index.js +35 -12
- package/BasicModal/Content.js +16 -5
- package/BasicModal/index.js +31 -9
- package/BreadCrumbs/index.js +19 -8
- package/CheckBox/CheckBox.js +26 -4
- package/CheckBox/CheckBoxGroup.js +24 -2
- package/CheckBox/index.d.ts +3 -2
- package/CheckBox/index.js +3 -2
- package/Copyright/index.js +14 -3
- package/DataTable/TableBody.js +24 -2
- package/DataTable/TableBodyRow.js +52 -41
- package/DataTable/TableFooter.js +41 -30
- package/DataTable/TableHeader.js +47 -36
- package/DataTable/index.js +28 -17
- package/DataTable/useTable.js +54 -46
- package/DateInput/FullDateInput/index.js +42 -20
- package/DateInput/FullDateInput/useInteractions.js +10 -10
- package/DateInput/MonthDayInput/index.js +36 -14
- package/DateInput/MonthDayInput/useInteractions.js +9 -9
- package/DateInput/MonthYearInput/index.js +36 -14
- package/DateInput/MonthYearInput/useInteractions.js +9 -9
- package/DigitInput/index.js +28 -6
- package/DigitInput/useInteractions.js +9 -9
- package/DynamicHeaderBar/HeaderBar.js +17 -6
- package/DynamicHeaderBar/HeaderButtons.js +24 -13
- package/DynamicHeaderBar/HeaderLine.js +2 -2
- package/DynamicHeaderBar/index.js +26 -15
- package/FeinInput/index.js +38 -16
- package/FeinInput/useInteractions.js +9 -9
- package/FileUploader/index.js +33 -11
- package/FileUploader/useInteractions.js +44 -29
- package/FormRadioGroup/index.js +29 -4
- package/FormSelector/MultipleSelector.js +32 -9
- package/FormSelector/SimpleSelector.js +32 -9
- package/FormSelector/useInteractions.js +7 -7
- package/HelpCaption/index.js +17 -6
- package/HelpCaption/useInteractions.js +2 -2
- package/LoadingModal/Modal.js +15 -4
- package/LoadingModal/useLoadingModal.js +33 -15
- package/MenuButtonGroup/MenuItem.js +14 -3
- package/MenuButtonGroup/index.js +82 -14
- package/NumberInput/index.js +27 -5
- package/NumberInput/useInteractions.js +17 -17
- package/PasswordInput/ConfirmPassword.js +28 -6
- package/PasswordInput/Password.js +37 -15
- package/PhoneNumberInput/index.js +39 -17
- package/PhoneNumberInput/useInteractions.js +10 -10
- package/Sidebar/SidebarItem.js +17 -6
- package/Sidebar/SidebarItemsGroup.js +21 -10
- package/Sidebar/SidebarLink.js +27 -5
- package/Sidebar/index.js +17 -6
- package/SocialInput/index.js +40 -18
- package/SocialInput/useInteractions.js +14 -14
- package/TabGroup/index.js +25 -14
- package/TablePagination/Actions.js +15 -4
- package/TablePagination/index.js +14 -3
- package/TablePagination/useInteractions.js +9 -9
- package/TextInput/index.js +30 -8
- package/TextInput/useInteractions.js +4 -4
- package/ToastPrompt/Prompt.d.ts +2 -1
- package/ToastPrompt/Prompt.js +22 -57
- package/ToastPrompt/index.js +18 -7
- package/ToastPrompt/types.d.ts +7 -13
- package/ToastPrompt/useInteractions.d.ts +6 -5
- package/ToastPrompt/useInteractions.js +25 -13
- package/VideoPlayerModal/index.js +27 -5
- package/package.json +1 -1
- package/useCustomTheme.js +16 -11
- package/utils/uuid.js +11 -10
package/AlertDialog/index.js
CHANGED
@@ -1,3 +1,25 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
24
|
import { forwardRef, cloneElement } from "react";
|
3
25
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
@@ -9,18 +31,18 @@ import DialogContent from "@mui/material/DialogContent";
|
|
9
31
|
import useMediaQuery from "@mui/material/useMediaQuery";
|
10
32
|
import Slide from "@mui/material/Slide";
|
11
33
|
import useCustomTheme from "../useCustomTheme";
|
12
|
-
|
13
|
-
return _jsx(Slide, { direction: "up",
|
34
|
+
var Transition = forwardRef(function Transition(props, ref) {
|
35
|
+
return _jsx(Slide, __assign({ direction: "up" }, props, { ref: ref }));
|
14
36
|
});
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsxs(Dialog, { maxWidth: maxWidth, fullScreen: fullScreen, TransitionComponent: Transition, open: open, onClose: (_, reason)
|
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) {
|
20
42
|
if (reason !== "backdropClick") {
|
21
43
|
onClose();
|
22
44
|
}
|
23
|
-
}, "aria-labelledby": "alert-dialog-title", "aria-describedby": "alert-dialog-description",
|
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" }))) })] })) })));
|
24
46
|
};
|
25
47
|
export default AlertDialog;
|
26
48
|
export * from "./types";
|
package/Autocomplete/index.js
CHANGED
@@ -1,3 +1,25 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
24
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
3
25
|
import Autocomplete from "@mui/material/Autocomplete";
|
@@ -5,13 +27,16 @@ import TextField from "@mui/material/TextField";
|
|
5
27
|
import useInteractions from "./useInteractions";
|
6
28
|
import useCustomTheme from "../useCustomTheme";
|
7
29
|
function CustomAutocomplete(props) {
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, disabled: disabled, limitTags: limitTags
|
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) {
|
12
34
|
event.preventDefault();
|
13
35
|
onChange(val);
|
14
|
-
}, getOptionLabel:
|
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) {
|
15
40
|
if (typeof opt === "string") {
|
16
41
|
return opt === val;
|
17
42
|
}
|
@@ -19,12 +44,9 @@ function CustomAutocomplete(props) {
|
|
19
44
|
return String(opt.value) === String(val.value);
|
20
45
|
}
|
21
46
|
return opt.label === val.label;
|
22
|
-
}, value: value, inputValue: inputValue, onInputChange: (event, val)
|
47
|
+
}, value: value, inputValue: inputValue, onInputChange: function (event, val) {
|
23
48
|
onInputChange(val);
|
24
|
-
}, renderInput: params
|
25
|
-
...params.inputProps,
|
26
|
-
required: required && (Array.isArray(value) ? value.length === 0 : !value)
|
27
|
-
} })) }) }));
|
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) }) }))); } }) })));
|
28
50
|
}
|
29
51
|
export default CustomAutocomplete;
|
30
52
|
export * from "./types";
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { useState, useCallback } from "react";
|
2
2
|
function useInteractions() {
|
3
|
-
|
4
|
-
|
3
|
+
var _a = useState(""), inputValue = _a[0], setInputValue = _a[1];
|
4
|
+
var onInputChange = useCallback(function (value) {
|
5
5
|
setInputValue(value);
|
6
6
|
}, []);
|
7
|
-
return { inputValue, onInputChange };
|
7
|
+
return { inputValue: inputValue, onInputChange: onInputChange };
|
8
8
|
}
|
9
9
|
export default useInteractions;
|
@@ -1,3 +1,25 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
24
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
3
25
|
import Checkbox from "@mui/material/Checkbox";
|
@@ -6,21 +28,21 @@ import Autocomplete, { createFilterOptions } from "@mui/material/Autocomplete";
|
|
6
28
|
import CheckBoxOutlineBlankIcon from "@mui/icons-material/CheckBoxOutlineBlank";
|
7
29
|
import CheckBoxIcon from "@mui/icons-material/CheckBox";
|
8
30
|
import useCustomTheme from "../useCustomTheme";
|
9
|
-
|
10
|
-
|
31
|
+
var icon = _jsx(CheckBoxOutlineBlankIcon, { fontSize: "small" });
|
32
|
+
var checkedIcon = _jsx(CheckBoxIcon, { fontSize: "small" });
|
11
33
|
function AutocompleteWithFilter(props) {
|
12
|
-
|
13
|
-
|
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({
|
14
36
|
ignoreCase: true,
|
15
37
|
ignoreAccents: true,
|
16
38
|
trim: true,
|
17
|
-
stringify: (option)
|
39
|
+
stringify: function (option) { return option.label; }
|
18
40
|
});
|
19
|
-
|
20
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Autocomplete, { size: size, fullWidth: true, loading: loading, limitTags: limitTags
|
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) {
|
21
43
|
event.preventDefault();
|
22
44
|
onChange(val);
|
23
|
-
}, value: value, disableCloseOnSelect: disableCloseOnSelect || multiple, getOptionLabel: option
|
45
|
+
}, value: value, disableCloseOnSelect: disableCloseOnSelect || multiple, getOptionLabel: function (option) { return option.label; }, isOptionEqualToValue: function (opt, val) {
|
24
46
|
if (typeof opt === "string") {
|
25
47
|
return opt === val;
|
26
48
|
}
|
@@ -28,10 +50,11 @@ function AutocompleteWithFilter(props) {
|
|
28
50
|
return String(opt.value) === String(val.value);
|
29
51
|
}
|
30
52
|
return opt.label === val.label;
|
31
|
-
}, renderOption:
|
32
|
-
|
33
|
-
|
34
|
-
} })) }) }));
|
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) }) }))); } }) })));
|
35
58
|
}
|
36
59
|
export default AutocompleteWithFilter;
|
37
60
|
export * from "./types";
|
package/BasicModal/Content.js
CHANGED
@@ -1,3 +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
|
+
};
|
1
12
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
2
13
|
import { cloneElement } from "react";
|
3
14
|
import useTheme from "@mui/material/styles/useTheme";
|
@@ -10,17 +21,17 @@ import IconButton from "@mui/material/IconButton";
|
|
10
21
|
import CloseIcon from "@mui/icons-material/Close";
|
11
22
|
import Grid from "@mui/material/Grid";
|
12
23
|
function Content(props) {
|
13
|
-
|
14
|
-
|
15
|
-
return (_jsxs(_Fragment, { children: [_jsxs(DialogTitle, { sx: {
|
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: {
|
16
27
|
"& > span": {
|
17
28
|
fontWeight: "700!important"
|
18
29
|
}
|
19
|
-
}, children: [_jsx("span", { children: title }), showTopRightCloseButton ? (_jsx(IconButton, { "aria-label": "close", onClick: onClose, sx: {
|
30
|
+
} }, { children: [_jsx("span", { children: title }), showTopRightCloseButton ? (_jsx(IconButton, __assign({ "aria-label": "close", onClick: onClose, sx: {
|
20
31
|
position: "absolute",
|
21
32
|
right: 8,
|
22
33
|
top: 8,
|
23
34
|
color: theme.palette.grey[500]
|
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 }) })] })) }) }))] }));
|
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 })) }))] })) })) })))] }));
|
25
36
|
}
|
26
37
|
export default Content;
|
package/BasicModal/index.js
CHANGED
@@ -1,3 +1,25 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
24
|
import { forwardRef } from "react";
|
3
25
|
import Grid from "@mui/material/Grid";
|
@@ -7,24 +29,24 @@ import useMediaQuery from "@mui/material/useMediaQuery";
|
|
7
29
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
8
30
|
import Content from "./Content";
|
9
31
|
import useCustomTheme from "../useCustomTheme";
|
10
|
-
|
11
|
-
return _jsx(Slide, { direction: "up",
|
32
|
+
var Transition = forwardRef(function Transition(props, ref) {
|
33
|
+
return _jsx(Slide, __assign({ direction: "up" }, props, { ref: ref }));
|
12
34
|
});
|
13
35
|
function BasicModal(props) {
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsx(Dialog, { disableEnforceFocus: true, open: open, onClose: (_, reason)
|
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) {
|
18
40
|
if (reason !== "backdropClick") {
|
19
41
|
onClose();
|
20
42
|
}
|
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
|
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
|
22
44
|
? undefined
|
23
|
-
: (e)
|
45
|
+
: function (e) {
|
24
46
|
e.preventDefault();
|
25
47
|
e.stopPropagation();
|
26
48
|
onSubmit();
|
27
|
-
}, children: _jsx(Content, {
|
49
|
+
} }, { children: _jsx(Content, __assign({}, rest, { noForm: noForm, onClose: onClose, onSubmit: onSubmit })) })) })) })));
|
28
50
|
}
|
29
51
|
export default BasicModal;
|
30
52
|
export * from "./types";
|
package/BreadCrumbs/index.js
CHANGED
@@ -1,3 +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
|
+
};
|
1
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
13
|
import { useCallback } from "react";
|
3
14
|
import { navigate } from "@reach/router";
|
@@ -7,22 +18,22 @@ import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
|
7
18
|
import NavigateNextIcon from "@mui/icons-material/NavigateNext";
|
8
19
|
import useCustomTheme from "../useCustomTheme";
|
9
20
|
function Crumbs(props) {
|
10
|
-
|
11
|
-
|
12
|
-
|
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) {
|
13
24
|
navigate(url, { replace: true });
|
14
25
|
}, []);
|
15
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsxs(Breadcrumbs, { "aria-label": "breadcrumb", separator: _jsx(NavigateNextIcon, { fontSize: "small" }), children: [_jsx(Typography, {}), routes.map(route
|
16
|
-
|
17
|
-
return href ? (_jsx(Typography, { color: "inherit", sx: {
|
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: {
|
18
29
|
fontSize: 16,
|
19
30
|
fontWeight: 500,
|
20
31
|
"&:hover": {
|
21
32
|
cursor: "pointer",
|
22
33
|
color: theme.palette.primary.light
|
23
34
|
}
|
24
|
-
}, onClick: ()
|
25
|
-
})] }) }));
|
35
|
+
}, onClick: function () { return onNavigateTo(href); } }, { children: label }), label)) : (_jsx(Typography, __assign({ sx: { fontSize: 16, fontWeight: 500 }, color: "primary" }, { children: label }), label));
|
36
|
+
})] })) })));
|
26
37
|
}
|
27
38
|
export default Crumbs;
|
28
39
|
export * from "./types";
|
package/CheckBox/CheckBox.js
CHANGED
@@ -1,14 +1,36 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
24
|
import Checkbox from "@mui/material/Checkbox";
|
3
25
|
import FormControlLabel from "@mui/material/FormControlLabel";
|
4
26
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
5
27
|
import useCustomTheme from "../useCustomTheme";
|
6
28
|
export function CheckBox(props) {
|
7
|
-
|
8
|
-
|
9
|
-
return (_jsx(ThemeProvider, { theme: theme, children: _jsx(FormControlLabel, { control: _jsx(Checkbox, { onChange: event
|
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) {
|
10
32
|
event.stopPropagation();
|
11
33
|
onChange(event.target.checked);
|
12
|
-
},
|
34
|
+
} }, rest)), label: label }) })));
|
13
35
|
}
|
14
36
|
export default CheckBox;
|
@@ -1,8 +1,30 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
24
|
import FormGroup from "@mui/material/FormGroup";
|
3
25
|
import CheckBox from "./CheckBox";
|
4
26
|
export function CheckBoxGroup(props) {
|
5
|
-
|
6
|
-
return (_jsx(FormGroup, {
|
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)); }) })));
|
7
29
|
}
|
8
30
|
export default CheckBoxGroup;
|
package/CheckBox/index.d.ts
CHANGED
package/CheckBox/index.js
CHANGED
package/Copyright/index.js
CHANGED
@@ -1,12 +1,23 @@
|
|
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
|
+
};
|
1
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
13
|
import Link from "@mui/material/Link";
|
3
14
|
import Typography from "@mui/material/Typography";
|
4
15
|
import ThemeProvider from "@mui/material/styles/ThemeProvider";
|
5
16
|
import useCustomTheme from "../useCustomTheme";
|
6
17
|
function Copyright(props) {
|
7
|
-
|
8
|
-
|
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(), "."] }) }));
|
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(), "."] })) })));
|
10
21
|
}
|
11
22
|
export default Copyright;
|
12
23
|
export * from "./types";
|
package/DataTable/TableBody.js
CHANGED
@@ -1,10 +1,32 @@
|
|
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
|
+
};
|
1
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
24
|
import TableRow from "@mui/material/TableRow";
|
3
25
|
import TableBody from "@mui/material/TableBody";
|
4
26
|
import TableCell from "@mui/material/TableCell";
|
5
27
|
import TableBodyRow from "./TableBodyRow";
|
6
28
|
function TBody(props) {
|
7
|
-
|
8
|
-
return (_jsx(TableBody, { children: rows.length > 0 ? (rows.map((row, index)
|
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 })) })) }));
|
9
31
|
}
|
10
32
|
export default TBody;
|