[ BUG ] OptimizeImages throws warning when dimension values are set to 0

[sasjakoning]

Framework: Nuxt.js

When using the richTextResolver with the optimizeImages function, setting the width and/or right to 0 throws the following warning:

[StoryblokRichText] - Height value must be a number greater than 0

While this may be the expected behaviour, it doesn't align well with the image service documentation as stated here: https://www.storyblok.com/docs/image-service#resizing In which a dimension could be set to 0 to enable proportional sizing.

On the page itself, it does work correctly, but it still throws the warning.

I do understand that setting explicit width and height values is best practice to avoid content shifting and such. But, when I, for example, set the values to 500x500, the image is cropped and cannot be adjusted using rules such as object-fit: contain;.

(Example of images being cropped when static width/height values are set)

An alternative to fix this would be to add the fit-in option as documented in the image service: https://www.storyblok.com/docs/image-service#fit-in

I have also mentioned this issue in the Storyblok Discord server: https://discord.com/channels/700316478792138842/1331278280179060878

---

Expected Behavior

No longer show a warning when using '0' as a dimension value.

Or,

Images with fixed width and height don't crop or can be adjusted using fit-in options.

Current Behavior

The code throws a warning when setting the dimension width and/or height to '0'.

Steps to Reproduce

this is the code I used to render my images in this I got the warning

[StoryblokRichText] - Height value must be a number greater than 0

const { render } = richTextResolver({
    optimizeImages: {
        width: 500,
        height: 0,
        filters: {
            format: 'webp',
        },
    },
});