@movable/ui 2.9.0 → 2.11.0

package/lib/theme/components/surfaces/card.d.ts

@@ -0,0 +1,61 @@
+import { Theme } from '@mui/material/styles';
+declare const card: {
+    MuiCard: {
+        defaultProps: {
+            variant: string;
+        };
+        styleOverrides: {
+            root: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: number;
+                paddingBottom: string;
+                borderRadius: string;
+            };
+        };
+    };
+    MuiCardHeader: {
+        styleOverrides: {
+            root: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: string;
+                paddingBottom: number;
+            };
+            title: {
+                color: string;
+                fontSize: string;
+                fontWeight: number;
+            };
+            subheader: {
+                color: string;
+                fontSize: string;
+            };
+        };
+    };
+    MuiCardActions: {
+        styleOverrides: {
+            root: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: string;
+                paddingBottom: number;
+            };
+        };
+    };
+    MuiCardContent: {
+        styleOverrides: {
+            root: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: string;
+                paddingBottom: number;
+                '& .MuiTypography-root': {
+                    color: string;
+                    fontSize: string;
+                };
+            };
+        };
+    };
+};
+export default card;

package/lib/theme/components/surfaces/index.d.ts

@@ -0,0 +1,3 @@
+import card from './card';
+import paper from './paper';
+export { card, paper };

package/lib/theme/components/surfaces/paper.d.ts

@@ -0,0 +1,26 @@
+import { Theme } from '@mui/material/styles';
+declare const paper: {
+    MuiPaper: {
+        defaultProps: {
+            variant: string;
+        };
+        styleOverrides: {
+            root: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: string;
+            };
+        };
+    };
+    MuiMenu: {
+        styleOverrides: {
+            paper: ({ theme }: {
+                theme: Theme;
+            }) => {
+                padding: number;
+                boxShadow: string;
+            };
+        };
+    };
+};
+export default paper;

package/lib/theme/components/typography.d.ts

@@ -0,0 +1,18 @@
+import { Theme, TypographyProps } from '@mui/material';
+declare const typography: {
+    MuiTypography: {
+        styleOverrides: {
+            root: ({ ownerState }: {
+                ownerState: TypographyProps;
+            }) => {
+                fontWeight?: number | undefined;
+            };
+            overline: ({ theme }: {
+                theme: Theme;
+            }) => {
+                color: string;
+            };
+        };
+    };
+};
+export default typography;

package/lib/theme/palette.d.ts

@@ -0,0 +1,237 @@
+declare const palette: {
+    text: {
+        primary: "#212121";
+        secondary: "#616161";
+        disabled: "#9e9e9e";
+    };
+    focusVisible: string;
+    blue50: "#e3f2fd";
+    blue100: "#bbdefb";
+    blue200: "#90caf9";
+    blue300: "#64b5f6";
+    blue400: "#42a5f5";
+    blue500: "#2196f3";
+    blue600: string;
+    blue700: string;
+    blue800: string;
+    blue900: string;
+    blueA100: "#82b1ff";
+    blueA200: "#448aff";
+    blueA400: "#2979ff";
+    blueA700: "#2962ff";
+    blue1000: string;
+    green50: string;
+    green100: string;
+    green200: string;
+    green300: string;
+    green400: string;
+    green500: string;
+    green600: string;
+    green700: string;
+    green800: string;
+    green900: string;
+    green1000: string;
+    greenA100: string;
+    greenA200: string;
+    greenA400: string;
+    greenA700: string;
+    greenA900: string;
+    lightBlue50: "#e1f5fe";
+    lightBlue100: "#b3e5fc";
+    lightBlue200: "#81d4fa";
+    lightBlue300: "#4fc3f7";
+    lightBlue400: "#29b6f6";
+    lightBlue500: "#03a9f4";
+    lightBlue600: "#039be5";
+    lightBlue700: "#0288d1";
+    lightBlue800: "#0277bd";
+    lightBlue900: "#01579b";
+    lightBlue1000: string;
+    lightBlueA100: "#80d8ff";
+    lightBlueA200: "#40c4ff";
+    lightBlueA400: "#00b0ff";
+    lightBlueA700: "#0091ea";
+    lightGreen50: "#f1f8e9";
+    lightGreen100: "#dcedc8";
+    lightGreen200: "#c5e1a5";
+    lightGreen300: "#aed581";
+    lightGreen400: "#9ccc65";
+    lightGreen500: "#8bc34a";
+    lightGreen600: "#7cb342";
+    lightGreen700: "#689f38";
+    lightGreen800: "#558b2f";
+    lightGreen900: "#33691e";
+    neutral00: string;
+    neutral50: "#fafafa";
+    neutral100: "#f5f5f5";
+    neutral200: "#eeeeee";
+    neutral300: "#e0e0e0";
+    neutral400: "#bdbdbd";
+    neutral500: "#9e9e9e";
+    neutral600: "#757575";
+    neutral700: "#616161";
+    neutral800: "#424242";
+    neutral900: "#212121";
+    neutral1000: string;
+    neutralA100: string;
+    neutralA200: string;
+    neutralA400: string;
+    neutralA700: string;
+    orange50: "#fff3e0";
+    orange100: "#ffe0b2";
+    orange200: "#ffcc80";
+    orange300: "#ffb74d";
+    orange400: "#ffa726";
+    orange500: "#ff9800";
+    orange600: "#fb8c00";
+    orange700: "#f57c00";
+    orange800: "#ef6c00";
+    orange900: "#e65100";
+    orange1000: string;
+    orangeA100: "#ffd180";
+    orangeA200: "#ffab40";
+    orangeA400: "#ff9100";
+    orangeA700: "#ff6d00";
+    purple50: "#f3e5f5";
+    purple100: "#e1bee7";
+    purple200: "#ce93d8";
+    purple300: "#ba68c8";
+    purple400: "#ab47bc";
+    purple500: "#9c27b0";
+    purple600: "#8e24aa";
+    purple700: "#7b1fa2";
+    purple800: "#6a1b9a";
+    purple900: "#4a148c";
+    purple1000: string;
+    purpleA100: "#ea80fc";
+    purpleA200: "#e040fb";
+    purpleA400: "#d500f9";
+    purpleA700: "#aa00ff";
+    yellow50: "#fffde7";
+    yellow100: "#fff9c4";
+    yellow200: "#fff59d";
+    yellow300: "#fff176";
+    yellow400: "#ffee58";
+    yellow500: "#ffeb3b";
+    yellow600: "#fdd835";
+    yellow700: "#fbc02d";
+    yellow800: "#f9a825";
+    yellow900: "#f57f17";
+    yellow1000: string;
+    yellowA100: "#ffff8d";
+    yellowA200: "#ffff00";
+    yellowA400: "#ffea00";
+    yellowA700: "#ffd600";
+    red50: "#ffebee";
+    red100: "#ffcdd2";
+    red200: "#ef9a9a";
+    red300: "#e57373";
+    red400: "#ef5350";
+    red500: "#f44336";
+    red600: "#e53935";
+    red700: "#d32f2f";
+    red800: "#c62828";
+    red900: "#b71c1c";
+    red1000: string;
+    redA100: "#ff8a80";
+    redA200: "#ff5252";
+    redA400: "#ff1744";
+    redA700: "#d50000";
+    cyan50: "#e0f7fa";
+    cyan100: "#b2ebf2";
+    cyan200: "#80deea";
+    cyan300: "#4dd0e1";
+    cyan400: "#26c6da";
+    cyan500: "#00bcd4";
+    cyan600: "#00acc1";
+    cyan700: "#0097a7";
+    cyan800: "#00838f";
+    cyan900: "#006064";
+    cyan1000: string;
+    cyanA100: "#84ffff";
+    cyanA200: "#18ffff";
+    cyanA400: "#00e5ff";
+    cyanA700: "#00b8d4";
+    deepPurple50: "#ede7f6";
+    deepPurple100: "#d1c4e9";
+    deepPurple200: "#b39ddb";
+    deepPurple300: "#9575cd";
+    deepPurple400: "#7e57c2";
+    deepPurple500: "#673ab7";
+    deepPurple600: "#5e35b1";
+    deepPurple700: "#512da8";
+    deepPurple800: "#4527a0";
+    deepPurple900: "#311b92";
+    deepPurple1000: string;
+    deepPurpleA100: "#b388ff";
+    deepPurpleA200: "#7c4dff";
+    deepPurpleA400: "#651fff";
+    deepPurpleA700: "#6200ea";
+    deepPurpleA800: string;
+    primary: {
+        main: "#2962ff";
+        dark: string;
+        light: "#448aff";
+        contrastText: string;
+        hover: string;
+        selected: string;
+        focus: string;
+        focusVisible: string;
+        outlinedBorder: string;
+    };
+    secondary: {
+        main: "#aa00ff";
+        dark: "#7b1fa2";
+        light: "#d500f9";
+        contrastText: string;
+        hover: string;
+        selected: string;
+        focus: string;
+        focusVisible: string;
+        outlinedBorder: "#ce93d8";
+    };
+    error: {
+        main: "#d50000";
+        dark: "#c62828";
+        light: "#ff5252";
+        contrastText: string;
+        hover: string;
+    };
+    warning: {
+        main: "#f57f17";
+        dark: string;
+        light: "#f9a825";
+        contrastText: string;
+    };
+    info: {
+        main: "#0091ea";
+        dark: "#01579b";
+        light: "#00b0ff";
+        contrastText: string;
+    };
+    ai: {
+        main: "#6200ea";
+        dark: string;
+        contrastText: string;
+    };
+    inProgress: {
+        main: "#00c853";
+        dark: string;
+        contrastText: string;
+    };
+    success: {
+        main: string;
+        dark: "#388e3c";
+        light: string;
+        contrastText: string;
+    };
+    action: {
+        active: "#616161";
+        hover: string;
+        selected: string;
+        focus: string;
+        disabledBackground: "#eeeeee";
+        disabled: "#9e9e9e";
+    };
+};
+export default palette;

package/lib/theme.d.ts

@@ -0,0 +1,258 @@
+import { InkSnackbarAlertProps } from './components/InkSnackbar/InkSnackbarAlert';
+import { AlertProps } from '@mui/material/Alert';
+import { OptionsObject } from 'notistack';
+declare module '@mui/material/styles' {
+    interface Palette {
+        ai: Palette['primary'];
+    }
+    interface PaletteOptions {
+        ai?: PaletteOptions['primary'];
+    }
+    interface PaletteColor {
+        hover?: string;
+        selected?: string;
+        focus?: string;
+        focusVisible?: string;
+        outlinedBorder?: string;
+    }
+    interface Palette {
+        focusVisible: string;
+        blue50: string;
+        blue100: string;
+        blue200: string;
+        blue300: string;
+        blue400: string;
+        blue500: string;
+        blue600: string;
+        blue700: string;
+        blue800: string;
+        blue900: string;
+        blueA100: string;
+        blueA200: string;
+        blueA400: string;
+        blueA700: string;
+        blue1000: string;
+        green50: string;
+        green100: string;
+        green200: string;
+        green300: string;
+        green400: string;
+        green500: string;
+        green600: string;
+        green700: string;
+        green800: string;
+        green900: string;
+        green1000: string;
+        greenA100: string;
+        greenA200: string;
+        greenA400: string;
+        greenA700: string;
+        greenA900: string;
+        lightBlue50: string;
+        lightBlue100: string;
+        lightBlue200: string;
+        lightBlue300: string;
+        lightBlue400: string;
+        lightBlue500: string;
+        lightBlue600: string;
+        lightBlue700: string;
+        lightBlue800: string;
+        lightBlue900: string;
+        lightBlue1000: string;
+        lightBlueA100: string;
+        lightBlueA200: string;
+        lightBlueA400: string;
+        lightBlueA700: string;
+        lightGreen50: string;
+        lightGreen100: string;
+        lightGreen200: string;
+        lightGreen300: string;
+        lightGreen400: string;
+        lightGreen500: string;
+        lightGreen600: string;
+        lightGreen700: string;
+        lightGreen800: string;
+        lightGreen900: string;
+        neutral00: string;
+        neutral50: string;
+        neutral100: string;
+        neutral200: string;
+        neutral300: string;
+        neutral400: string;
+        neutral500: string;
+        neutral600: string;
+        neutral700: string;
+        neutral800: string;
+        neutral900: string;
+        neutralA100: string;
+        neutralA200: string;
+        neutralA400: string;
+        neutralA700: string;
+        orange50: string;
+        orange100: string;
+        orange200: string;
+        orange300: string;
+        orange400: string;
+        orange500: string;
+        orange600: string;
+        orange700: string;
+        orange800: string;
+        orange900: string;
+        orange1000: string;
+        orangeA100: string;
+        orangeA200: string;
+        orangeA400: string;
+        orangeA700: string;
+        purple50: string;
+        purple100: string;
+        purple200: string;
+        purple300: string;
+        purple400: string;
+        purple500: string;
+        purple600: string;
+        purple700: string;
+        purple800: string;
+        purple900: string;
+        purple1000: string;
+        purpleA100: string;
+        purpleA200: string;
+        purpleA400: string;
+        purpleA700: string;
+        yellow50: string;
+        yellow100: string;
+        yellow200: string;
+        yellow300: string;
+        yellow400: string;
+        yellow500: string;
+        yellow600: string;
+        yellow700: string;
+        yellow800: string;
+        yellow900: string;
+        yellow1000: string;
+        yellowA100: string;
+        yellowA200: string;
+        yellowA400: string;
+        yellowA700: string;
+        red50: string;
+        red100: string;
+        red200: string;
+        red300: string;
+        red400: string;
+        red500: string;
+        red600: string;
+        red700: string;
+        red800: string;
+        red900: string;
+        red1000: string;
+        redA100: string;
+        redA200: string;
+        redA400: string;
+        redA700: string;
+        cyan50: string;
+        cyan100: string;
+        cyan200: string;
+        cyan300: string;
+        cyan400: string;
+        cyan500: string;
+        cyan600: string;
+        cyan700: string;
+        cyan800: string;
+        cyan900: string;
+        cyan1000: string;
+        cyanA100: string;
+        cyanA200: string;
+        cyanA400: string;
+        cyanA700: string;
+        deepPurple50: string;
+        deepPurple100: string;
+        deepPurple200: string;
+        deepPurple300: string;
+        deepPurple400: string;
+        deepPurple500: string;
+        deepPurple600: string;
+        deepPurple700: string;
+        deepPurple800: string;
+        deepPurple900: string;
+        deepPurple1000: string;
+        deepPurpleA100: string;
+        deepPurpleA200: string;
+        deepPurpleA400: string;
+        deepPurpleA700: string;
+    }
+    interface PalletteOptions {
+        focusVisible: string;
+        neutral50: string;
+        neutral100: string;
+        neutral200: string;
+        neutral300: string;
+        neutral400: string;
+        neutral500: string;
+        neutral600: string;
+        neutral700: string;
+        neutral800: string;
+        neutral900: string;
+        neutralA100: string;
+        neutralA200: string;
+        neutralA400: string;
+        neutralA700: string;
+        blue50: string;
+        blue100: string;
+        blue200: string;
+        blue300: string;
+        blue400: string;
+        blue500: string;
+    }
+}
+declare module '@mui/material/Button' {
+    interface ButtonPropsColorOverrides {
+        ai: true;
+    }
+    interface ButtonPropsVariantOverrides {
+        card: true;
+    }
+}
+declare module '@mui/material/ToggleButton' {
+    interface ToggleButtonPropsSizeOverrides {
+        'x-small': true;
+    }
+}
+declare module '@mui/material/ToggleButtonGroup' {
+    interface ToggleButtonGroupPropsSizeOverrides {
+        'x-small': true;
+    }
+}
+declare module '@mui/material/Icon' {
+    interface IconPropsSizeOverrides {
+        'x-small': true;
+    }
+}
+declare module '@mui/material/Alert' {
+    interface AlertPropsVariantOverrides {
+        snackbar: true;
+        standard: true;
+        filled: false;
+        outlined: false;
+    }
+}
+declare module '@mui/material/Chip' {
+    interface ChipPropsVariantOverrides {
+        contrastFilled: true;
+    }
+    interface ChipPropsColorOverrides {
+        ai: true;
+        inProgress: true;
+    }
+}
+type InkSnackbarOptions = OptionsObject & {
+    alertProps?: AlertProps;
+    title?: InkSnackbarAlertProps['title'];
+    action?: InkSnackbarAlertProps['action'];
+    onClose?: InkSnackbarAlertProps['onClose'];
+};
+declare module 'notistack' {
+    interface EnqueueSnackbar {
+        (message: string, options?: InkSnackbarOptions): void;
+    }
+}
+declare const theme: import("@mui/material").Theme;
+export default theme;

package/lib/utils/PageWrapper.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from 'react';
+type IPageWrapperProps = {
+    title: string;
+    addTitleSuffix?: boolean;
+    description?: string;
+};
+declare const PageWrapper: ({ title, addTitleSuffix, description, children, }: PropsWithChildren<IPageWrapperProps>) => import("react/jsx-runtime").JSX.Element;
+export default PageWrapper;

package/lib/utils/index.d.ts

@@ -0,0 +1 @@
+export { default as PageWrapper } from './PageWrapper';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@movable/ui",
-  "version": "2.9.0",
+  "version": "2.11.0",
   "description": "Movable Ink's shared MUI components and MUI theme for our vite applications",
   "module": "lib/index.mjs",
   "types": "lib/index.d.ts",