@zesty-io/material 0.6.6 → 0.7.0

package/es/FieldTypeText/index.d.ts

@@ -1,10 +1,10 @@
-import { OutlinedTextFieldProps } from '@mui/material/TextField';
-import { ReactNode } from 'react';
-export interface FieldTypeTextProps extends Omit<OutlinedTextFieldProps, 'variant'> {
+import { OutlinedTextFieldProps } from "@mui/material/TextField";
+import { ReactNode } from "react";
+export interface FieldTypeTextProps extends Omit<OutlinedTextFieldProps, "variant"> {
     /**
-    * Max length of the field
-    * @default 150
-    */
+     * Max length of the field
+     * @default 150
+     */
     maxLength?: number;
     value: string;
     endLabel?: ReactNode;

package/es/FieldTypeText/index.js

@@ -1,9 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import MuiTextField from '@mui/material/TextField';
-import { FormControl, FormLabel, Box, InputAdornment } from '@mui/material';
+import MuiTextField from "@mui/material/TextField";
+import { FormControl, FormLabel, Box, InputAdornment } from "@mui/material";
 const FieldTypeText = ({ label, maxLength = 150, value, helperText, required, endLabel, ...props }) => {
-    return (_jsxs(FormControl, { fullWidth: true, required: required, children: [_jsxs(FormLabel, { sx: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', '& .MuiFormLabel-asterisk': { order: 2 } }, children: [_jsx(Box, { sx: { order: 1 }, children: label }), _jsx(Box, { sx: { order: 3, flex: 1, textAlign: 'right' }, children: endLabel })] }), _jsx(MuiTextField, { size: "small", variant: 'outlined', value: value, error: value?.length > maxLength, helperText: value?.length > maxLength ? 'Your input is over the specified limit' : helperText, InputProps: {
-                    endAdornment: (_jsxs(InputAdornment, { position: "end", sx: { fontSize: '14px' }, children: [value?.length, "/", maxLength] })),
+    return (_jsxs(FormControl, { fullWidth: true, required: required, children: [_jsxs(FormLabel, { sx: {
+                    lineHeight: "inherit",
+                    fontSize: "inherit",
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                    "& .MuiFormLabel-asterisk": { order: 2 },
+                    mb: 0.5,
+                }, children: [_jsx(Box, { sx: { order: 1 }, children: label }), _jsx(Box, { sx: { order: 3, flex: 1, textAlign: "right" }, children: endLabel })] }), _jsx(MuiTextField, { size: "small", variant: "outlined", value: value, error: value?.length > maxLength, helperText: value?.length > maxLength
+                    ? "Your input is over the specified limit"
+                    : helperText, InputProps: {
+                    endAdornment: (_jsxs(InputAdornment, { position: "end", sx: { fontSize: "14px" }, children: [value?.length, "/", maxLength] })),
                 }, ...props })] }));
 };
 export default FieldTypeText;

package/es/LegacyTheme/index.d.ts

@@ -1,3 +1,2 @@
-import { Theme } from "@mui/material/styles";
-declare let theme: Theme;
+declare let theme: import("@mui/material/styles").Theme;
 export default theme;

package/es/LegacyTheme/index.js

@@ -20,6 +20,15 @@ theme = createTheme(theme, {
             styleOverrides: {
                 root: {
                     minWidth: "auto",
+                    boxShadow: "none",
+                    textTransform: "none",
+                },
+            },
+        },
+        MuiButtonGroup: {
+            styleOverrides: {
+                root: {
+                    boxShadow: "none",
                 },
             },
         },
@@ -67,17 +76,6 @@ theme = createTheme(theme, {
                 },
             },
         },
-        MuiToggleButton: {
-            styleOverrides: {
-                root: ({ ownerState, theme }) => ({
-                    backgroundColor: `${theme.palette[ownerState.color].contrastText} !important`,
-                    ...(ownerState.selected && {
-                        color: `${theme.palette[ownerState.color].contrastText} !important`,
-                        backgroundColor: `${theme.palette[ownerState.color].main} !important`,
-                    }),
-                }),
-            },
-        },
         MuiCssBaseline: {
             styleOverrides: {
                 body: {
@@ -97,6 +95,52 @@ theme = createTheme(theme, {
                 },
             },
         },
+        MuiOutlinedInput: {
+            styleOverrides: {
+                root: {
+                    padding: "0px 8px",
+                    borderRadius: "8px",
+                    backgroundColor: theme.palette.common.white,
+                    "&.Mui-disabled .MuiOutlinedInput-notchedOutline": {
+                        borderColor: "#F2F4F7",
+                    },
+                    "&:hover .MuiOutlinedInput-notchedOutline": {
+                        borderColor: "#F2F4F7",
+                    },
+                    "&.Mui-focused:hover .MuiOutlinedInput-notchedOutline": {
+                        borderColor: "#FF5D0A",
+                    },
+                },
+                input: {
+                    padding: "10px 0px",
+                    ":read-only": {
+                        color: "#475467",
+                    },
+                },
+                sizeSmall: {
+                    input: {
+                        padding: "8px 0px",
+                    },
+                },
+                notchedOutline: {
+                    borderColor: "#F2F4F7",
+                },
+            },
+        },
+        MuiLink: {
+            styleOverrides: {
+                root: {
+                    color: theme.palette.info.dark,
+                    textDecorationColor: theme.palette.info.main,
+                    "&:hover": {
+                        textDecorationColor: theme.palette.info.dark,
+                    },
+                },
+            },
+            defaultProps: {
+                underline: "hover",
+            },
+        },
     },
 });
 export default theme;

package/es/LegacyTheme/palette.d.ts

@@ -1,3 +1,3 @@
-import { PaletteOptions } from '@mui/material/styles';
+import { PaletteOptions } from "@mui/material/styles";
 declare const palette: PaletteOptions;
 export default palette;

package/es/LegacyTheme/palette.js

@@ -1,23 +1,23 @@
 const palette = {
     primary: {
-        main: '#404759',
-        contrastText: '#ffffff',
+        main: "#404759",
+        contrastText: "#ffffff",
     },
     secondary: {
-        main: '#497edf',
-        contrastText: '#ffffff',
+        main: "#497edf",
+        contrastText: "#ffffff",
     },
     success: {
-        main: '#75bf25',
-        contrastText: '#ffffff',
+        main: "#75bf25",
+        contrastText: "#ffffff",
     },
     warning: {
-        main: '#f17829',
-        contrastText: '#ffffff',
+        main: "#f17829",
+        contrastText: "#ffffff",
     },
     error: {
-        main: '#e53c05',
-        contrastText: '#ffffff',
+        main: "#e53c05",
+        contrastText: "#ffffff",
     },
 };
 export default palette;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zesty-io/material",
-  "version": "0.6.6",
+  "version": "0.7.0",
   "description": "Contains custom components which are in addition to the @mui design-system",
   "author": "Zesty.io",
   "license": "MIT",