feat(image): add scale prop to image container

components/image/image.tsx

@@ -9,17 +9,19 @@ interface Props {
   width?: number
   height?: number
   className?: string
+  scale?: string
 }
 
 const defaultProps = {
   animation: true,
   className: '',
+  scale: '100%',
 }
 
 export type ImageProps = Props & typeof defaultProps & React.ImgHTMLAttributes<any>
 
 const Image: React.FC<ImageProps> = React.memo(({
-  src, width, height, animation, className, ...props
+  src, width, height, animation, className, scale, ...props
 }) => {
   const showAnimation = animation && width && height
   const theme = useTheme()
@@ -67,8 +69,9 @@ const Image: React.FC<ImageProps> = React.memo(({
         }
         
         img {
-          width: 100%;
+          width: ${scale};
-          height: 100%;
+          height: ${scale};
+          object-fit: scale-down;
         }
       `}</style>
     </div>

pages/docs/components/image.mdx

@@ -44,6 +44,7 @@ Display image content.
 | **animation** | display animation when loading  | `boolean` | - | `true` |
 | **width** | width | `number` | - | - |
 | **height** | height | `number` | - | - |
+| **scale** | scale value | `string` | - | `100%` |
 | ... | native props | `ImgHTMLAttributes` | `'alt', 'className', ...` | - |
 
 </Attributes>