# elementor/3.35.0-dev1/modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js

Elementor Website Builder – more than just a page builder, version 3.35.0-dev1. 45 lines.

- Page: https://pluginprobe.com/plugins/elementor/3.35.0-dev1/code/modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js
- Raw: https://pluginprobe.com/plugins/elementor/3.35.0-dev1/raw/modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js
- Modified: 2025-12-22T12:25:58+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/elementor/3.35.0-dev1/code/modules/atomic-widgets/elements/atomic-tabs/handlers/utils.js#L10-L20`.

```javascript
export const TAB_ELEMENT_TYPE = 'e-tab';
export const TAB_CONTENT_ELEMENT_TYPE = 'e-tab-content';
export const TABS_CONTENT_AREA_ELEMENT_TYPE = 'e-tabs-content-area';
export const TABS_MENU_ELEMENT_TYPE = 'e-tabs-menu';

const NAVIGATE_UP_KEYS = [ 'ArrowUp', 'ArrowLeft' ];
const NAVIGATE_DOWN_KEYS = [ 'ArrowDown', 'ArrowRight' ];

export const getTabId = ( tabsId, tabIndex ) => {
	return `${ tabsId }-tab-${ tabIndex }`;
};

export const getTabContentId = ( tabsId, tabIndex ) => {
	return `${ tabsId }-tab-content-${ tabIndex }`;
};

export const getChildren = ( el, elementType ) => {
	const parent = el.parentElement;

	return Array.from( parent.children ).filter( ( child ) => {
		return child.dataset.element_type === elementType;
	} );
};

export const getIndex = ( el, elementType ) => {
	const children = getChildren( el, elementType );

	return children.indexOf( el );
};

export const getNextTab = ( key, tab ) => {
	const tabs = getChildren( tab, TAB_ELEMENT_TYPE );
	const tabsLength = tabs.length;

	const currentIndex = getIndex( tab, TAB_ELEMENT_TYPE );

	if ( NAVIGATE_DOWN_KEYS.includes( key ) ) {
		return tabs[ ( currentIndex + 1 ) % tabsLength ];
	}

	if ( NAVIGATE_UP_KEYS.includes( key ) ) {
		return tabs[ ( currentIndex - 1 + tabsLength ) % tabsLength ];
	}
};

```