@zesty-io/material 0.9.0 → 0.10.0

package/es/FieldTypeOneToMany/index.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { AutocompleteProps } from '@mui/material';
-export interface FieldTypeOneToManyProps extends Omit<AutocompleteProps<any, false, false, false>, 'onOpen' | 'renderInput'> {
+export interface FieldTypeOneToManyProps extends Omit<AutocompleteProps<any, boolean, boolean, boolean>, 'onOpen' | 'renderInput'> {
     label?: string;
     helperText?: string;
     placeholder?: string;

package/es/FieldTypeOneToOne/index.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { AutocompleteProps } from '@mui/material';
-export interface FieldTypeOneToOneProps extends Omit<AutocompleteProps<any, false, false, false>, 'onOpen' | 'renderInput'> {
+export interface FieldTypeOneToOneProps extends Omit<AutocompleteProps<any, boolean, boolean, boolean>, 'onOpen' | 'renderInput'> {
     label?: string;
     helperText?: string;
     placeholder?: string;

package/es/IconButton/index.d.ts

@@ -8,7 +8,7 @@ export declare const IconButton: import("@emotion/styled").StyledComponent<{
     color?: "error" | "inherit" | "primary" | "secondary" | "info" | "success" | "warning" | "default" | undefined;
     disabled?: boolean | undefined;
     disableFocusRipple?: boolean | undefined;
-    edge?: false | "start" | "end" | undefined;
+    edge?: false | "end" | "start" | undefined;
     size?: "small" | "medium" | "large" | "xsmall" | "xxsmall" | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
 } & Omit<{

package/es/TextField.stories.d.ts

@@ -1,5 +1,4 @@
 import { Story, Meta } from '@storybook/react/types-6-0';
-import { TextFieldProps } from '@mui/material';
 declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
 export default _default;
-export declare const Default: Story<TextFieldProps>;
+export declare const Default: Story<import("@mui/material").FilledTextFieldProps | import("@mui/material").OutlinedTextFieldProps | import("@mui/material").StandardTextFieldProps>;

package/es/icons/ScreenShare.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { SvgIconProps } from "@mui/material";
+export declare const ScreenShare: (props: SvgIconProps) => JSX.Element;

package/es/icons/ScreenShare.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SvgIcon } from "@mui/material";
+export const ScreenShare = (props) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M11.225 10.711h1.99v1.282c0 0.1 0.042 0.167 0.127 0.202 0.084 0.036 0.168 0.014 0.252 -0.065l1.891 -1.891a0.45 0.45 0 0 0 0.132 -0.318 0.412 0.412 0 0 0 -0.13 -0.306l-1.894 -1.894c-0.084 -0.079 -0.168 -0.101 -0.252 -0.065 -0.084 0.035 -0.127 0.102 -0.127 0.202v1.282H11.225a2.832 2.832 0 0 0 -2.081 0.856 2.837 2.837 0 0 0 -0.854 2.083v1.498a0.764 0.764 0 0 0 0.791 0.786 0.755 0.755 0 0 0 0.78 -0.786v-1.5c0 -0.384 0.132 -0.708 0.395 -0.971 0.263 -0.263 0.586 -0.394 0.97 -0.394Zm-9.578 10.51a0.772 0.772 0 0 1 -0.785 -0.791 0.762 0.762 0 0 1 0.785 -0.781h20.707a0.768 0.768 0 0 1 0.785 0.788 0.761 0.761 0 0 1 -0.785 0.785H1.646Zm1.908 -3.072c-0.461 0 -0.859 -0.168 -1.198 -0.505a1.637 1.637 0 0 1 -0.506 -1.198v-11.892c0 -0.462 0.168 -0.862 0.506 -1.2 0.338 -0.34 0.737 -0.509 1.198 -0.509h16.891c0.462 0 0.863 0.168 1.201 0.508 0.34 0.34 0.509 0.739 0.509 1.201v11.892c0 0.461 -0.169 0.859 -0.509 1.198a1.644 1.644 0 0 1 -1.2 0.506H3.552Zm0 -1.703h16.891v-11.892H3.554v11.892Z", fill: "currentColor" }) }));

package/es/icons/index.d.ts

@@ -8,3 +8,4 @@ export { EditNote } from "./EditNote";
 export { FileTable } from "./FileTable";
 export { Brain } from "./Brain";
 export { Home } from "./Home";
+export { ScreenShare } from './ScreenShare';

package/es/icons/index.js

@@ -8,3 +8,4 @@ export { EditNote } from "./EditNote";
 export { FileTable } from "./FileTable";
 export { Brain } from "./Brain";
 export { Home } from "./Home";
+export { ScreenShare } from './ScreenShare';

package/es/theme/index.d.ts

@@ -2,9 +2,6 @@ declare module "@mui/material/styles" {
     interface Palette {
         border: string;
     }
-    interface Theme {
-        typography: TypographyVariantsOptions;
-    }
 }
 declare module "@mui/material/IconButton" {
     interface IconButtonPropsSizeOverrides {

package/es/theme/index.js

@@ -9,22 +9,34 @@ const components = {
             }),
         },
     },
+    MuiTabs: {
+        styleOverrides: {
+            root: {
+                minHeight: "44px",
+            },
+            flexContainer: {
+                gap: "16px",
+                height: "44px",
+            },
+        },
+    },
     MuiTab: {
         styleOverrides: {
             root: ({ theme }) => ({
-                padding: "8px",
-                margin: "8px",
-                borderRadius: "8px",
+                color: theme.palette.text.disabled,
+                paddingLeft: 0,
+                paddingRight: 0,
                 minHeight: "unset",
                 minWidth: "unset",
                 textTransform: "none",
                 "&:hover": {
-                    backgroundColor: theme.palette.grey[100],
+                    color: theme.palette.text.primary,
                 },
                 "&.Mui-selected": {
-                    "&:hover": {
-                        backgroundColor: theme.palette.deepOrange[50],
-                    },
+                    color: theme.palette.text.primary,
+                },
+                "& .MuiTab-iconWrapper": {
+                    marginRight: "4px",
                 },
             }),
         },
@@ -83,7 +95,7 @@ const components = {
             disableElevation: true,
         },
         styleOverrides: {
-            groupedContained: ({ theme }) => ({
+            groupedContainedPrimary: ({ theme }) => ({
                 color: theme.palette.primary.main,
                 backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity),
                 "&:hover": {
@@ -174,7 +186,7 @@ const components = {
                 borderRadius: "4px",
             },
             sizeSmall: {
-                padding: "4px",
+                padding: "6px",
             },
         },
         variants: [
@@ -259,6 +271,15 @@ const components = {
             },
         },
     },
+    MuiMenuItem: {
+        styleOverrides: {
+            root: {
+                " .MuiListItemIcon-root": {
+                    minWidth: "32px",
+                },
+            },
+        },
+    },
     MuiAccordion: {
         styleOverrides: {
             root: ({ theme }) => ({
@@ -331,7 +352,7 @@ const components = {
             }),
             columnHeaders: ({ theme }) => ({
                 borderColor: theme.palette.border,
-                backgroundColor: theme.palette.grey[50],
+                backgroundColor: theme.palette.grey[100],
             }),
             columnHeader: {
                 padding: "0 16px",
@@ -488,6 +509,29 @@ const components = {
             }),
         },
     },
+    MuiBreadcrumbs: {
+        styleOverrides: {
+            root: ({ theme }) => ({
+                '& button[aria-label="Show path"]': {
+                    backgroundColor: "transparent",
+                    margin: 0,
+                    color: theme.palette.action.active,
+                    svg: {
+                        width: "20px",
+                        height: "20px",
+                    },
+                    "&:hover": {
+                        color: theme.palette.primary.main,
+                    },
+                },
+            }),
+            separator: ({ theme }) => ({
+                color: theme.palette.grey[400],
+                height: "20px",
+                alignItems: "center",
+            }),
+        },
+    },
     MuiScopedCssBaseline: {
         styleOverrides: {
             root: ({ theme }) => ({
@@ -506,6 +550,13 @@ const components = {
             }),
         },
     },
+    MuiToggleButton: {
+        styleOverrides: {
+            sizeSmall: {
+                fontSize: "16px",
+            },
+        },
+    },
 };
 export let theme = createTheme({
     typography,

package/es/theme/palette.d.ts

@@ -48,7 +48,7 @@ declare const darkThemePalette: {
     mode?: import("@mui/material").PaletteMode | undefined;
     tonalOffset?: import("@mui/material/styles/createPalette").PaletteTonalOffset | undefined;
     contrastThreshold?: number | undefined;
-    common?: Partial<import("@mui/material/styles/createPalette").CommonColors> | undefined;
+    common?: Partial<import("@mui/material").CommonColors> | undefined;
     grey?: Partial<Color> | undefined;
     divider?: string | undefined;
     getContrastText?: ((background: string) => string) | undefined;

package/es/theme/typography.js

@@ -3,22 +3,27 @@ const typography = {
     h1: {
         fontSize: "36px",
         lineHeight: "44px",
+        letterSpacing: "-0.56px",
     },
     h2: {
         fontSize: "32px",
         lineHeight: "40px",
+        letterSpacing: "-0.56px",
     },
     h3: {
         fontSize: "28px",
         lineHeight: "36px",
+        letterSpacing: "-0.56px",
     },
     h4: {
         fontSize: "24px",
         lineHeight: "32px",
+        letterSpacing: "-0.56px",
     },
     h5: {
         fontSize: "20px",
         lineHeight: "28px",
+        letterSpacing: "-0.56px",
     },
     h6: {
         fontSize: "16px",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zesty-io/material",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "Contains custom components which are in addition to the @mui design-system",
   "author": "Zesty.io",
   "license": "MIT",
@@ -29,8 +29,8 @@
   "dependencies": {
     "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",
-    "@mui/icons-material": "^5.6.2",
-    "@mui/material": "^5.6.4",
+    "@mui/icons-material": "^5.14.3",
+    "@mui/material": "^5.14.5",
     "@mui/x-date-pickers": "^5.0.0-alpha.5",
     "date-fns": "^2.28.0",
     "react-window": "^1.8.7"