Skip to content

Image widget icon preview uses maxHeight instead of iconSize in Structure mode #2373

Description

@valczak-cell

Description

The Image widget incorrectly sizes icon placeholders in Studio Pro’s Structure mode.

When the data source is set to Icon, getPreview() in Image.editorConfig.ts still uses the image dimension logic. If the height unit is auto, the default maxHeight value of 250 is used as the placeholder height.

As a result, an icon configured with an iconSize of 15px occupies 250px vertically in Structure mode. Design mode and runtime rendering are not affected.

Expected behavior

For an icon data source, the Structure mode placeholder should use iconSize for both its width and height.

Suggested change

In Image.editorConfig.ts, use the configured icon size instead of getImageWithDimensions() when values.datasource === "icon":

const [width, height, property] =
    values.datasource === "icon"
        ? [values.iconSize ?? 14, values.iconSize ?? 14, undefined]
        : getImageWithDimensions();

This keeps the existing placeholder while displaying it at the expected icon dimensions.

Future improvement
The Structure Preview API could expose an Icon preview type that accepts an icon property and size, similar to mendix/components/web/Icon in Design mode. This would allow Structure mode to display the selected icon instead of a generic image placeholder.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions