@zesty-io/material 0.9.0 → 0.11.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/DatabaseSearch.d.ts

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

package/es/icons/DatabaseSearch.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SvgIcon } from "@mui/material";
+export const DatabaseSearch = (props) => (_jsx(SvgIcon, { ...props, children: _jsx("path", { d: "M17.68 11.32C17.2622 10.9022 16.7661 10.571 16.22 10.3453C15.674 10.1196 15.0888 10.0039 14.4979 10.0048C13.9071 10.0057 13.3222 10.1233 12.7769 10.3507C12.2316 10.5781 11.7365 10.9109 11.32 11.33C10.9015 11.7471 10.5695 12.2427 10.343 12.7884C10.1164 13.3341 9.99981 13.9192 9.99981 14.51C9.99981 15.1008 10.1164 15.6859 10.343 16.2316C10.5695 16.7773 10.9015 17.2729 11.32 17.69C12.041 18.4084 12.9838 18.8616 13.9952 18.976C15.0065 19.0904 16.0268 18.8592 16.89 18.32L20 21.39L21.39 20L18.3 16.89C19.43 15.12 19.17 12.8 17.68 11.32ZM16.27 16.27C15.29 17.25 13.71 17.24 12.73 16.27C11.76 15.29 11.76 13.71 12.74 12.73C13.71 11.76 15.29 11.76 16.27 12.73C17.24 13.71 17.24 15.29 16.27 16.27ZM9.9 19.1C9.2474 18.4406 8.74285 17.6497 8.42 16.78C5.27 16.25 3 14.76 3 13V16C3 18.21 6.58 20 11 20C10.6 19.74 10.23 19.44 9.9 19.1ZM3 8V11C3 12.68 5.07 14.12 8 14.7V14.5C8 13.57 8.2 12.65 8.58 11.81C5.34 11.3 3 9.79 3 8ZM11 2C6.58 2 3 3.79 3 6C3 8 6 9.68 9.85 10H9.9C11.1 8.74 12.76 8 14.5 8C15.41 8 16.31 8.19 17.14 8.56C17.6445 8.3299 18.0808 7.97325 18.4068 7.52468C18.7327 7.07611 18.937 6.55088 19 6C19 3.79 15.42 2 11 2Z", fill: "currentColor" }) }));

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,5 @@ export { EditNote } from "./EditNote";
 export { FileTable } from "./FileTable";
 export { Brain } from "./Brain";
 export { Home } from "./Home";
+export { ScreenShare } from "./ScreenShare";
+export { DatabaseSearch } from "./DatabaseSearch";

package/es/icons/index.js

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

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.11.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"
@@ -52,8 +52,5 @@
     "react-json-view": "^1.21.3",
     "typescript": "^4.6.3"
   },
-  "files": [
-    "cjs",
-    "es"
-  ]
+  "files": ["cjs", "es"]
 }