@mxenabled/mxui 1.6.0-alpha.5 → 2.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/dist/components/icon/Icon.d.ts +1 -9
  2. package/dist/components/icon/icons/index.d.ts +0 -13
  3. package/dist/components/icon/index.d.ts +1 -1
  4. package/dist/components/selectionbox/SelectionBox.d.ts +3 -1
  5. package/dist/index.d.ts +0 -1
  6. package/dist/index.es.js +564 -917
  7. package/dist/index.es.js.map +1 -1
  8. package/dist/themes/Augmentations.d.ts +2 -43
  9. package/dist/themes/Palette.d.ts +0 -21
  10. package/dist/themes/Typography.d.ts +55 -31
  11. package/package.json +36 -42
  12. package/dist/components/icon/icons/AccountsFilledIcon.d.ts +0 -3
  13. package/dist/components/icon/icons/AccountsIcon.d.ts +0 -3
  14. package/dist/components/icon/icons/ArrowLeftIcon.d.ts +0 -3
  15. package/dist/components/icon/icons/AttentionFilledIcon.d.ts +0 -3
  16. package/dist/components/icon/icons/CalendarIcon.d.ts +0 -3
  17. package/dist/components/icon/icons/CheckmarkFilledIcon.d.ts +0 -3
  18. package/dist/components/icon/icons/ChevronDownIcon.d.ts +0 -3
  19. package/dist/components/icon/icons/ChevronLeftIcon.d.ts +0 -3
  20. package/dist/components/icon/icons/ChevronRightIcon.d.ts +0 -3
  21. package/dist/components/icon/icons/CloseIcon.d.ts +0 -3
  22. package/dist/components/icon/icons/EditIcon.d.ts +0 -3
  23. package/dist/components/icon/icons/FilterIcon.d.ts +0 -3
  24. package/dist/components/icon/icons/HeartIcon.d.ts +0 -3
  25. package/dist/components/tokenprovider/Constants.d.ts +0 -9
  26. package/dist/components/tokenprovider/Hooks.d.ts +0 -1
  27. package/dist/components/tokenprovider/TokenProvider.d.ts +0 -11
  28. package/dist/components/tokenprovider/index.d.ts +0 -3
package/dist/themes/Augmentations.d.ts CHANGED
@@ -1,19 +1,10 @@
1
1
  import { CSSProperties } from 'react';
2
2
  declare module '@mui/material/styles' {
3
- type Border = {
4
- light: string;
5
- lighter: string;
6
- main: string;
7
- dark: string;
8
- darker: string;
9
- };
10
3
  interface TypeBackground {
11
4
  highlight?: string;
12
5
  highlightPrimary?: string;
13
6
  }
14
7
  interface PaletteColor {
15
- lighter?: string;
16
- darker?: string;
17
8
  50?: string;
18
9
  100?: string;
19
10
  200?: string;
@@ -26,8 +17,6 @@ declare module '@mui/material/styles' {
26
17
  900?: string;
27
18
  }
28
19
  interface SimplePaletteColorOptions {
29
- lighter?: string;
30
- darker?: string;
31
20
  50?: string;
32
21
  100?: string;
33
22
  200?: string;
@@ -40,30 +29,12 @@ declare module '@mui/material/styles' {
40
29
  900?: string;
41
30
  }
42
31
  interface TypographyVariantsOptions {
43
- Body?: CSSProperties;
44
- Button?: CSSProperties;
45
- H1?: CSSProperties;
46
- H2?: CSSProperties;
47
- H3?: CSSProperties;
48
- Paragraph?: CSSProperties;
49
- ParagraphSmall?: CSSProperties;
50
- Small?: CSSProperties;
51
- Tiny?: CSSProperties;
32
+ paragraph?: CSSProperties;
33
+ paragraphSmall?: CSSProperties;
52
34
  tiny?: CSSProperties;
53
- XSmall?: CSSProperties;
54
35
  }
55
36
  interface TypographyVariants {
56
- Body: CSSProperties;
57
- Button: CSSProperties;
58
- H1: CSSProperties;
59
- H2: CSSProperties;
60
- H3: CSSProperties;
61
- Paragraph: CSSProperties;
62
- ParagraphSmall: CSSProperties;
63
- Small: CSSProperties;
64
- Tiny: CSSProperties;
65
37
  tiny?: CSSProperties;
66
- XSmall: CSSProperties;
67
38
  }
68
39
  interface TypeCategory {
69
40
  autoTransport?: string;
@@ -107,14 +78,12 @@ declare module '@mui/material/styles' {
107
78
  chartMono6?: string;
108
79
  }
109
80
  interface Palette {
110
- border: Border;
111
81
  categories: TypeCategory;
112
82
  chart: TypeChart;
113
83
  chartMono: TypeChartMono;
114
84
  neutral: PaletteColor;
115
85
  }
116
86
  interface PaletteOptions {
117
- border: Partial<Border>;
118
87
  categories: Partial<TypeCategory>;
119
88
  chart: Partial<TypeChart>;
120
89
  chartMono: Partial<TypeChartMono>;
@@ -123,17 +92,7 @@ declare module '@mui/material/styles' {
123
92
  }
124
93
  declare module '@mui/material/Typography' {
125
94
  interface TypographyPropsVariantOverrides {
126
- Body: true;
127
- Button: true;
128
- H1: true;
129
- H2: true;
130
- H3: true;
131
- Paragraph: true;
132
- ParagraphSmall: true;
133
- Small: true;
134
- Tiny: true;
135
95
  tiny: true;
136
- XSmall: true;
137
96
  }
138
97
  }
139
98
  declare module '@mui/material/Button' {
package/dist/themes/Palette.d.ts CHANGED
@@ -2,23 +2,14 @@ import { PaletteMode } from '@mui/material';
2
2
  import { ClientCustomizations } from '../types/ClientCustomizations';
3
3
  export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: ClientCustomizations["paletteOptions"]) => {
4
4
  mode: PaletteMode;
5
- border: {
6
- lighter: string;
7
- light: string;
8
- main: string;
9
- dark: string;
10
- darker: string;
11
- };
12
5
  common: {
13
6
  white: string;
14
7
  black: string;
15
8
  };
16
9
  primary: {
17
- lighter: string;
18
10
  light: string;
19
11
  main: string;
20
12
  dark: string;
21
- darker: string;
22
13
  50: string;
23
14
  100: string;
24
15
  200: string;
@@ -31,11 +22,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
31
22
  900: string;
32
23
  };
33
24
  secondary: {
34
- lighter: string;
35
25
  light: string;
36
26
  main: string;
37
27
  dark: string;
38
- darker: string;
39
28
  50: string;
40
29
  100: string;
41
30
  200: string;
@@ -48,11 +37,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
48
37
  900: string;
49
38
  };
50
39
  neutral: {
51
- lighter: string;
52
40
  light: string;
53
41
  main: string;
54
42
  dark: string;
55
- darker: string;
56
43
  contrastText: string;
57
44
  50: string;
58
45
  100: string;
@@ -71,11 +58,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
71
58
  disabled: string;
72
59
  };
73
60
  error: {
74
- lighter: string;
75
61
  light: string;
76
62
  main: string;
77
63
  dark: string;
78
- darker: string;
79
64
  50: string;
80
65
  100: string;
81
66
  200: string;
@@ -88,11 +73,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
88
73
  900: string;
89
74
  };
90
75
  warning: {
91
- lighter: string;
92
76
  light: string;
93
77
  main: string;
94
78
  dark: string;
95
- darker: string;
96
79
  50: string;
97
80
  100: string;
98
81
  200: string;
@@ -105,11 +88,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
105
88
  900: string;
106
89
  };
107
90
  info: {
108
- lighter: string;
109
91
  light: string;
110
92
  main: string;
111
93
  dark: string;
112
- darker: string;
113
94
  50: string;
114
95
  100: string;
115
96
  200: string;
@@ -122,11 +103,9 @@ export declare const getPalette: (mode: PaletteMode, paletteCustomizations?: Cli
122
103
  900: string;
123
104
  };
124
105
  success: {
125
- lighter: string;
126
106
  light: string;
127
107
  main: string;
128
108
  dark: string;
129
- darker: string;
130
109
  50: string;
131
110
  100: string;
132
111
  200: string;
package/dist/themes/Typography.d.ts CHANGED
@@ -1,36 +1,60 @@
1
- import { TypographyOptions } from '@mui/material/styles/createTypography';
1
+ export type TypographyOptions = {
2
+ fontFamily?: string;
3
+ };
2
4
  export declare const INTER = "Inter, Helvetica, Arial, sans-serif";
3
5
  export declare const getTypography: (typographyOptions?: TypographyOptions) => {
4
- Body: import('react').CSSProperties;
5
- Button: import('react').CSSProperties;
6
- H1: import('react').CSSProperties;
7
- H2: import('react').CSSProperties;
8
- H3: import('react').CSSProperties;
9
- Paragraph: import('react').CSSProperties;
10
- ParagraphSmall: import('react').CSSProperties;
11
- Small: import('react').CSSProperties;
12
- Tiny: import('react').CSSProperties;
13
- tiny: import('react').CSSProperties;
14
- XSmall: import('react').CSSProperties;
15
- button: import('@mui/material/styles/createTypography').TypographyStyleOptions;
16
- caption: import('@mui/material/styles/createTypography').TypographyStyleOptions;
17
- h1: import('@mui/material/styles/createTypography').TypographyStyleOptions;
18
- h2: import('@mui/material/styles/createTypography').TypographyStyleOptions;
19
- h3: import('@mui/material/styles/createTypography').TypographyStyleOptions;
20
- h4?: import('@mui/material/styles/createTypography').TypographyStyleOptions | undefined;
21
- h5?: import('@mui/material/styles/createTypography').TypographyStyleOptions | undefined;
22
- h6?: import('@mui/material/styles/createTypography').TypographyStyleOptions | undefined;
23
- overline?: import('@mui/material/styles/createTypography').TypographyStyleOptions | undefined;
24
- body2: import('@mui/material/styles/createTypography').TypographyStyleOptions;
25
- body1: import('@mui/material/styles/createTypography').TypographyStyleOptions;
26
- subtitle1: import('@mui/material/styles/createTypography').TypographyStyleOptions;
27
- subtitle2: import('@mui/material/styles/createTypography').TypographyStyleOptions;
28
- allVariants?: React.CSSProperties;
29
6
  fontFamily: string;
30
7
  fontSize: number;
31
- fontWeightLight?: React.CSSProperties["fontWeight"];
32
- fontWeightRegular?: React.CSSProperties["fontWeight"];
33
- fontWeightMedium?: React.CSSProperties["fontWeight"];
34
- fontWeightBold?: React.CSSProperties["fontWeight"];
35
- htmlFontSize?: number | undefined;
8
+ body1: {
9
+ fontFamily: string;
10
+ fontSize: number;
11
+ lineHeight: string;
12
+ };
13
+ body2: {
14
+ fontFamily: string;
15
+ fontSize: number;
16
+ lineHeight: string;
17
+ };
18
+ button: {
19
+ fontFamily: string;
20
+ fontSize: number;
21
+ };
22
+ caption: {
23
+ fontFamily: string;
24
+ fontSize: number;
25
+ lineHeight: string;
26
+ };
27
+ h1: {
28
+ fontFamily: string;
29
+ fontWeight: number;
30
+ fontSize: number;
31
+ lineHeight: string;
32
+ };
33
+ h2: {
34
+ fontFamily: string;
35
+ fontWeight: number;
36
+ fontSize: number;
37
+ lineHeight: string;
38
+ };
39
+ h3: {
40
+ fontFamily: string;
41
+ fontWeight: number;
42
+ fontSize: number;
43
+ lineHeight: string;
44
+ };
45
+ subtitle1: {
46
+ fontFamily: string;
47
+ fontSize: number;
48
+ lineHeight: string;
49
+ };
50
+ subtitle2: {
51
+ fontFamily: string;
52
+ fontSize: number;
53
+ lineHeight: string;
54
+ };
55
+ tiny: {
56
+ fontFamily: string;
57
+ fontSize: number;
58
+ lineHeight: string;
59
+ };
36
60
  };
package/package.json CHANGED
@@ -1,9 +1,10 @@
1
1
  {
2
2
  "name": "@mxenabled/mxui",
3
- "version": "1.6.0-alpha.5",
3
+ "version": "2.0.0-alpha.1",
4
4
  "description": "Package containing MX theme and common controls for MUI",
5
5
  "main": "dist/index.es.js",
6
6
  "types": "dist/index.d.ts",
7
+ "type": "module",
7
8
  "author": "MX",
8
9
  "license": "MIT",
9
10
  "publishConfig": {
@@ -20,59 +21,52 @@
20
21
  },
21
22
  "dependencies": {
22
23
  "@emotion/react": "^11.14.0",
23
- "@emotion/styled": "^11.14.0",
24
- "@mui/material": "^5.16.14",
25
- "@mui/system": "^5.16.14",
26
- "@mui/x-data-grid-pro": "^7.27.3",
27
- "@mui/x-date-pickers": "^7.27.3",
28
- "@mui/x-date-pickers-pro": "^7.27.3",
24
+ "@emotion/styled": "^11.14.1",
25
+ "@mui/material": "^7.3.2",
26
+ "@mui/system": "^7.3.2",
27
+ "@mui/x-data-grid-pro": "^7.29.1",
28
+ "@mui/x-date-pickers": "^7.29.1",
29
+ "@mui/x-date-pickers-pro": "^7.29.1",
29
30
  "@mui/x-license-pro": "^6.10.2",
30
- "@mxenabled/design-tokens": "^1.0.3",
31
- "@mxenabled/mx-icons": "^1.5.1",
31
+ "@mxenabled/mx-icons": "^2.0.0",
32
32
  "date-fns": "^4.1.0",
33
- "react": "^18.3.1",
34
- "react-dom": "^18.3.1"
33
+ "react": "^19.1.1",
34
+ "react-dom": "^19.1.1"
35
35
  },
36
36
  "devDependencies": {
37
- "@babel/core": "^7.24.7",
38
- "@babel/eslint-parser": "^7.24.7",
39
- "@eslint/compat": "^1.1.0",
40
- "@eslint/eslintrc": "^3.1.0",
41
- "@eslint/js": "^9.6.0",
42
- "@storybook/addon-a11y": "^8.6.3",
43
- "@storybook/addon-essentials": "^8.6.3",
44
- "@storybook/addon-interactions": "^8.6.3",
45
- "@storybook/addon-links": "^8.6.3",
46
- "@storybook/addon-mdx-gfm": "^8.6.3",
47
- "@storybook/blocks": "^8.6.3",
48
- "@storybook/react": "^8.6.3",
49
- "@storybook/react-vite": "^8.6.3",
50
- "@storybook/test": "^8.6.3",
51
- "@types/react": "^18.3.18",
52
- "@types/react-dom": "^18.3.5",
37
+ "@babel/core": "^7.26.10",
38
+ "@babel/eslint-parser": "^7.27.0",
39
+ "@eslint/compat": "^1.2.8",
40
+ "@eslint/eslintrc": "^3.3.1",
41
+ "@eslint/js": "^9.25.1",
42
+ "@storybook/addon-a11y": "^9.1.4",
43
+ "@storybook/addon-docs": "^9.1.4",
44
+ "@storybook/addon-links": "^9.1.4",
45
+ "@storybook/react-vite": "^9.1.4",
46
+ "@types/react": "^19.1.12",
47
+ "@types/react-dom": "^19.1.9",
53
48
  "@typescript-eslint/eslint-plugin": "^7.18.0",
54
49
  "@typescript-eslint/parser": "^7.18.0",
55
- "@vitejs/plugin-react": "^4.3.4",
56
- "@yarnpkg/sdks": "^3.2.1",
50
+ "@vitejs/plugin-react": "^4.7.0",
51
+ "@vueless/storybook-dark-mode": "^9.0.8",
52
+ "@yarnpkg/sdks": "^3.2.3",
57
53
  "eslint": "^8.57.1",
58
54
  "eslint-config-mx": "^4.0.0",
59
55
  "eslint-config-prettier": "^9.1.0",
60
- "eslint-plugin-jsx-a11y": "^6.9.0",
61
- "eslint-plugin-react": "^7.34.3",
56
+ "eslint-plugin-jsx-a11y": "^6.10.2",
57
+ "eslint-plugin-react": "^7.37.5",
62
58
  "eslint-plugin-react-hooks": "^4.6.2",
63
- "eslint-plugin-react-refresh": "^0.4.7",
64
- "eslint-plugin-storybook": "^0.8.0",
65
- "globals": "^15.8.0",
59
+ "eslint-plugin-react-refresh": "^0.4.20",
60
+ "eslint-plugin-storybook": "^9.1.4",
66
61
  "husky": "^9.1.7",
67
- "lint-staged": "^15.4.3",
62
+ "lint-staged": "^16.1.6",
68
63
  "path": "^0.12.7",
69
- "prettier": "^3.5.3",
64
+ "prettier": "^3.6.2",
70
65
  "rollup-plugin-visualizer": "^5.14.0",
71
- "storybook": "^8.6.3",
72
- "storybook-dark-mode": "4.0.1",
73
- "typescript": "^5.6.2",
74
- "vite": "^5.4.14",
75
- "vite-plugin-dts": "^4.5.3"
66
+ "storybook": "^9.1.4",
67
+ "typescript": "^5.9.2",
68
+ "vite": "^6.3.5",
69
+ "vite-plugin-dts": "^4.5.4"
76
70
  },
77
71
  "peerDependencies": {
78
72
  "@mui/material": "^5",
@@ -87,5 +81,5 @@
87
81
  "files": [
88
82
  "dist"
89
83
  ],
90
- "packageManager": "yarn@4.9.2"
84
+ "packageManager": "yarn@4.9.4"
91
85
  }
package/dist/components/icon/icons/AccountsFilledIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const AccountsFilledIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/AccountsIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const AccountsIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/ArrowLeftIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const ArrowLeftIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/AttentionFilledIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const AttentionFilledIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/CalendarIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const CalendarIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/CheckmarkFilledIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const CheckmarkFilledIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/ChevronDownIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const ChevronDownIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/ChevronLeftIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const ChevronLeftIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/ChevronRightIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const ChevronRightIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/CloseIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const CloseIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/EditIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const EditIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/FilterIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const FilterIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/icon/icons/HeartIcon.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { default as React } from 'react';
2
- import { IconProps } from '../BaseIcon';
3
- export declare const HeartIcon: React.FC<React.PropsWithChildren<IconProps>>;
package/dist/components/tokenprovider/Constants.d.ts DELETED
@@ -1,9 +0,0 @@
1
- export declare const TARGETS: {
2
- REACT: string;
3
- REACT_NATIVE: string;
4
- NATIVE: string;
5
- };
6
- export declare const THEMES: {
7
- LIGHT: string;
8
- DARK: string;
9
- };
package/dist/components/tokenprovider/Hooks.d.ts DELETED
@@ -1 +0,0 @@
1
- export declare const useTokens: (target?: string, tokenOverrides?: {}) => import('@mxenabled/design-tokens').TokenTypes;
package/dist/components/tokenprovider/TokenProvider.d.ts DELETED
@@ -1,11 +0,0 @@
1
- import { default as React } from 'react';
2
- export declare const TokenContext: React.Context<import('@mxenabled/design-tokens').TokenTypes>;
3
- export declare const ReactNativeTokenContext: React.Context<import('@mxenabled/design-tokens').TokenTypes>;
4
- interface TokenProviderProps {
5
- children: React.ReactNode;
6
- target?: string;
7
- theme?: string;
8
- tokenOverrides?: any;
9
- }
10
- export declare const TokenProvider: React.FC<TokenProviderProps>;
11
- export {};
package/dist/components/tokenprovider/index.d.ts DELETED
@@ -1,3 +0,0 @@
1
- export { TokenProvider } from './TokenProvider';
2
- export { useTokens } from './Hooks';
3
- export { TARGETS, THEMES } from './Constants';