core: Extracted similar code used in other projects

library/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@irontec/ivoz-ui",
- "version": "1.1.16",
+ "version": "1.1.17",
  "description": "UI library used in ivozprovider",
  "license": "GPL-3.0",
  "main": "index.js",

library/src/components/Dialog/DialogContentBody.styles.tsx

@@ -0,0 +1,19 @@
+import { Box, SxProps, Theme } from '@mui/material';
+import { styled } from '@mui/styles';
+
+type StyledDialogContentBodyProps = {
+ sx?: SxProps<Theme>;
+};
+
+export const StyledDialogContentBody = styled(
+ Box
+)<StyledDialogContentBodyProps>(({ sx }) => {
+ const resolvedStyles = {
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ ...sx,
+ };
+
+ return resolvedStyles as any;
+});

library/src/components/Dialog/DialogContentBody.tsx

@@ -0,0 +1,15 @@
+import { SxProps, Theme } from '@mui/material';
+import { StyledDialogContentBody } from './DialogContentBody.styles';
+
+interface DialogContentProps {
+ child: JSX.Element;
+ sx?: SxProps<Theme>;
+}
+const DialogContentBody = (props: DialogContentProps) => {
+ const { child, sx } = props;
+ return (
+ <StyledDialogContentBody sx={{ ...sx }}>{child}</StyledDialogContentBody>
+ );
+};
+
+export default DialogContentBody;

library/src/components/ErrorMessageComponent.tsx

@@ -0,0 +1,21 @@
+import ErrorIcon from '@mui/icons-material/Error';
+
+interface ErrorMessage {
+ message?: string;
+}
+
+const ErrorMessageComponent = (props: ErrorMessage) => {
+ const { message } = props;
+ return (
+ <span>
+ <ErrorIcon
+ sx={{
+ verticalAlign: 'bottom',
+ }}
+ />
+ {message ?? 'There was a problem'}
+ </span>
+ );
+};
+
+export default ErrorMessageComponent;