Namespace custom events to avoid collisions

[bemky]

Problem

Events like change, shown, hidden, select, search, results are generic names that can collide with native DOM events or other libraries.

Recommendation

Prefix custom events with komp::

// Instead of
this.trigger('shown')
this.trigger('change')

// Use
this.trigger('komp:shown')
this.trigger('komp:change')

This follows the convention set by libraries like Stimulus (turbo:load) and HTMX (htmx:afterSwap). Prevents subtle bugs when e.g. change fires on an input-like component and a parent listener catches it unexpectedly.

The events array and onEventName binding pattern would need to accommodate the prefix.