Image Component

The Image component displays an image from a configured URL. It supports optional width and height constraints and can be hidden conditionally.

How to read settings tables
The tables below describe each configurable option as it displays in the UnqorkAI platform. Values are formatted as follows: inline code — a value to type exactly as shown | Bold — a value selected from a drop-down, radio button, tab, or choice chip | ON/OFF — toggle state | ✓ — checkbox checked | ☐ — checkbox unchecked

General Settings

Setting	Field	Type	Default	Description
Property ID	`key`	Text input	`image`	The unique identifier for this component instance.

Display Settings

Setting	Field	Type	Default	Description
URL	`sourceUrl`	Text input	—	The URL of the image to display.
Alternative Text	`alternativeText`	Text input	—	A text description of the image for screen readers and when the image fails to load.
Width	`size.width`	Number input	—	The display width of the image in pixels. Leave empty to use the image's natural width.
Height	`size.height`	Number input	—	The display height of the image in pixels. Leave empty to use the image's natural height.
Hidden	`hidden`	Toggle	OFF	Hides the image from end-users but always displays in the Module Builder.

Advanced Settings

Setting	Field	Type	Default	Description
Custom CSS Class	`customClass`	Text input	—	A CSS class applied to the image for custom styling.

Accessibility Settings

For details on each setting and when to use it, see Accessibility Settings Reference.

Setting	Field	Type	Default	Description
Hide From Screen Readers	`ariaHidden`	Toggle	OFF	Hides the image from assistive technologies. Use when the image is purely decorative.

Custom ARIA Attributes

Adds additional custom ARIA attributes to the element as key-value pairs.

Column	Field	Description
Attribute	`key`	The ARIA attribute name (for example, `aria-label`, `aria-describedby`, and so on).
Value	`value`	The value for the attribute.

Operations Builder

This component supports the Operations Builder in Vega modules. When the module or panel runtime is set to Vega (2.0), an Event Handlers section displays in the settings panel for configuring event-driven operations.

Changelog

Date	Change
—	Initial publication.