HTML Element Component

The HTML Element component renders a raw HTML tag with configurable content and attributes. Use it to add headings, paragraphs, dividers, or any custom HTML structure to a module.

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	`html`	A unique ID for this component instance.

Display Settings

Formatting

Setting	Field	Type	Default	Description
Tag	`tag`	Text input	`p`	The HTML tag to render (for example, `h1`, `h2`, `p`, `div`, `span`, and so on).
Content	`content`	Code editor	—	The content to display inside the element. Supports plain text and HTML markup.

Default State Options

Setting	Field	Type	Default	Description
Hide Field	`hidden`	Toggle	OFF	Hides the component from end-users but always displays in the Module Builder.

Advanced Settings

Additional Styling

Setting	Field	Type	Default	Description
Custom CSS Class	`className`	Text input	—	A CSS class applied directly to the HTML element for custom styling.
Custom CSS Class for Container	`customClass`	Text input	—	A CSS class applied to the element's parent container in the DOM.

Attributes

Adds arbitrary HTML attributes to the rendered element. Use only safe attributes like src, href, and title. The style attribute is not supported — use the Custom CSS Class setting to apply custom styles instead.

Action	Description
Copy Table	Copies the current Attributes configuration to the clipboard.
Replace Table	Replaces the current Attributes configuration with a copied one.
Filter	Filters the rows displayed in the table.
Add Attribute	Adds a new attribute row to the table.

Column	Field	Type	Description
Label	`attr`	Text input	The HTML attribute name (for example, `href`, `src`, `title`).
Value	`value`	Text input	The value for the attribute.

Accessibility Settings

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

Attributes

Setting	Field	Type	Default	Description
Label	`ariaLabelOption`	Drop-down	None	Sets how to label this element for screen readers. Options include: None, Custom label, or Reference label(s).
Description	`ariaDescriptionOption`	Drop-down	None	Sets how to provide additional context for screen readers. Options include: None, Custom description, or Reference description(s).
Role	`ariaRole`	Drop-down	—	Defines the role or semantic meaning of the element for assistive technologies. See Accessibility Settings Reference for the full list of available roles.
Announce Live Changes	`ariaLive`	Drop-down	Off	Controls how screen readers announce dynamic content updates. Options include: Off, Polite, or Assertive.
Hide From Screen Readers	`ariaHidden`	Toggle	OFF	Hides the element from assistive technologies without removing it from the DOM.

Custom ARIA Attributes

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

Column	Field	Type	Description
ARIA Attribute	`attr`	Drop-down	The ARIA attribute name selected from a list of valid ARIA attributes.
Value	`value`	Text input	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.