Skip to content
This plugin is new and currently in beta. For the stable version, please use the previous version of the plugin.

UIElementTagRegistry

Registry for mapping custom UI element tags to their implementations.

typescript
class UIElementTagRegistry

Description

UIElementTagRegistry provides a mechanism to register custom HTML tags that will be replaced with your UI elements when controls are rendered. This allows you to use simple, declarative tags in your control templates that automatically get replaced with complex UI elements at runtime.

For example, you can define a tag like <brand-color-picker> in your control templates, and the registry will ensure it gets replaced with your custom color picker UI element when the control is rendered.

Import

typescript
import { UIElementTagRegistry } from '@stripoinc/ui-editor-extensions';

Methods

registerUiElements()

Registers mappings between custom HTML tags and UI element IDs.

typescript
public registerUiElements(uiElementsTagsMap: Record<string, string>): void

Parameters

NameTypeDescription
uiElementsTagsMapRecord<string, string>Map of tag names to UI element IDs

Usage Notes

  • Tag names should be valid HTML custom element names (lowercase with hyphens)
  • UI element IDs must match those returned by UIElement.getId()
  • The map is provided by the editor based on available UI elements
  • Register only the tags you want to use in your templates