diff --git a/src/tabs/README.md b/src/tabs/README.md index 019db5c..fd19c1f 100644 --- a/src/tabs/README.md +++ b/src/tabs/README.md @@ -21,11 +21,11 @@ import '@travelopia/web-components/dist/tabs'; import '@travelopia/web-components/dist/tabs/style.css'; // TypeScript usage: -import { TPTabs } from '@travelopia/web-components'; +import { TPTabsElement } from '@travelopia/web-components'; ... -const tabs: TPTabs = document.querySelector( 'tp-tabs' ); +const tabs: TPTabsElement = document.querySelector( 'tp-tabs' ); tabs.setCurrentTab( 'overview' ); ``` diff --git a/src/tabs/tp-tabs.ts b/src/tabs/tp-tabs.ts index 813c346..02f9f0e 100644 --- a/src/tabs/tp-tabs.ts +++ b/src/tabs/tp-tabs.ts @@ -60,7 +60,7 @@ export class TPTabsElement extends HTMLElement { */ update(): void { // Get current tab. - const currentTab: string = this.getAttribute( 'current-tab' ) ?? ''; + const currentTab: string = this.currentTab; // Check if current tab exists. if ( ! this.querySelector( `tp-tabs-tab[id="${ currentTab }"]` ) ) { @@ -116,6 +116,16 @@ export class TPTabsElement extends HTMLElement { this.setCurrentTab(); } + /** + * Get current tab. + * + * @return {string} Current tab ID. + */ + get currentTab(): string { + // Return the current tab ID. + return this.getAttribute( 'current-tab' ) ?? ''; + } + /** * Set current tab. *