@symply.io/basic-components 1.0.0-beta.2 → 1.0.0-beta.3

package/BasicModal/Content.js

@@ -24,14 +24,14 @@ function Content(props) {
     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;
     var theme = useTheme();
     return (_jsxs(_Fragment, { children: [_jsxs(DialogTitle, __assign({ id: "form-dialog-title", sx: {
-                    "& > h6": {
-                        fontWeight: "700",
-                    },
-                } }, { children: [title, showTopRightCloseButton ? (_jsx(IconButton, __assign({ "aria-label": "close", onClick: onClose, sx: {
+                    "& > span": {
+                        fontWeight: "700!important"
+                    }
+                } }, { children: [_jsx("span", { children: title }), showTopRightCloseButton ? (_jsx(IconButton, __assign({ "aria-label": "close", onClick: onClose, sx: {
                             position: "absolute",
                             right: 8,
                             top: 8,
-                            color: theme.palette.grey[500],
+                            color: theme.palette.grey[500]
                         } }, { 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 })) }))] })) })) })))] }));
 }
 export default Content;

package/DynamicHeaderBar/HeaderButtons.js

@@ -29,8 +29,8 @@ function HeaderButtons(props) {
                         return (_jsx(Grid, __assign({ item: true, xs: isLessThanSm ? 12 : undefined, style: { textAlign: "end" } }, { children: _jsx(Button, __assign({ fullWidth: isLessThanSm, variant: variant, onClick: onClick, color: color, size: isLessThanSm ? "small" : size, startIcon: startIcon, endIcon: endIcon, disabled: disabled }, { children: text })) }), text));
                     }
                     case HeaderButtonCategory.IconButton: {
-                        var title = button.title, onClick = button.onClick, color = button.color, _b = button.size, size = _b === void 0 ? "medium" : _b, icon = button.icon;
-                        return (_jsx(Grid, __assign({ item: true, style: { textAlign: "end" } }, { children: _jsx(Fab, __assign({ onClick: onClick, color: color, title: title, size: isLessThanSm ? "small" : size }, { children: icon })) }), title));
+                        var title = button.title, onClick = button.onClick, color = button.color, _b = button.size, size = _b === void 0 ? "medium" : _b, icon = button.icon, disabled = button.disabled, variant = button.variant;
+                        return (_jsx(Grid, __assign({ item: true, style: { textAlign: "end" } }, { children: _jsx(Fab, __assign({ onClick: onClick, color: color, title: title, size: isLessThanSm ? "small" : size, disabled: disabled, variant: variant }, { children: icon })) }), title));
                     }
                     case HeaderButtonCategory.MenuButton: {
                         var btns = button.buttons, buttonText = button.buttonText, disabled = button.disabled, variant = button.variant, size = button.size;

package/DynamicHeaderBar/types.d.ts

@@ -1,6 +1,7 @@
 import { ReactElement } from "react";
 import { ButtonProps } from "@mui/material/Button";
 import { IconButtonProps } from "@mui/material/IconButton";
+import { FabProps } from "@mui/material/Fab";
 import { MenuButtonGroupProps } from "../MenuButtonGroup";
 export declare enum HeaderButtonCategory {
     IconButton = "icon",
@@ -21,7 +22,9 @@ interface HeaderTextButtonProps {
 interface HeaderIconButtonProps {
     title: string;
     icon: ReactElement;
+    disabled?: boolean;
     type: HeaderButtonCategory.IconButton;
+    variant?: FabProps["variant"];
     color?: IconButtonProps["color"];
     size?: IconButtonProps["size"];
     onClick: IconButtonProps["onClick"];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symply.io/basic-components",
-  "version": "1.0.0-beta.2",
+  "version": "1.0.0-beta.3",
   "description": "Basic and reusable components for all frontend of Symply apps",
   "keywords": [
     "react",