npm - @webpros/mui-theme - Versions diffs - 0.1.2 → 0.1.3 - Mend

@@ -0,0 +1,3 @@
+import './Avatar.theme';
+export declare const Avatar: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").AvatarTypeMap<{}, "div">>;
+export type AvatarComponentType = typeof Avatar;

@@ -0,0 +1,4 @@
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+import { Avatar as MuiAvatar } from '@mui/material';
+import './Avatar.theme';
+export const Avatar = MuiAvatar;

@@ -0,0 +1,12 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+declare module '@mui/material/Avatar' { }
+export interface M3Avatar {
+    MuiAvatar: {
+        defaultProps?: ComponentsProps['MuiAvatar'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiAvatar'];
+        variants?: ComponentsVariants['MuiAvatar'];
+    };
+}
+export declare const getAvatar: (theme: Theme) => M3Avatar;
+declare const _default: {};
+export default _default;

@@ -0,0 +1,20 @@
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+export const getAvatar = (theme) => {
+    const { palette } = theme;
+    return {
+        MuiAvatar: {
+            styleOverrides: {
+                root: {
+                    width: 40,
+                    height: 40,
+                    borderRadius: '50%',
+                    color: palette.primary.main,
+                    img: {
+                        borderRadius: '50%',
+                    },
+                },
+            },
+        },
+    };
+};
+export default {};

@@ -0,0 +1,3 @@
+import './Badge.theme';
+export declare const Badge: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").BadgeTypeMap<"span", {}>>;
+export type BadgeComponentType = typeof Badge;

	@@ -0,0 +1,2 @@
1	+ // Copyright 2025 WebPros International GmbH. All rights reserved.
2	+ export * from './Avatar.theme';

@@ -0,0 +1,24 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+declare module '@mui/material/Badge' {
+    interface BadgePropsColorOverrides {
+        tertiary: true;
+        outlined: true;
+    }
+    interface BadgeOwnProps {
+        size?: 'small' | 'medium' | 'large';
+        horizontal?: 'left' | 'center' | 'right';
+        vertical?: 'bottom' | 'center' | 'top';
+        transformVertical?: number;
+        transformHorizontal?: number;
+    }
+}
+interface M3Badge {
+    MuiBadge: {
+        defaultProps?: ComponentsProps['MuiBadge'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiBadge'];
+        variants?: ComponentsVariants['MuiBadge'];
+    };
+}
+export declare const getBadge: (theme: Theme) => M3Badge;
+declare const _default: {};
+export default _default;

@@ -0,0 +1,131 @@
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+import { badgeClasses, } from '@mui/material';
+export const getBadge = (theme) => {
+    const { palette } = theme;
+    return {
+        MuiBadge: {
+            defaultProps: { color: 'default', size: 'small' },
+            variants: [
+                {
+                    props: { color: 'default' },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            backgroundColor: palette.error.main,
+                            color: palette.onError.main,
+                        },
+                    },
+                },
+                {
+                    props: { color: 'outlined' },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            backgroundColor: palette.surfaceContainerLowest.main,
+                            color: palette.onSurfaceVariant.main,
+                            borderColor: palette.outline.main,
+                            borderWidth: 1,
+                            borderStyle: 'solid',
+                        },
+                    },
+                },
+                // BadgeOwnProps['size']
+                {
+                    props: { size: 'small' },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            minWidth: 6,
+                            minHeight: 6,
+                            width: 6,
+                            height: 6,
+                            borderRadius: 6,
+                        },
+                    },
+                },
+                {
+                    props: { size: 'medium' },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            minWidth: 12,
+                            minHeight: 12,
+                            width: 12,
+                            height: 12,
+                            borderRadius: 12,
+                        },
+                    },
+                },
+                {
+                    props: { size: 'large' },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            minWidth: 16,
+                            minHeight: 16,
+                            width: 16,
+                            height: 16,
+                            borderRadius: 16,
+                        },
+                    },
+                },
+                {
+                    props: {
+                        horizontal: 'left',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            left: '0',
+                        },
+                    },
+                },
+                {
+                    props: {
+                        horizontal: 'center',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            left: '50%',
+                        },
+                    },
+                },
+                {
+                    props: {
+                        horizontal: 'right',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            right: '0',
+                        },
+                    },
+                },
+                {
+                    props: {
+                        vertical: 'bottom',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            bottom: '0',
+                        },
+                    },
+                },
+                {
+                    props: {
+                        vertical: 'center',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            top: '50%',
+                        },
+                    },
+                },
+                {
+                    props: {
+                        vertical: 'top',
+                    },
+                    style: {
+                        [`.${badgeClasses.badge}`]: {
+                            top: '0',
+                        },
+                    },
+                },
+            ],
+        },
+    };
+};
+export default {};

	@@ -0,0 +1,2 @@
1	+ // Copyright 2025 WebPros International GmbH. All rights reserved.
2	+ export * from './Badge.theme';

@@ -0,0 +1,3 @@
+import './Chip.theme';
+export declare const Chip: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").ChipTypeMap<{}, "div">>;
+export type ChipComponentType = typeof Chip;

@@ -0,0 +1,19 @@
+import { ComponentsProps, ComponentsOverrides, ComponentsVariants, Theme } from '@mui/material';
+declare module '@mui/material/Chip' {
+    interface ChipPropsVariantOverrides {
+        ghost: true;
+    }
+    interface ChipOwnProps {
+        selected?: boolean;
+    }
+}
+interface M3Chip {
+    MuiChip: {
+        defaultProps?: ComponentsProps['MuiChip'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiChip'];
+        variants?: ComponentsVariants['MuiChip'];
+    };
+}
+export declare const getChip: (theme: Theme) => M3Chip;
+declare const _default: {};
+export default _default;

@webpros/mui-theme 0.1.2 → 0.1.3