@webpros/mui-theme 0.1.2 → 0.1.4

package/dist/src/components/data-display/Table/index.js

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

package/dist/src/components/data-display/Table/mock-data.d.ts

@@ -0,0 +1,17 @@
+type Data = {
+    pid: number;
+    parentPid: number;
+    user: string;
+    program: string;
+    cpu: number;
+    memory: number;
+    bytesRead: number;
+    bytesWrite: number;
+    ioRead: number;
+    ioWrite: number;
+    openFiles: number;
+    cmd: string;
+};
+export type DataId = keyof Data;
+export declare const mockRows: Data[];
+export {};

package/dist/src/components/data-display/Table/mock-data.js

@@ -0,0 +1,198 @@
+export const mockRows = [
+    {
+        pid: 2380700,
+        parentPid: 2380694,
+        user: 'root',
+        program: 'dd',
+        cpu: 88,
+        memory: 824,
+        bytesRead: 0.5,
+        bytesWrite: 91,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/newrelic-infra',
+    },
+    {
+        pid: 24238,
+        parentPid: 1,
+        user: 'agent360',
+        program: 'agent360',
+        cpu: 0.5,
+        memory: 24.4,
+        bytesRead: 0.5,
+        bytesWrite: 0.5,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/python3',
+    },
+    {
+        pid: 1,
+        parentPid: 0,
+        user: 'root',
+        program: 'systemd',
+        cpu: 0.4,
+        memory: 9,
+        bytesRead: 0.3,
+        bytesWrite: 0.3,
+        ioRead: 0.3,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/systemd/systemd',
+    },
+    {
+        pid: 717,
+        parentPid: 1,
+        user: 'root',
+        program: 'fail2ban-server',
+        cpu: 0.4,
+        memory: 22,
+        bytesRead: 0.2,
+        bytesWrite: 0.2,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/mariadb',
+    },
+    {
+        pid: 887,
+        parentPid: 1,
+        user: 'mysql',
+        program: 'mariadb',
+        cpu: 0.1,
+        memory: 51.3,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+    {
+        pid: 1471590,
+        parentPid: 429674,
+        user: 'psaadm',
+        program: 'plesk-task-manager',
+        cpu: 0.1,
+        memory: 17.4,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+    {
+        pid: 2300508,
+        parentPid: 2380700,
+        user: 'postfix',
+        program: 'smtpd',
+        cpu: 0.1,
+        memory: 15.1,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+    {
+        pid: 23807,
+        parentPid: 238094,
+        user: 'root',
+        program: 'dd',
+        cpu: 28,
+        memory: 600,
+        bytesRead: 0.5,
+        bytesWrite: 91,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/newrelic-infra',
+    },
+    {
+        pid: 2438,
+        parentPid: 122,
+        user: 'agent360',
+        program: 'agent360',
+        cpu: 0.5,
+        memory: 124.4,
+        bytesRead: 0.5,
+        bytesWrite: 0.5,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/python3',
+    },
+    {
+        pid: 111,
+        parentPid: 20,
+        user: 'root',
+        program: 'systemd',
+        cpu: 0.4,
+        memory: 90,
+        bytesRead: 0.3,
+        bytesWrite: 0.3,
+        ioRead: 0.3,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/bin/systemd/systemd',
+    },
+    {
+        pid: 7127,
+        parentPid: 11,
+        user: 'root',
+        program: 'fail2ban-server',
+        cpu: 0.42,
+        memory: 221,
+        bytesRead: 0.2,
+        bytesWrite: 0.2,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/mariadb',
+    },
+    {
+        pid: 8187,
+        parentPid: 198,
+        user: 'mysql',
+        program: 'mariadb',
+        cpu: 0.14,
+        memory: 521.3,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+    {
+        pid: 14590,
+        parentPid: 4674,
+        user: 'psaadm',
+        program: 'plesk-task-manager',
+        cpu: 0.1,
+        memory: 117.4,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+    {
+        pid: 23008,
+        parentPid: 700,
+        user: 'postfix',
+        program: 'smtpd',
+        cpu: 10.1,
+        memory: 151.1,
+        bytesRead: 0,
+        bytesWrite: 0,
+        ioRead: 0,
+        ioWrite: 37,
+        openFiles: 0,
+        cmd: '/usr/libexec/plesk-task-manager',
+    },
+];

package/dist/src/components/data-display/Tooltip/Tooltip.d.ts

@@ -0,0 +1,4 @@
+import { Tooltip as MuiTooltip } from '@mui/material';
+import './Tooltip.theme';
+export declare const Tooltip: typeof MuiTooltip;
+export type TooltipComponentType = typeof Tooltip;

package/dist/src/components/data-display/Tooltip/Tooltip.js

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

package/dist/src/components/data-display/Tooltip/Tooltip.theme.d.ts

@@ -0,0 +1,11 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+interface M3Tooltip {
+    MuiTooltip: {
+        defaultProps?: ComponentsProps['MuiTooltip'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiTooltip'];
+        variants?: ComponentsVariants['MuiTooltip'];
+    };
+}
+export declare const getTooltip: (theme: Theme) => M3Tooltip;
+declare const _default: {};
+export default _default;

package/dist/src/components/data-display/Tooltip/Tooltip.theme.js

@@ -0,0 +1,21 @@
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+import { tooltipClasses, } from '@mui/material';
+export const getTooltip = (theme) => {
+    const { palette } = theme;
+    return {
+        MuiTooltip: {
+            styleOverrides: {
+                tooltip: {
+                    background: palette.inverseSurface.main,
+                    color: palette.inverseOnSurface.main,
+                },
+                popper: {
+                    [`&.${tooltipClasses.popper}[data-popper-placement*="top"] .${tooltipClasses.tooltip}`]: {
+                        marginBottom: 2,
+                    },
+                },
+            },
+        },
+    };
+};
+export default {};

package/dist/src/components/data-display/Tooltip/index.d.ts

@@ -0,0 +1 @@
+export * from './Tooltip.theme';

package/dist/src/components/data-display/Tooltip/index.js

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

package/dist/src/components/data-display/Typography/Typography.d.ts

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

package/dist/src/components/data-display/Typography/Typography.js

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

package/dist/src/components/data-display/Typography/Typography.theme.d.ts

@@ -0,0 +1,36 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+interface M3Typography {
+    MuiTypography: {
+        defaultProps?: ComponentsProps['MuiTypography'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiTypography'];
+        variants?: ComponentsVariants['MuiTypography'];
+    };
+}
+declare module '@mui/material/Typography' {
+    interface TypographyPropsVariantOverrides {
+        DisplayLarge: true;
+        DisplayMedium: true;
+        DisplaySmall: true;
+        HeadlineLarge: true;
+        HeadlineMedium: true;
+        HeadlineSmall: true;
+        TitleLarge: true;
+        TitleMedium: true;
+        TitleSmall: true;
+        LabelLarge: true;
+        LabelMedium: true;
+        LabelSmall: true;
+        BodyLarge: true;
+        BodyMedium: true;
+        BodySmall: true;
+        Caption: true;
+    }
+    interface TypographyPropsColorOverrides {
+        additional: true;
+        supportive: true;
+        undefined: true;
+    }
+}
+export declare const getTypography: (theme: Theme) => M3Typography;
+declare const _default: {};
+export default _default;

package/dist/src/components/data-display/Typography/Typography.theme.js

@@ -0,0 +1,169 @@
+export const getTypography = (theme) => {
+    const { palette } = theme;
+    return {
+        MuiTypography: {
+            styleOverrides: {
+                root: {
+                    fontWeight: 400,
+                },
+            },
+            variants: [
+                {
+                    props: { color: 'supportive' },
+                    style: {
+                        color: palette.supportive.main,
+                    },
+                },
+                {
+                    props: { color: 'undefined' },
+                    style: {
+                        color: palette.undefined.main,
+                    },
+                },
+                {
+                    props: { color: 'additional' },
+                    style: {
+                        color: '#78909C',
+                    },
+                },
+                {
+                    props: { color: 'error' },
+                    style: {
+                        color: palette.error.main,
+                    },
+                },
+                {
+                    props: { variant: 'DisplayLarge' },
+                    style: {
+                        fontSize: '3.563rem',
+                        lineHeight: '4rem',
+                    },
+                },
+                {
+                    props: { variant: 'DisplayMedium' },
+                    style: {
+                        fontSize: '2.8125rem',
+                        lineHeight: '3.25rem',
+                    },
+                },
+                {
+                    props: { variant: 'DisplaySmall' },
+                    style: {
+                        fontSize: '2.25rem',
+                        lineHeight: '2.75rem',
+                    },
+                },
+                {
+                    props: { variant: 'HeadlineLarge' },
+                    style: {
+                        fontSize: '2rem',
+                        lineHeight: '2.5rem',
+                    },
+                },
+                {
+                    props: { variant: 'HeadlineMedium' },
+                    style: {
+                        fontSize: '1.75rem',
+                        lineHeight: '2.25rem',
+                    },
+                },
+                {
+                    props: { variant: 'HeadlineSmall' },
+                    style: {
+                        fontSize: '1.5rem',
+                        lineHeight: '2rem',
+                    },
+                },
+                {
+                    props: { variant: 'TitleLarge' },
+                    style: {
+                        fontSize: '1.375rem',
+                        lineHeight: '1.75rem',
+                    },
+                },
+                {
+                    props: { variant: 'TitleMedium' },
+                    style: {
+                        fontSize: '1rem',
+                        fontWeight: 500,
+                        lineHeight: '1.5rem',
+                        letterSpacing: '0.009rem',
+                    },
+                },
+                {
+                    props: { variant: 'TitleSmall' },
+                    style: {
+                        fontSize: '0.875rem',
+                        fontWeight: 500,
+                        lineHeight: '1.25rem',
+                        letterSpacing: '0.006rem',
+                    },
+                },
+                {
+                    props: { variant: 'LabelLarge' },
+                    style: {
+                        fontSize: '0.875rem',
+                        fontWeight: 500,
+                        lineHeight: '1.25rem',
+                        letterSpacing: '0.006rem',
+                    },
+                },
+                {
+                    props: { variant: 'LabelMedium' },
+                    style: {
+                        fontSize: '0.75rem',
+                        fontWeight: 500,
+                        lineHeight: '1rem',
+                        letterSpacing: '0.031rem',
+                    },
+                },
+                {
+                    props: { variant: 'LabelSmall' },
+                    style: {
+                        fontSize: '0.688rem',
+                        fontWeight: 500,
+                        lineHeight: '1rem',
+                        letterSpacing: '0.031rem',
+                    },
+                },
+                {
+                    props: { variant: 'BodyLarge' },
+                    style: {
+                        fontSize: '1rem',
+                        fontWeight: 400,
+                        lineHeight: '1.5rem',
+                        letterSpacing: '0.031rem',
+                    },
+                },
+                {
+                    props: { variant: 'BodyMedium' },
+                    style: {
+                        fontSize: '0.875rem',
+                        fontWeight: 400,
+                        lineHeight: '1.25rem',
+                        letterSpacing: '0.016rem',
+                    },
+                },
+                {
+                    props: { variant: 'BodySmall' },
+                    style: {
+                        fontSize: '0.75rem',
+                        fontWeight: 400,
+                        lineHeight: '1rem',
+                        letterSpacing: '0.025rem',
+                    },
+                },
+                {
+                    props: { variant: 'Caption' },
+                    style: {
+                        fontSize: '0.75rem',
+                        lineHeight: '1rem',
+                        fontWeight: 400,
+                        letterSpacing: '0.025rem',
+                    },
+                },
+            ],
+        },
+    };
+};
+export default {};

package/dist/src/components/data-display/Typography/index.d.ts

@@ -0,0 +1 @@
+export * from './Typography.theme';

package/dist/src/components/data-display/Typography/index.js

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

package/dist/src/components/feedback/Alert/Alert.d.ts

@@ -0,0 +1,4 @@
+import { Alert as MuiAlert } from '@mui/material';
+import './Alert.theme';
+export declare const Alert: typeof MuiAlert;
+export type AlertComponentType = typeof Alert;

package/dist/src/components/feedback/Alert/Alert.js

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

package/dist/src/components/feedback/Alert/Alert.theme.d.ts

@@ -0,0 +1,11 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+interface M3Alert {
+    MuiAlert: {
+        defaultProps?: ComponentsProps['MuiAlert'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiAlert'];
+        variants?: ComponentsVariants['MuiAlert'];
+    };
+}
+export declare const getAlert: (theme: Theme) => M3Alert;
+declare const _default: {};
+export default _default;

package/dist/src/components/feedback/Alert/Alert.theme.js

@@ -0,0 +1,60 @@
+export const getAlert = (theme) => {
+    const { palette } = theme;
+    return {
+        MuiAlert: {
+            defaultProps: {
+                variant: 'standard',
+            },
+            styleOverrides: {
+                root: {
+                    borderRadius: '20px',
+                },
+                standardError: {
+                    background: palette.errorContainer.main,
+                    color: palette.onErrorContainer.main,
+                },
+                standardInfo: {
+                    background: palette.infoContainer.main,
+                    color: palette.infoContainer.contrastText,
+                },
+                standardWarning: {
+                    background: palette.warningContainer.main,
+                    color: palette.onWarningContainer.main,
+                },
+                standardSuccess: {
+                    background: palette.successContainer.main,
+                    color: palette.onSuccessContainer.main,
+                },
+                filledError: {
+                    background: palette.error.main,
+                    color: palette.onError.main,
+                },
+                filledInfo: {
+                    background: palette.info.main,
+                    color: palette.onInfo.main,
+                },
+                filledWarning: {
+                    background: palette.warning.main,
+                    color: palette.onWarning.main,
+                },
+                filledSuccess: {
+                    background: palette.success.main,
+                    color: palette.onSuccess.main,
+                },
+                outlinedError: {
+                    color: palette.error.main,
+                },
+                outlinedInfo: {
+                    color: palette.info.main,
+                },
+                outlinedWarning: {
+                    color: palette.warning.main,
+                },
+                outlinedSuccess: {
+                    color: palette.success.main,
+                },
+            },
+        },
+    };
+};
+export default {};

package/dist/src/components/feedback/Alert/index.d.ts

@@ -0,0 +1 @@
+export * from './Alert.theme';

package/dist/src/components/feedback/Alert/index.js

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

package/dist/src/components/feedback/CircularProgress/CircularProgress.d.ts

@@ -0,0 +1,4 @@
+import { CircularProgress as MuiCircularProgress } from '@mui/material';
+import './CircularProgress.theme';
+export declare const CircularProgress: typeof MuiCircularProgress;
+export type CircularProgressComponentType = typeof CircularProgress;

package/dist/src/components/feedback/CircularProgress/CircularProgress.js

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

package/dist/src/components/feedback/CircularProgress/CircularProgress.theme.d.ts

@@ -0,0 +1,10 @@
+import { Theme, ComponentsProps, ComponentsOverrides, ComponentsVariants } from '@mui/material';
+interface M3CircularProgress {
+    MuiCircularProgress: {
+        defaultProps?: ComponentsProps['MuiCircularProgress'];
+        styleOverrides?: ComponentsOverrides<Theme>['MuiCircularProgress'];
+        variants?: ComponentsVariants['MuiCircularProgress'];
+    };
+}
+export declare const getCircularProgress: (_theme: Theme) => M3CircularProgress;
+export {};

package/dist/src/components/feedback/CircularProgress/CircularProgress.theme.js

@@ -0,0 +1,11 @@
+export const getCircularProgress = (_theme) => ({
+    MuiCircularProgress: {
+        styleOverrides: {
+            root: {
+                '& .MuiCircularProgress-circle': {
+                    strokeLinecap: 'round',
+                },
+            },
+        },
+    },
+});

package/dist/src/components/feedback/CircularProgress/index.d.ts

@@ -0,0 +1 @@
+export * from './CircularProgress.theme';

package/dist/src/components/feedback/CircularProgress/index.js

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

package/dist/src/components/feedback/Dialog/Dialog.d.ts

@@ -0,0 +1,4 @@
+import { Dialog as MuiDialog } from '@mui/material';
+import './Dialog.theme';
+export declare const Dialog: typeof MuiDialog;
+export type DialogComponentType = typeof Dialog;

package/dist/src/components/feedback/Dialog/Dialog.js

@@ -0,0 +1,5 @@
+// Copyright 2025 WebPros International GmbH. All rights reserved.
+// eslint-disable-next-line no-restricted-imports
+import { Dialog as MuiDialog } from '@mui/material';
+import './Dialog.theme';
+export const Dialog = MuiDialog;