mui-image-alter 3.0.0 → 3.1.0
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.
- package/README.md +6 -4
- package/dist/index.d.cts +3 -5
- package/dist/index.d.ts +3 -5
- package/package.json +28 -29
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
</p>
|
|
7
7
|
<div align="center">
|
|
8
8
|
|
|
9
|
-
     [](https://www.buymeacoffee.com/mddanish00)
|
|
9
|
+
 [](https://www.npmjs.com/package/mui-image-alter)    [](https://www.buymeacoffee.com/mddanish00)
|
|
10
10
|
|
|
11
11
|
</div>
|
|
12
12
|
<p align="center">
|
|
@@ -79,12 +79,14 @@ To put it simply, you only needed this if:
|
|
|
79
79
|
|
|
80
80
|
Install the `mui-image-alter` peer dependencies first. (Can skip if you already done it.)
|
|
81
81
|
|
|
82
|
-
If you haven't yet install MUI, please follow the [official guide](https://mui.com/material-ui/getting-started/installation/).
|
|
82
|
+
If you haven't yet install MUI, please follow the [official guide](https://mui.com/material-ui/getting-started/installation/). Only MUI v5 or v6 are supported.
|
|
83
83
|
|
|
84
84
|
Now, you can install the `mui-image-alter`.
|
|
85
85
|
|
|
86
86
|
#### Install from npm
|
|
87
87
|
|
|
88
|
+
[View library details on npm](https://www.npmjs.com/package/mui-image-alter)
|
|
89
|
+
|
|
88
90
|
```bash
|
|
89
91
|
npm install mui-image-alter
|
|
90
92
|
```
|
|
@@ -119,7 +121,7 @@ import { Image } from 'mui-image-alter';
|
|
|
119
121
|
|
|
120
122
|
### 3. Profit 💰
|
|
121
123
|
|
|
122
|
-
_Note: Profits not guaranteed and Material UI v5 is a peer dependency. If you need to support legacy versions of Material UI, use [`material-ui-image`](https://github.com/TeamWertarbyte/material-ui-image) instead. See the [comparison chart](#comparison-with-similar-components) below for more._
|
|
124
|
+
_Note: Profits not guaranteed and Material UI v5 or v6 is a peer dependency. If you need to support legacy versions of Material UI, use [`material-ui-image`](https://github.com/TeamWertarbyte/material-ui-image) instead. See the [comparison chart](#comparison-with-similar-components) below for more._
|
|
123
125
|
|
|
124
126
|
## Usage Examples
|
|
125
127
|
|
|
@@ -311,7 +313,7 @@ All the description on this table are generated using ChatGPT and edited by me.
|
|
|
311
313
|
| Feature | `mui-image` | `mui-image-alter` | `material-ui-image` |
|
|
312
314
|
| ----------------------------- | :------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------------: |
|
|
313
315
|
| Size (minzipped) |  |  |  |
|
|
314
|
-
| Supports MUI v5 | ✅ | ✅ | ❌ |
|
|
316
|
+
| Supports MUI v5/v6 | ✅ | ✅ | ❌ |
|
|
315
317
|
| Supports MUI component prop | ❌ | ✅ | ❌ |
|
|
316
318
|
| Built-in Typescript types | ❌ | ✅ | ❌ |
|
|
317
319
|
| Fade-in | ✅ | ✅ | ✅ |
|
package/dist/index.d.cts
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
import { OverridableTypeMap } from '@mui/types';
|
|
5
|
-
import { OverrideProps } from '@mui/types';
|
|
1
|
+
import { OverridableComponent } from '@mui/material/OverridableComponent';
|
|
2
|
+
import { OverridableTypeMap } from '@mui/material/OverridableComponent';
|
|
3
|
+
import { OverrideProps } from '@mui/material/OverridableComponent';
|
|
6
4
|
import { SxProps } from '@mui/material/styles';
|
|
7
5
|
import { Theme } from '@mui/material/styles';
|
|
8
6
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
import { OverridableTypeMap } from '@mui/types';
|
|
5
|
-
import { OverrideProps } from '@mui/types';
|
|
1
|
+
import { OverridableComponent } from '@mui/material/OverridableComponent';
|
|
2
|
+
import { OverridableTypeMap } from '@mui/material/OverridableComponent';
|
|
3
|
+
import { OverrideProps } from '@mui/material/OverridableComponent';
|
|
6
4
|
import { SxProps } from '@mui/material/styles';
|
|
7
5
|
import { Theme } from '@mui/material/styles';
|
|
8
6
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "mui-image-alter",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"description": "Fork of mui-image. Display images as per the Material guidelines using Material-UI v5. With component prop support.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -36,32 +36,35 @@
|
|
|
36
36
|
"test:coverage": "vitest run --coverage",
|
|
37
37
|
"test:coverage-ci": "vitest run --coverage.enabled --coverage.reporter='text-summary'"
|
|
38
38
|
},
|
|
39
|
+
"dependencies": {
|
|
40
|
+
"clsx": "^2.1.1",
|
|
41
|
+
"use-resize-observer": "^9.1.0"
|
|
42
|
+
},
|
|
39
43
|
"peerDependencies": {
|
|
40
|
-
"@mui/material": "^5.0.
|
|
41
|
-
"react": "^17.0.
|
|
44
|
+
"@mui/material": "^5.0.0 || ^6.0.0",
|
|
45
|
+
"react": "^17.0.0 || ^18.0.0",
|
|
46
|
+
"react-dom": "^17.0.0 || ^18.0.0"
|
|
42
47
|
},
|
|
43
48
|
"devDependencies": {
|
|
44
|
-
"@emotion/react": "^11.
|
|
45
|
-
"@emotion/styled": "^11.
|
|
46
|
-
"@fontsource/fira-code": "^5.0.
|
|
47
|
-
"@
|
|
48
|
-
"@
|
|
49
|
-
"@testing-library/
|
|
50
|
-
"@
|
|
51
|
-
"@types/react": "^18.
|
|
52
|
-
"@
|
|
53
|
-
"@
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
"
|
|
63
|
-
"vite-plugin-dts": "^3.6.4",
|
|
64
|
-
"vitest": "^0.34.6"
|
|
49
|
+
"@emotion/react": "^11.13.3",
|
|
50
|
+
"@emotion/styled": "^11.13.0",
|
|
51
|
+
"@fontsource/fira-code": "^5.0.19",
|
|
52
|
+
"@size-limit/preset-small-lib": "^11.1.4",
|
|
53
|
+
"@testing-library/jest-dom": "^6.5.0",
|
|
54
|
+
"@testing-library/react": "^16.0.1",
|
|
55
|
+
"@types/react": "^18.3.5",
|
|
56
|
+
"@types/react-dom": "^18.3.0",
|
|
57
|
+
"@vitejs/plugin-react": "^4.3.1",
|
|
58
|
+
"@vitest/coverage-v8": "^2.0.5",
|
|
59
|
+
"jsdom": "^25.0.0",
|
|
60
|
+
"prettier": "^3.3.3",
|
|
61
|
+
"rimraf": "^6.0.1",
|
|
62
|
+
"size-limit": "^11.1.4",
|
|
63
|
+
"typeit-react": "^2.7.2",
|
|
64
|
+
"typescript": "^5.5.4",
|
|
65
|
+
"vite": "^5.4.2",
|
|
66
|
+
"vite-plugin-dts": "^4.1.0",
|
|
67
|
+
"vitest": "^2.0.5"
|
|
65
68
|
},
|
|
66
69
|
"size-limit": [
|
|
67
70
|
{
|
|
@@ -92,9 +95,5 @@
|
|
|
92
95
|
"material design",
|
|
93
96
|
"react",
|
|
94
97
|
"loading image"
|
|
95
|
-
]
|
|
96
|
-
"dependencies": {
|
|
97
|
-
"clsx": "^2.0.0",
|
|
98
|
-
"use-resize-observer": "^9.1.0"
|
|
99
|
-
}
|
|
98
|
+
]
|
|
100
99
|
}
|