GET STARTED

Import

Import only the concise canonical standalone declarations used by the template.

import {
  NeuralTabs,
  NeuralTabList,
  NeuralTab,
  NeuralTabPanels,
  NeuralTabPanel,
} from '@neural-ng/core/tabs';

@Component({
  imports: [NeuralTabs, NeuralTabList, NeuralTab, NeuralTabPanels, NeuralTabPanel],
})

Controlled tabs and icons

String and number values are supported. The model remains the single source of truth; iconClass accepts Neural Icons and arbitrary utility classes.

Vertical manual activation

Vertical orientation changes layout, ARIA orientation and navigation to Up/Down. Manual mode moves focus first and activates with Enter or Space.

Disabled tabs and deterministic fallback

Disabled tabs remain discoverable, leave the roving focus order and cannot activate. Null, invalid, removed or newly disabled values resolve to the first enabled tab.

Responsive overflow

Constrained horizontal lists scroll natively, retain one semantic tablist and keep focused tabs reachable without duplicate navigation controls.

Unstyled and typed slots

Unstyled removes every NeuralNg visual class while preserving structural hooks, native buttons, roving focus, ARIA and hidden panel behavior.

Resolution rules and intentional boundaries

Semantics and relationships

The named list exposes role=tablist and orientation. Native button tabs expose selected, disabled and controls state; panels reference their tabs and inactive panels are hidden.

Keyboard

Horizontal Left/Right or vertical Up/Down navigation wraps and skips disabled tabs. Home/End jump to boundaries. Manual activation uses Enter or Space.

Focus model

Roving tabindex leaves one enabled tab in the page order. Active panels are focusable by default; disable panel focus only when its first meaningful control provides a better destination.

RTL and reduced motion

Horizontal arrows follow computed direction while vertical keys remain physical. Indicator and panel entry motion collapse under the user’s reduced-motion preference.

Tabs inputs

Output

List, tab and panel API

Typed class slots