DOM

import { indexComponent } from '@bbc/front-end-kit/vue/utils/dom'

Utility functions for DOM manipulation in Vue components.

API

indexComponent ($el, path, indexed)

Indexes a component's config path by appending its position among sibling elements. Typically used to assign index-based Showpad tracking identifiers to repeated components.

Parameters:

• $el: HTMLElement — The root element of the component being indexed.
• path: String — The base path to which the index will be appended (e.g. 'section.item' becomes 'section.item-2').
• indexed: Boolean | Function — Controls whether indexing is applied:
  • false: No indexing; path is unchanged.
  • true: Appends the component's 1-based position among its siblings.
  • Function((el, index, list) => Boolean): Custom filter to select which siblings count toward the index.

Side effect: Writes the modified path to $el.dataset.sp.

Returns: undefined