igniteui-webcomponents 7.3.0-beta.0 → 7.3.0

package/components/stepper/stepper.js

@@ -4,18 +4,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { ContextProvider } from '@lit/context';
 import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
+import { addContextProvider } from '#internals/controllers/context-provider.js';
 import { addInternalsController } from '#internals/controllers/internals.js';
-import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, homeKey, } from '#internals/controllers/key-bindings.js';
+import { addRovingFocusController } from '#internals/controllers/roving-focus.js';
 import { addSlotController, setSlots } from '#internals/controllers/slot.js';
 import { registerComponent } from '#internals/definitions/register.js';
 import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
-import { firstOf, lastOf } from '#internals/utils/arrays.js';
-import { getRoot, isLTR } from '#internals/utils/dom.js';
+import { getRoot } from '#internals/utils/dom.js';
 import { addSafeEventListener, getElementFromPath, } from '#internals/utils/events.js';
-import { wrap } from '#internals/utils/math.js';
 import { addThemingController } from '#theming/theming-controller.js';
 import { STEPPER_CONTEXT } from './common/context.js';
 import { createStepperState } from './common/state.js';
@@ -48,18 +46,6 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
     constructor() {
         super();
         this._state = createStepperState();
-        this._contextProvider = new ContextProvider(this, {
-            context: STEPPER_CONTEXT,
-            initialValue: {
-                stepper: this,
-                state: this._state,
-            },
-        });
-        this._internals = addInternalsController(this, {
-            initialARIA: {
-                role: 'tablist',
-            },
-        });
         this._slots = addSlotController(this, {
             slots: setSlots(),
             onChange: this._handleSlotChange,
@@ -73,26 +59,30 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
         this.animationDuration = 320;
         this.titlePosition = 'auto';
         addSafeEventListener(this, 'click', this._handleInteraction);
+        addInternalsController(this, {
+            initialARIA: { role: 'tablist' },
+            aria: () => ({ ariaOrientation: this.orientation }),
+        });
+        const context = { stepper: this, state: this._state };
+        addContextProvider(this, {
+            context: STEPPER_CONTEXT,
+            watch: STEPPER_SYNC_PROPERTIES,
+            value: () => context,
+        });
         addThemingController(this, {
             light: { bootstrap, fluent, indigo },
             dark: { bootstrap, fluent, indigo },
         });
-        addKeybindings(this, {
-            skip: this._skipKeyboard,
-        })
-            .set(arrowUp, this._handleArrowUp)
-            .set(arrowDown, this._handleArrowDown)
-            .set(arrowLeft, this._handleArrowLeft)
-            .set(arrowRight, this._handleArrowRight)
-            .set(homeKey, this._handleHomeKey)
-            .set(endKey, this._handleEndKey)
-            .setActivateHandler(this._handleInteraction);
+        addRovingFocusController(this, {
+            keybindings: { skip: this._skipKeyboard },
+            items: () => this._state.accessibleSteps,
+            current: () => this._getActiveStepComponent(),
+            vertical: () => !this._isHorizontal,
+            focusItem: (step) => this._getStepHeader(step)?.focus(),
+            activateItem: (step) => this._activateStep(step),
+        });
     }
     update(properties) {
-        this._syncStepperAttributes(properties);
-        if (properties.has('orientation')) {
-            this._internals.setARIA({ ariaOrientation: this.orientation });
-        }
         if (properties.has('linear')) {
             this._state.setVisitedState(this.linear);
         }
@@ -106,46 +96,6 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
     _skipKeyboard(_, event) {
         return !getElementFromPath('[data-step-header]', event);
     }
-    _handleHomeKey() {
-        this._getStepHeader(firstOf(this._state.accessibleSteps))?.focus();
-    }
-    _handleEndKey() {
-        this._getStepHeader(lastOf(this._state.accessibleSteps))?.focus();
-    }
-    _handleArrowDown() {
-        if (!this._isHorizontal) {
-            const step = this._getActiveStepComponent();
-            if (step) {
-                this._getStepHeader(this._getNextStep(step))?.focus();
-            }
-        }
-    }
-    _handleArrowUp() {
-        if (!this._isHorizontal) {
-            const step = this._getActiveStepComponent();
-            if (step) {
-                this._getStepHeader(this._getPreviousStep(step))?.focus();
-            }
-        }
-    }
-    _handleArrowLeft() {
-        const step = this._getActiveStepComponent();
-        if (step) {
-            const next = isLTR(this)
-                ? this._getPreviousStep(step)
-                : this._getNextStep(step);
-            this._getStepHeader(next)?.focus();
-        }
-    }
-    _handleArrowRight() {
-        const step = this._getActiveStepComponent();
-        if (step) {
-            const next = isLTR(this)
-                ? this._getNextStep(step)
-                : this._getPreviousStep(step);
-            this._getStepHeader(next)?.focus();
-        }
-    }
     _handleInteraction(event) {
         const step = getElementFromPath(IgcStepComponent.tagName, event);
         if (step && this._state.isAccessible(step)) {
@@ -159,11 +109,6 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
         this._state.stepsChanged();
         this.style.setProperty('--steps-count', this.steps.length.toString());
     }
-    _syncStepperAttributes(properties) {
-        if (STEPPER_SYNC_PROPERTIES.some((p) => properties.has(p))) {
-            this._contextProvider.updateObservers();
-        }
-    }
     _animateSteps(nextStep, currentStep) {
         const steps = this._state.steps;
         if (steps.indexOf(nextStep) > steps.indexOf(currentStep)) {
@@ -216,16 +161,6 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
             this._state.changeActiveStep(step);
         }
     }
-    _getNextStep(step) {
-        const steps = this._state.accessibleSteps;
-        const next = wrap(0, steps.length - 1, steps.indexOf(step) + 1);
-        return steps[next];
-    }
-    _getPreviousStep(step) {
-        const steps = this._state.accessibleSteps;
-        const previous = wrap(0, steps.length - 1, steps.indexOf(step) - 1);
-        return steps[previous];
-    }
     _getActiveStepComponent() {
         const active = getRoot(this).activeElement;
         return active ? active.closest(IgcStepComponent.tagName) : null;

package/components/stepper/stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport {\n  addKeybindings,\n  arrowDown,\n  arrowLeft,\n  arrowRight,\n  arrowUp,\n  endKey,\n  homeKey,\n} from '#internals/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { firstOf, lastOf } from '#internals/utils/arrays.js';\nimport { getRoot, isLTR } from '#internals/utils/dom.js';\nimport {\n  addSafeEventListener,\n  getElementFromPath,\n} from '#internals/utils/events.js';\nimport { wrap } from '#internals/utils/math.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type {\n  HorizontalTransitionAnimation,\n  StepperOrientation,\n  StepperStepType,\n  StepperTitlePosition,\n  StepperVerticalAnimation,\n} from '../types.js';\nimport { STEPPER_CONTEXT } from './common/context.js';\nimport { createStepperState } from './common/state.js';\nimport type {\n  IgcActiveStepChangedEventArgs,\n  IgcActiveStepChangingEventArgs,\n  IgcStepperComponentEventMap,\n} from './common/types.js';\nimport IgcStepComponent from './step.js';\nimport { styles } from './themes/stepper/stepper.base.css.js';\nimport { styles as bootstrap } from './themes/stepper/stepper.bootstrap.css.js';\nimport { styles as fluent } from './themes/stepper/stepper.fluent.css.js';\nimport { styles as indigo } from './themes/stepper/stepper.indigo.css.js';\n\nconst STEPPER_SYNC_PROPERTIES: (keyof IgcStepperComponent)[] = [\n  'orientation',\n  'stepType',\n  'contentTop',\n  'verticalAnimation',\n  'horizontalAnimation',\n  'animationDuration',\n  'titlePosition',\n];\n\n/**\n * A stepper component that provides a wizard-like workflow by dividing content into logical steps.\n *\n * @remarks\n * The stepper component allows the user to navigate between multiple step children.\n * It supports horizontal and vertical orientation, linear and non-linear navigation,\n * keyboard navigation, and provides API methods to control the active step.\n *\n * In linear mode, the user can only advance to the next step if the current step is valid\n * (not marked as `invalid`).\n *\n * @element igc-stepper\n *\n * @slot - Renders the steps of the stepper inside the default slot.\n *\n * @fires igcActiveStepChanging - Emitted when the active step is about to change. Cancelable.\n * @fires igcActiveStepChanged - Emitted after the active step has changed.\n *\n * @example\n * ```html\n * <igc-stepper>\n *   <igc-step>\n *     <span slot=\"title\">Step 1</span>\n *     <p>Step 1 content</p>\n *   </igc-step>\n *   <igc-step>\n *     <span slot=\"title\">Step 2</span>\n *     <p>Step 2 content</p>\n *   </igc-step>\n * </igc-stepper>\n * ```\n *\n * @example Linear stepper with vertical orientation\n * ```html\n * <igc-stepper orientation=\"vertical\" linear>\n *   <igc-step complete>\n *     <span slot=\"title\">Completed step</span>\n *     <p>This step is already complete.</p>\n *   </igc-step>\n *   <igc-step active>\n *     <span slot=\"title\">Current step</span>\n *     <p>Fill in the details to proceed.</p>\n *   </igc-step>\n *   <igc-step>\n *     <span slot=\"title\">Next step</span>\n *     <p>Upcoming content.</p>\n *   </igc-step>\n * </igc-stepper>\n * ```\n */\nexport default class IgcStepperComponent extends EventEmitterMixin<\n  IgcStepperComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-stepper';\n  public static styles = styles;\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcStepperComponent, IgcStepComponent);\n  }\n\n  //#region Internal state and properties\n\n  private readonly _state = createStepperState();\n\n  private readonly _contextProvider = new ContextProvider(this, {\n    context: STEPPER_CONTEXT,\n    initialValue: {\n      stepper: this,\n      state: this._state,\n    },\n  });\n\n  private readonly _internals = addInternalsController(this, {\n    initialARIA: {\n      role: 'tablist',\n    },\n  });\n\n  private readonly _slots = addSlotController(this, {\n    slots: setSlots(),\n    onChange: this._handleSlotChange,\n  });\n\n  private get _isHorizontal(): boolean {\n    return this.orientation === 'horizontal';\n  }\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /** Returns all of the stepper's steps. */\n  public get steps(): readonly IgcStepComponent[] {\n    return this._state.steps;\n  }\n\n  /**\n   * The orientation of the stepper.\n   *\n   * @attr orientation\n   * @default 'horizontal'\n   */\n  @property({ reflect: true })\n  public orientation: StepperOrientation = 'horizontal';\n\n  /**\n   * The visual type of the steps.\n   *\n   * @attr step-type\n   * @default 'full'\n   */\n  @property({ reflect: true, attribute: 'step-type' })\n  public stepType: StepperStepType = 'full';\n\n  /**\n   * Whether the stepper is linear.\n   *\n   * @remarks\n   * If the stepper is in linear mode and if the active step is valid only then the user is able to move forward.\n   *\n   * @attr linear\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public linear = false;\n\n  /**\n   * Whether the content is displayed above the steps.\n   *\n   * @attr content-top\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'content-top' })\n  public contentTop = false;\n\n  /**\n   * The animation type when in vertical mode.\n   *\n   * @attr vertical-animation\n   * @default 'grow'\n   */\n  @property({ attribute: 'vertical-animation' })\n  public verticalAnimation: StepperVerticalAnimation = 'grow';\n\n  /**\n   * The animation type when in horizontal mode.\n   *\n   * @attr horizontal-animation\n   * @default 'slide'\n   */\n  @property({ attribute: 'horizontal-animation' })\n  public horizontalAnimation: HorizontalTransitionAnimation = 'slide';\n\n  /**\n   * The animation duration in either vertical or horizontal mode in milliseconds.\n   *\n   * @attr animation-duration\n   * @default 320\n   */\n  @property({ type: Number, attribute: 'animation-duration' })\n  public animationDuration = 320;\n\n  /**\n   * The position of the steps title.\n   *\n   * @remarks\n   * When the stepper is horizontally orientated the title is positioned below the indicator.\n   * When the stepper is vertically orientated the title is positioned on the right side of the indicator.\n   *\n   * @attr title-position\n   * @default 'auto'\n   */\n  @property({ reflect: false, attribute: 'title-position' })\n  public titlePosition: StepperTitlePosition = 'auto';\n\n  //#endregion\n\n  constructor() {\n    super();\n\n    addSafeEventListener(this, 'click', this._handleInteraction);\n\n    addThemingController(this, {\n      light: { bootstrap, fluent, indigo },\n      dark: { bootstrap, fluent, indigo },\n    });\n\n    addKeybindings(this, {\n      skip: this._skipKeyboard,\n    })\n      .set(arrowUp, this._handleArrowUp)\n      .set(arrowDown, this._handleArrowDown)\n      .set(arrowLeft, this._handleArrowLeft)\n      .set(arrowRight, this._handleArrowRight)\n      .set(homeKey, this._handleHomeKey)\n      .set(endKey, this._handleEndKey)\n      .setActivateHandler(this._handleInteraction);\n  }\n\n  //#region Lifecycle hooks\n\n  protected override update(properties: PropertyValues<this>): void {\n    this._syncStepperAttributes(properties);\n\n    if (properties.has('orientation')) {\n      this._internals.setARIA({ ariaOrientation: this.orientation });\n    }\n\n    if (properties.has('linear')) {\n      this._state.setVisitedState(this.linear);\n    }\n\n    if (\n      properties.has('horizontalAnimation') ||\n      properties.has('animationDuration')\n    ) {\n      const duration =\n        this.horizontalAnimation !== 'none' ? this.animationDuration : 0;\n\n      this.style.setProperty('--animation-duration', `${duration}ms`);\n    }\n\n    super.update(properties);\n  }\n\n  //#endregion\n\n  //#region Keyboard navigation handlers\n\n  private _skipKeyboard(_: Element, event: KeyboardEvent): boolean {\n    return !getElementFromPath('[data-step-header]', event);\n  }\n\n  private _handleHomeKey(): void {\n    this._getStepHeader(firstOf(this._state.accessibleSteps))?.focus();\n  }\n\n  private _handleEndKey(): void {\n    this._getStepHeader(lastOf(this._state.accessibleSteps))?.focus();\n  }\n\n  private _handleArrowDown(): void {\n    if (!this._isHorizontal) {\n      const step = this._getActiveStepComponent();\n\n      if (step) {\n        this._getStepHeader(this._getNextStep(step))?.focus();\n      }\n    }\n  }\n\n  private _handleArrowUp(): void {\n    if (!this._isHorizontal) {\n      const step = this._getActiveStepComponent();\n\n      if (step) {\n        this._getStepHeader(this._getPreviousStep(step))?.focus();\n      }\n    }\n  }\n\n  private _handleArrowLeft(): void {\n    const step = this._getActiveStepComponent();\n\n    if (step) {\n      const next = isLTR(this)\n        ? this._getPreviousStep(step)\n        : this._getNextStep(step);\n\n      this._getStepHeader(next)?.focus();\n    }\n  }\n\n  private _handleArrowRight(): void {\n    const step = this._getActiveStepComponent();\n\n    if (step) {\n      const next = isLTR(this)\n        ? this._getNextStep(step)\n        : this._getPreviousStep(step);\n\n      this._getStepHeader(next)?.focus();\n    }\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  private _handleInteraction(event: Event): void {\n    const step = getElementFromPath(IgcStepComponent.tagName, event);\n\n    if (step && this._state.isAccessible(step)) {\n      this._activateStep(step);\n    }\n  }\n\n  private _handleSlotChange(): void {\n    this._state.setSteps(\n      this._slots.getAssignedElements('[default]', {\n        selector: IgcStepComponent.tagName,\n      })\n    );\n\n    this._state.stepsChanged();\n    this.style.setProperty('--steps-count', this.steps.length.toString());\n  }\n\n  //#endregion\n\n  //#region Internal methods\n\n  private _syncStepperAttributes(properties: PropertyValues<this>): void {\n    if (STEPPER_SYNC_PROPERTIES.some((p) => properties.has(p))) {\n      this._contextProvider.updateObservers();\n    }\n  }\n\n  private _animateSteps(\n    nextStep: IgcStepComponent,\n    currentStep: IgcStepComponent\n  ): void {\n    const steps = this._state.steps;\n\n    if (steps.indexOf(nextStep) > steps.indexOf(currentStep)) {\n      // Animate steps in ascending/next direction\n      currentStep.toggleAnimation('out');\n      nextStep.toggleAnimation('in');\n    } else {\n      // Animate steps in descending/previous direction\n      currentStep.toggleAnimation('in', 'reverse');\n      nextStep.toggleAnimation('out', 'reverse');\n    }\n  }\n\n  private _emitChanging(args: IgcActiveStepChangingEventArgs): boolean {\n    return this.emitEvent('igcActiveStepChanging', {\n      detail: args,\n      cancelable: true,\n    });\n  }\n\n  private _emitChanged(args: IgcActiveStepChangedEventArgs): void {\n    this.emitEvent('igcActiveStepChanged', {\n      detail: args,\n    });\n  }\n\n  private _activateStep(step: IgcStepComponent, shouldEmit = true): void {\n    if (step === this._state.activeStep) {\n      return;\n    }\n\n    if (!shouldEmit) {\n      this._state.changeActiveStep(step);\n      return;\n    }\n\n    const steps = this._state.steps;\n    const activeIndex = steps.indexOf(this._state.activeStep!);\n    const index = steps.indexOf(step);\n\n    const args = { oldIndex: activeIndex, newIndex: index };\n\n    if (!this._emitChanging(args)) {\n      return;\n    }\n\n    if (this._state.activeStep) {\n      this._animateSteps(step, this._state.activeStep);\n    }\n\n    this._state.changeActiveStep(step);\n    this._emitChanged({ index });\n  }\n\n  private _moveToNextStep(next = true): void {\n    const step = this._state.getAdjacentStep(next);\n\n    if (step) {\n      if (this._state.activeStep) {\n        this._animateSteps(step, this._state.activeStep);\n      }\n      this._state.changeActiveStep(step);\n    }\n  }\n\n  private _getNextStep(step: IgcStepComponent): IgcStepComponent {\n    const steps = this._state.accessibleSteps;\n    const next = wrap(0, steps.length - 1, steps.indexOf(step) + 1);\n\n    return steps[next];\n  }\n\n  private _getPreviousStep(step: IgcStepComponent): IgcStepComponent {\n    const steps = this._state.accessibleSteps;\n    const previous = wrap(0, steps.length - 1, steps.indexOf(step) - 1);\n\n    return steps[previous];\n  }\n\n  private _getActiveStepComponent(): IgcStepComponent | null {\n    const active = getRoot(this).activeElement;\n    return active ? active.closest(IgcStepComponent.tagName) : null;\n  }\n\n  private _getStepHeader(step?: IgcStepComponent): HTMLElement | null {\n    return step?.renderRoot.querySelector('[data-step-header]') ?? null;\n  }\n\n  //#endregion\n\n  //#region Public API\n\n  /** Activates the step at a given index. */\n  public navigateTo(index: number): void {\n    const step = this._state.steps[index];\n\n    if (step) {\n      this._activateStep(step, false);\n    }\n  }\n\n  /** Activates the next enabled step. */\n  public next(): void {\n    this._moveToNextStep();\n  }\n\n  /** Activates the previous enabled step. */\n  public prev(): void {\n    this._moveToNextStep(false);\n  }\n\n  /**\n   * Resets the stepper to its initial state, i.e. activates the first step.\n   *\n   * @remarks\n   * The steps' content will not be automatically reset.\n   */\n  public reset(): void {\n    this._state.reset();\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-stepper': IgcStepperComponent;\n  }\n}\n"]}
+{"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAuB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,4CAA4C,CAAC;AAChF,OAAO,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,wBAAwB,EAAE,MAAM,wCAAwC,CAAC;AAClF,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EACL,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AAQtE,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAMvD,OAAO,gBAAgB,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,wCAAwC,CAAC;AAG1E,MAAM,uBAAuB,GAAkC;IAC7D,aAAa;IACb,UAAU;IACV,YAAY;IACZ,mBAAmB;IACnB,qBAAqB;IACrB,mBAAmB;IACnB,eAAe;CAChB,CAAC;AAoDF,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,iBAAiB,CAGhE,UAAU,CAAC;aACY,YAAO,GAAG,aAAa,AAAhB,CAAiB;aACjC,WAAM,GAAG,MAAM,AAAT,CAAU;IAGvB,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;IAC3D,CAAC;IAWD,IAAY,aAAa;QACvB,OAAO,IAAI,CAAC,WAAW,KAAK,YAAY,CAAC;IAC3C,CAAC;IAOD,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;IAC3B,CAAC;IAmFD;QACE,KAAK,EAAE,CAAC;QAtGO,WAAM,GAAG,kBAAkB,EAAE,CAAC;QAE9B,WAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE;YAChD,KAAK,EAAE,QAAQ,EAAE;YACjB,QAAQ,EAAE,IAAI,CAAC,iBAAiB;SACjC,CAAC,CAAC;QAsBI,gBAAW,GAAuB,YAAY,CAAC;QAS/C,aAAQ,GAAoB,MAAM,CAAC;QAYnC,WAAM,GAAG,KAAK,CAAC;QASf,eAAU,GAAG,KAAK,CAAC;QASnB,sBAAiB,GAA6B,MAAM,CAAC;QASrD,wBAAmB,GAAkC,OAAO,CAAC;QAS7D,sBAAiB,GAAG,GAAG,CAAC;QAaxB,kBAAa,GAAyB,MAAM,CAAC;QAOlD,oBAAoB,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAE7D,sBAAsB,CAAC,IAAI,EAAE;YAC3B,WAAW,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE;YAChC,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC;SACpD,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;QAEtD,kBAAkB,CAAC,IAAI,EAAE;YACvB,OAAO,EAAE,eAAe;YACxB,KAAK,EAAE,uBAAuB;YAC9B,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO;SACrB,CAAC,CAAC;QAEH,oBAAoB,CAAC,IAAI,EAAE;YACzB,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE;YACpC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE;SACpC,CAAC,CAAC;QAEH,wBAAwB,CAAC,IAAI,EAAE;YAC7B,WAAW,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,aAAa,EAAE;YACzC,KAAK,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,eAAe;YACxC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,uBAAuB,EAAE;YAC7C,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa;YACnC,SAAS,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE;YACvD,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;SACjD,CAAC,CAAC;IACL,CAAC;IAIkB,MAAM,CAAC,UAAgC;QACxD,IAAI,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC3C,CAAC;QAED,IACE,UAAU,CAAC,GAAG,CAAC,qBAAqB,CAAC;YACrC,UAAU,CAAC,GAAG,CAAC,mBAAmB,CAAC,EACnC,CAAC;YACD,MAAM,QAAQ,GACZ,IAAI,CAAC,mBAAmB,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;YAEnE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,QAAQ,IAAI,CAAC,CAAC;QAClE,CAAC;QAED,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAC3B,CAAC;IAMO,aAAa,CAAC,CAAU,EAAE,KAAoB;QACpD,OAAO,CAAC,kBAAkB,CAAC,oBAAoB,EAAE,KAAK,CAAC,CAAC;IAC1D,CAAC;IAMO,kBAAkB,CAAC,KAAY;QACrC,MAAM,IAAI,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;QAEjE,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;YAC3C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC;IACH,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAClB,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE;YAC3C,QAAQ,EAAE,gBAAgB,CAAC,OAAO;SACnC,CAAC,CACH,CAAC;QAEF,IAAI,CAAC,MAAM,CAAC,YAAY,EAAE,CAAC;QAC3B,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;IACxE,CAAC;IAMO,aAAa,CACnB,QAA0B,EAC1B,WAA6B;QAE7B,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;QAEhC,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;YAEzD,WAAW,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;YACnC,QAAQ,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC;aAAM,CAAC;YAEN,WAAW,CAAC,eAAe,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;YAC7C,QAAQ,CAAC,eAAe,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC;IAEO,aAAa,CAAC,IAAoC;QACxD,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,EAAE;YAC7C,MAAM,EAAE,IAAI;YACZ,UAAU,EAAE,IAAI;SACjB,CAAC,CAAC;IACL,CAAC;IAEO,YAAY,CAAC,IAAmC;QACtD,IAAI,CAAC,SAAS,CAAC,sBAAsB,EAAE;YACrC,MAAM,EAAE,IAAI;SACb,CAAC,CAAC;IACL,CAAC;IAEO,aAAa,CAAC,IAAsB,EAAE,UAAU,GAAG,IAAI;QAC7D,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;YACpC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,UAAU,EAAE,CAAC;YAChB,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACnC,OAAO;QACT,CAAC;QAED,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;QAChC,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,UAAW,CAAC,CAAC;QAC3D,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAElC,MAAM,IAAI,GAAG,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;QAExD,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC;YAC9B,OAAO;QACT,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;YAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;QACnD,CAAC;QAED,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/B,CAAC;IAEO,eAAe,CAAC,IAAI,GAAG,IAAI;QACjC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAE/C,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;gBAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACnD,CAAC;YACD,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAEO,uBAAuB;QAC7B,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,aAAa,CAAC;QAC3C,OAAO,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAClE,CAAC;IAEO,cAAc,CAAC,IAAuB;QAC5C,OAAO,IAAI,EAAE,UAAU,CAAC,aAAa,CAAC,oBAAoB,CAAC,IAAI,IAAI,CAAC;IACtE,CAAC;IAOM,UAAU,CAAC,KAAa;QAC7B,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEtC,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAClC,CAAC;IACH,CAAC;IAGM,IAAI;QACT,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAGM,IAAI;QACT,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAQM,KAAK;QACV,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;IACtB,CAAC;IAIkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AArRM;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDAC0B;AAS/C;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;qDACV;AAYnC;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACrB;AASf;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;uDAC3C;AASnB;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC;8DACc;AASrD;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC;gEACoB;AAS7D;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC;8DAC7B;AAaxB;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;0DACN","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addContextProvider } from '#internals/controllers/context-provider.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport { addRovingFocusController } from '#internals/controllers/roving-focus.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { getRoot } from '#internals/utils/dom.js';\nimport {\n  addSafeEventListener,\n  getElementFromPath,\n} from '#internals/utils/events.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type {\n  HorizontalTransitionAnimation,\n  StepperOrientation,\n  StepperStepType,\n  StepperTitlePosition,\n  StepperVerticalAnimation,\n} from '../types.js';\nimport { STEPPER_CONTEXT } from './common/context.js';\nimport { createStepperState } from './common/state.js';\nimport type {\n  IgcActiveStepChangedEventArgs,\n  IgcActiveStepChangingEventArgs,\n  IgcStepperComponentEventMap,\n} from './common/types.js';\nimport IgcStepComponent from './step.js';\nimport { styles } from './themes/stepper/stepper.base.css.js';\nimport { styles as bootstrap } from './themes/stepper/stepper.bootstrap.css.js';\nimport { styles as fluent } from './themes/stepper/stepper.fluent.css.js';\nimport { styles as indigo } from './themes/stepper/stepper.indigo.css.js';\n\n/** Property changes that the stepper republishes its context for. */\nconst STEPPER_SYNC_PROPERTIES: (keyof IgcStepperComponent)[] = [\n  'orientation',\n  'stepType',\n  'contentTop',\n  'verticalAnimation',\n  'horizontalAnimation',\n  'animationDuration',\n  'titlePosition',\n];\n\n/**\n * A stepper component that provides a wizard-like workflow by dividing content into logical steps.\n *\n * @remarks\n * The stepper component allows the user to navigate between multiple step children.\n * It supports horizontal and vertical orientation, linear and non-linear navigation,\n * keyboard navigation, and provides API methods to control the active step.\n *\n * In linear mode, the user can only advance to the next step if the current step is valid\n * (not marked as `invalid`).\n *\n * @element igc-stepper\n *\n * @slot - Renders the steps of the stepper inside the default slot.\n *\n * @fires igcActiveStepChanging - Emitted when the active step is about to change. Cancelable.\n * @fires igcActiveStepChanged - Emitted after the active step has changed.\n *\n * @example\n * ```html\n * <igc-stepper>\n *   <igc-step>\n *     <span slot=\"title\">Step 1</span>\n *     <p>Step 1 content</p>\n *   </igc-step>\n *   <igc-step>\n *     <span slot=\"title\">Step 2</span>\n *     <p>Step 2 content</p>\n *   </igc-step>\n * </igc-stepper>\n * ```\n *\n * @example Linear stepper with vertical orientation\n * ```html\n * <igc-stepper orientation=\"vertical\" linear>\n *   <igc-step complete>\n *     <span slot=\"title\">Completed step</span>\n *     <p>This step is already complete.</p>\n *   </igc-step>\n *   <igc-step active>\n *     <span slot=\"title\">Current step</span>\n *     <p>Fill in the details to proceed.</p>\n *   </igc-step>\n *   <igc-step>\n *     <span slot=\"title\">Next step</span>\n *     <p>Upcoming content.</p>\n *   </igc-step>\n * </igc-stepper>\n * ```\n */\nexport default class IgcStepperComponent extends EventEmitterMixin<\n  IgcStepperComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-stepper';\n  public static styles = styles;\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcStepperComponent, IgcStepComponent);\n  }\n\n  //#region Internal state and properties\n\n  private readonly _state = createStepperState();\n\n  private readonly _slots = addSlotController(this, {\n    slots: setSlots(),\n    onChange: this._handleSlotChange,\n  });\n\n  private get _isHorizontal(): boolean {\n    return this.orientation === 'horizontal';\n  }\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /** Returns all of the stepper's steps. */\n  public get steps(): readonly IgcStepComponent[] {\n    return this._state.steps;\n  }\n\n  /**\n   * The orientation of the stepper.\n   *\n   * @attr orientation\n   * @default 'horizontal'\n   */\n  @property({ reflect: true })\n  public orientation: StepperOrientation = 'horizontal';\n\n  /**\n   * The visual type of the steps.\n   *\n   * @attr step-type\n   * @default 'full'\n   */\n  @property({ reflect: true, attribute: 'step-type' })\n  public stepType: StepperStepType = 'full';\n\n  /**\n   * Whether the stepper is linear.\n   *\n   * @remarks\n   * If the stepper is in linear mode and if the active step is valid only then the user is able to move forward.\n   *\n   * @attr linear\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public linear = false;\n\n  /**\n   * Whether the content is displayed above the steps.\n   *\n   * @attr content-top\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'content-top' })\n  public contentTop = false;\n\n  /**\n   * The animation type when in vertical mode.\n   *\n   * @attr vertical-animation\n   * @default 'grow'\n   */\n  @property({ attribute: 'vertical-animation' })\n  public verticalAnimation: StepperVerticalAnimation = 'grow';\n\n  /**\n   * The animation type when in horizontal mode.\n   *\n   * @attr horizontal-animation\n   * @default 'slide'\n   */\n  @property({ attribute: 'horizontal-animation' })\n  public horizontalAnimation: HorizontalTransitionAnimation = 'slide';\n\n  /**\n   * The animation duration in either vertical or horizontal mode in milliseconds.\n   *\n   * @attr animation-duration\n   * @default 320\n   */\n  @property({ type: Number, attribute: 'animation-duration' })\n  public animationDuration = 320;\n\n  /**\n   * The position of the steps title.\n   *\n   * @remarks\n   * When the stepper is horizontally orientated the title is positioned below the indicator.\n   * When the stepper is vertically orientated the title is positioned on the right side of the indicator.\n   *\n   * @attr title-position\n   * @default 'auto'\n   */\n  @property({ reflect: false, attribute: 'title-position' })\n  public titlePosition: StepperTitlePosition = 'auto';\n\n  //#endregion\n\n  constructor() {\n    super();\n\n    addSafeEventListener(this, 'click', this._handleInteraction);\n\n    addInternalsController(this, {\n      initialARIA: { role: 'tablist' },\n      aria: () => ({ ariaOrientation: this.orientation }),\n    });\n\n    const context = { stepper: this, state: this._state };\n\n    addContextProvider(this, {\n      context: STEPPER_CONTEXT,\n      watch: STEPPER_SYNC_PROPERTIES,\n      value: () => context,\n    });\n\n    addThemingController(this, {\n      light: { bootstrap, fluent, indigo },\n      dark: { bootstrap, fluent, indigo },\n    });\n\n    addRovingFocusController(this, {\n      keybindings: { skip: this._skipKeyboard },\n      items: () => this._state.accessibleSteps,\n      current: () => this._getActiveStepComponent(),\n      vertical: () => !this._isHorizontal,\n      focusItem: (step) => this._getStepHeader(step)?.focus(),\n      activateItem: (step) => this._activateStep(step),\n    });\n  }\n\n  //#region Lifecycle hooks\n\n  protected override update(properties: PropertyValues<this>): void {\n    if (properties.has('linear')) {\n      this._state.setVisitedState(this.linear);\n    }\n\n    if (\n      properties.has('horizontalAnimation') ||\n      properties.has('animationDuration')\n    ) {\n      const duration =\n        this.horizontalAnimation !== 'none' ? this.animationDuration : 0;\n\n      this.style.setProperty('--animation-duration', `${duration}ms`);\n    }\n\n    super.update(properties);\n  }\n\n  //#endregion\n\n  //#region Keyboard navigation handlers\n\n  private _skipKeyboard(_: Element, event: KeyboardEvent): boolean {\n    return !getElementFromPath('[data-step-header]', event);\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  private _handleInteraction(event: Event): void {\n    const step = getElementFromPath(IgcStepComponent.tagName, event);\n\n    if (step && this._state.isAccessible(step)) {\n      this._activateStep(step);\n    }\n  }\n\n  private _handleSlotChange(): void {\n    this._state.setSteps(\n      this._slots.getAssignedElements('[default]', {\n        selector: IgcStepComponent.tagName,\n      })\n    );\n\n    this._state.stepsChanged();\n    this.style.setProperty('--steps-count', this.steps.length.toString());\n  }\n\n  //#endregion\n\n  //#region Internal methods\n\n  private _animateSteps(\n    nextStep: IgcStepComponent,\n    currentStep: IgcStepComponent\n  ): void {\n    const steps = this._state.steps;\n\n    if (steps.indexOf(nextStep) > steps.indexOf(currentStep)) {\n      // Animate steps in ascending/next direction\n      currentStep.toggleAnimation('out');\n      nextStep.toggleAnimation('in');\n    } else {\n      // Animate steps in descending/previous direction\n      currentStep.toggleAnimation('in', 'reverse');\n      nextStep.toggleAnimation('out', 'reverse');\n    }\n  }\n\n  private _emitChanging(args: IgcActiveStepChangingEventArgs): boolean {\n    return this.emitEvent('igcActiveStepChanging', {\n      detail: args,\n      cancelable: true,\n    });\n  }\n\n  private _emitChanged(args: IgcActiveStepChangedEventArgs): void {\n    this.emitEvent('igcActiveStepChanged', {\n      detail: args,\n    });\n  }\n\n  private _activateStep(step: IgcStepComponent, shouldEmit = true): void {\n    if (step === this._state.activeStep) {\n      return;\n    }\n\n    if (!shouldEmit) {\n      this._state.changeActiveStep(step);\n      return;\n    }\n\n    const steps = this._state.steps;\n    const activeIndex = steps.indexOf(this._state.activeStep!);\n    const index = steps.indexOf(step);\n\n    const args = { oldIndex: activeIndex, newIndex: index };\n\n    if (!this._emitChanging(args)) {\n      return;\n    }\n\n    if (this._state.activeStep) {\n      this._animateSteps(step, this._state.activeStep);\n    }\n\n    this._state.changeActiveStep(step);\n    this._emitChanged({ index });\n  }\n\n  private _moveToNextStep(next = true): void {\n    const step = this._state.getAdjacentStep(next);\n\n    if (step) {\n      if (this._state.activeStep) {\n        this._animateSteps(step, this._state.activeStep);\n      }\n      this._state.changeActiveStep(step);\n    }\n  }\n\n  private _getActiveStepComponent(): IgcStepComponent | null {\n    const active = getRoot(this).activeElement;\n    return active ? active.closest(IgcStepComponent.tagName) : null;\n  }\n\n  private _getStepHeader(step?: IgcStepComponent): HTMLElement | null {\n    return step?.renderRoot.querySelector('[data-step-header]') ?? null;\n  }\n\n  //#endregion\n\n  //#region Public API\n\n  /** Activates the step at a given index. */\n  public navigateTo(index: number): void {\n    const step = this._state.steps[index];\n\n    if (step) {\n      this._activateStep(step, false);\n    }\n  }\n\n  /** Activates the next enabled step. */\n  public next(): void {\n    this._moveToNextStep();\n  }\n\n  /** Activates the previous enabled step. */\n  public prev(): void {\n    this._moveToNextStep(false);\n  }\n\n  /**\n   * Resets the stepper to its initial state, i.e. activates the first step.\n   *\n   * @remarks\n   * The steps' content will not be automatically reset.\n   */\n  public reset(): void {\n    this._state.reset();\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-stepper': IgcStepperComponent;\n  }\n}\n"]}

package/components/tabs/tab.d.ts

@@ -19,7 +19,7 @@ export default class IgcTabComponent extends LitElement {
     static readonly tagName = "igc-tab";
     static styles: import("lit").CSSResult[];
     static register(): void;
-    private readonly _instanceId;
+    private readonly _tabId;
     private readonly _headerId;
     private readonly _contentId;
     private _posInSet;

package/components/tabs/tab.js

@@ -7,11 +7,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, LitElement, nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
 import { registerComponent } from '#internals/definitions/register.js';
+import { createIdGenerator } from '#internals/utils/strings.js';
 import { addThemingController } from '#theming/theming-controller.js';
 import { styles as shared } from './themes/shared/tab/tab.common.css.js';
 import { all } from './themes/tab-themes.js';
 import { styles } from './themes/tab.base.css.js';
-let nextId = 1;
+const nextId = createIdGenerator('igc-tab');
 export default class IgcTabComponent extends LitElement {
     static { this.tagName = 'igc-tab'; }
     static { this.styles = [styles, shared]; }
@@ -20,9 +21,9 @@ export default class IgcTabComponent extends LitElement {
     }
     constructor() {
         super();
-        this._instanceId = nextId++;
-        this._headerId = `igc-tab-header-${this._instanceId}`;
-        this._contentId = `igc-tab-content-${this._instanceId}`;
+        this._tabId = nextId();
+        this._headerId = `${this._tabId}-header`;
+        this._contentId = `${this._tabId}-content`;
         this._posInSet = 0;
         this._setSize = 0;
         this._isTabStop = false;
@@ -33,7 +34,7 @@ export default class IgcTabComponent extends LitElement {
     }
     connectedCallback() {
         super.connectedCallback();
-        this.id = this.id || `igc-tab-${this._instanceId}`;
+        this.id = this.id || this._tabId;
     }
     _setTabState(posInSet, setSize, isTabStop) {
         this._posInSet = posInSet;

package/components/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/components/tabs/tab.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,IAAI,MAAM,GAAG,CAAC,CAAC;AAkBf,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,UAAU;aAC9B,YAAO,GAAG,SAAS,AAAZ,CAAa;aACpB,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC;IAkDD;QACE,KAAK,EAAE,CAAC;QA/CO,gBAAW,GAAG,MAAM,EAAE,CAAC;QACvB,cAAS,GAAG,kBAAkB,IAAI,CAAC,WAAW,EAAE,CAAC;QACjD,eAAU,GAAG,mBAAmB,IAAI,CAAC,WAAW,EAAE,CAAC;QAG5D,cAAS,GAAG,CAAC,CAAC;QAGd,aAAQ,GAAG,CAAC,CAAC;QAGb,eAAU,GAAG,KAAK,CAAC;QAWpB,UAAK,GAAG,EAAE,CAAC;QASX,aAAQ,GAAG,KAAK,CAAC;QASjB,aAAQ,GAAG,KAAK,CAAC;QAQtB,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAGe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,IAAI,WAAW,IAAI,CAAC,WAAW,EAAE,CAAC;IACrD,CAAC;IAaM,YAAY,CACjB,QAAgB,EAChB,OAAe,EACf,SAAkB;QAElB,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;QACxB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;IAC9B,CAAC;IAMkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;aAIF,IAAI,CAAC,SAAS;wBACH,IAAI,CAAC,QAAQ;wBACb,IAAI,CAAC,QAAQ;wBACb,IAAI,CAAC,UAAU;wBACf,IAAI,CAAC,SAAS,IAAI,OAAO;uBAC1B,IAAI,CAAC,QAAQ,IAAI,OAAO;mBAC5B,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;iCAK3B,IAAI,CAAC,KAAK;;;;;;;;aAQ9B,IAAI,CAAC,UAAU;0BACF,IAAI,CAAC,SAAS;mBACrB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBACxB,CAAC,IAAI,CAAC,QAAQ;;;;KAI1B,CAAC;IACJ,CAAC;;AA7GO;IADP,KAAK,EAAE;kDACc;AAGd;IADP,KAAK,EAAE;iDACa;AAGb;IADP,KAAK,EAAE;mDACmB;AAWpB;IADN,QAAQ,EAAE;8CACO;AASX;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AASjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB","sourcesContent":["import { html, LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport { styles as shared } from './themes/shared/tab/tab.common.css.js';\nimport { all } from './themes/tab-themes.js';\nimport { styles } from './themes/tab.base.css.js';\n\nlet nextId = 1;\n\n/**\n * A tab nested in a tabs component.\n *\n * @element igc-tab\n *\n * @slot - Renders the tab's content.\n * @slot label - Renders the tab header's label.\n * @slot prefix - Renders the tab header's prefix.\n * @slot suffix - Renders the tab header's suffix.\n *\n * @csspart tab-header - The header of a single tab.\n * @csspart prefix - Tab header's label prefix.\n * @csspart content - Tab header's label slot container.\n * @csspart suffix - Tab header's label suffix.\n * @csspart tab-body - Holds the body content of a single tab, only the body of the selected tab is visible.\n */\nexport default class IgcTabComponent extends LitElement {\n  public static readonly tagName = 'igc-tab';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcTabComponent);\n  }\n\n  //#region Internal state & properties\n\n  private readonly _instanceId = nextId++;\n  private readonly _headerId = `igc-tab-header-${this._instanceId}`;\n  private readonly _contentId = `igc-tab-content-${this._instanceId}`;\n\n  @state()\n  private _posInSet = 0;\n\n  @state()\n  private _setSize = 0;\n\n  @state()\n  private _isTabStop = false;\n\n  //#endregion\n\n  //#region Public properties\n\n  /**\n   * The tab item label.\n   * @attr label\n   */\n  @property()\n  public label = '';\n\n  /**\n   * Determines whether the tab is selected.\n   *\n   * @attr selected\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the tab is disabled.\n   *\n   * @attr disabled\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  /** @internal */\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.id = this.id || `igc-tab-${this._instanceId}`;\n  }\n\n  //#endregion\n\n  //#region Internal API\n\n  /**\n   * @hidden @internal\n   * Applied by the parent `igc-tabs` whenever the tab set or the selection changes.\n   *\n   * `isTabStop` drives the roving tabindex, keeping the tab strip reachable even\n   * when no tab is selected.\n   */\n  public _setTabState(\n    posInSet: number,\n    setSize: number,\n    isTabStop: boolean\n  ): void {\n    this._posInSet = posInSet;\n    this._setSize = setSize;\n    this._isTabStop = isTabStop;\n  }\n\n  //#endregion\n\n  //#region Render\n\n  protected override render(): TemplateResult {\n    return html`\n      <div\n        part=\"tab-header\"\n        role=\"tab\"\n        id=${this._headerId}\n        aria-disabled=${this.disabled}\n        aria-selected=${this.selected}\n        aria-controls=${this._contentId}\n        aria-posinset=${this._posInSet || nothing}\n        aria-setsize=${this._setSize || nothing}\n        tabindex=${this.selected || this._isTabStop ? 0 : -1}\n      >\n        <div part=\"base\">\n          <slot name=\"prefix\" part=\"prefix\"></slot>\n          <div part=\"content\">\n            <slot name=\"label\">${this.label}</slot>\n          </div>\n          <slot name=\"suffix\" part=\"suffix\"></slot>\n        </div>\n      </div>\n      <div\n        part=\"tab-body\"\n        role=\"tabpanel\"\n        id=${this._contentId}\n        aria-labelledby=${this._headerId}\n        tabindex=${this.selected ? 0 : -1}\n        .inert=${!this.selected}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab': IgcTabComponent;\n  }\n}\n"]}
+{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/components/tabs/tab.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,MAAM,MAAM,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;AAkB5C,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,UAAU;aAC9B,YAAO,GAAG,SAAS,AAAZ,CAAa;aACpB,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC;IAkDD;QACE,KAAK,EAAE,CAAC;QA/CO,WAAM,GAAG,MAAM,EAAE,CAAC;QAClB,cAAS,GAAG,GAAG,IAAI,CAAC,MAAM,SAAS,CAAC;QACpC,eAAU,GAAG,GAAG,IAAI,CAAC,MAAM,UAAU,CAAC;QAG/C,cAAS,GAAG,CAAC,CAAC;QAGd,aAAQ,GAAG,CAAC,CAAC;QAGb,eAAU,GAAG,KAAK,CAAC;QAWpB,UAAK,GAAG,EAAE,CAAC;QASX,aAAQ,GAAG,KAAK,CAAC;QASjB,aAAQ,GAAG,KAAK,CAAC;QAQtB,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAGe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,MAAM,CAAC;IACnC,CAAC;IAaM,YAAY,CACjB,QAAgB,EAChB,OAAe,EACf,SAAkB;QAElB,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;QACxB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;IAC9B,CAAC;IAMkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;aAIF,IAAI,CAAC,SAAS;wBACH,IAAI,CAAC,QAAQ;wBACb,IAAI,CAAC,QAAQ;wBACb,IAAI,CAAC,UAAU;wBACf,IAAI,CAAC,SAAS,IAAI,OAAO;uBAC1B,IAAI,CAAC,QAAQ,IAAI,OAAO;mBAC5B,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;iCAK3B,IAAI,CAAC,KAAK;;;;;;;;aAQ9B,IAAI,CAAC,UAAU;0BACF,IAAI,CAAC,SAAS;mBACrB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBACxB,CAAC,IAAI,CAAC,QAAQ;;;;KAI1B,CAAC;IACJ,CAAC;;AA7GO;IADP,KAAK,EAAE;kDACc;AAGd;IADP,KAAK,EAAE;iDACa;AAGb;IADP,KAAK,EAAE;mDACmB;AAWpB;IADN,QAAQ,EAAE;8CACO;AASX;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AASjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB","sourcesContent":["import { html, LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport { styles as shared } from './themes/shared/tab/tab.common.css.js';\nimport { all } from './themes/tab-themes.js';\nimport { styles } from './themes/tab.base.css.js';\n\nconst nextId = createIdGenerator('igc-tab');\n\n/**\n * A tab nested in a tabs component.\n *\n * @element igc-tab\n *\n * @slot - Renders the tab's content.\n * @slot label - Renders the tab header's label.\n * @slot prefix - Renders the tab header's prefix.\n * @slot suffix - Renders the tab header's suffix.\n *\n * @csspart tab-header - The header of a single tab.\n * @csspart prefix - Tab header's label prefix.\n * @csspart content - Tab header's label slot container.\n * @csspart suffix - Tab header's label suffix.\n * @csspart tab-body - Holds the body content of a single tab, only the body of the selected tab is visible.\n */\nexport default class IgcTabComponent extends LitElement {\n  public static readonly tagName = 'igc-tab';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcTabComponent);\n  }\n\n  //#region Internal state & properties\n\n  private readonly _tabId = nextId();\n  private readonly _headerId = `${this._tabId}-header`;\n  private readonly _contentId = `${this._tabId}-content`;\n\n  @state()\n  private _posInSet = 0;\n\n  @state()\n  private _setSize = 0;\n\n  @state()\n  private _isTabStop = false;\n\n  //#endregion\n\n  //#region Public properties\n\n  /**\n   * The tab item label.\n   * @attr label\n   */\n  @property()\n  public label = '';\n\n  /**\n   * Determines whether the tab is selected.\n   *\n   * @attr selected\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the tab is disabled.\n   *\n   * @attr disabled\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  /** @internal */\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.id = this.id || this._tabId;\n  }\n\n  //#endregion\n\n  //#region Internal API\n\n  /**\n   * @hidden @internal\n   * Applied by the parent `igc-tabs` whenever the tab set or the selection changes.\n   *\n   * `isTabStop` drives the roving tabindex, keeping the tab strip reachable even\n   * when no tab is selected.\n   */\n  public _setTabState(\n    posInSet: number,\n    setSize: number,\n    isTabStop: boolean\n  ): void {\n    this._posInSet = posInSet;\n    this._setSize = setSize;\n    this._isTabStop = isTabStop;\n  }\n\n  //#endregion\n\n  //#region Render\n\n  protected override render(): TemplateResult {\n    return html`\n      <div\n        part=\"tab-header\"\n        role=\"tab\"\n        id=${this._headerId}\n        aria-disabled=${this.disabled}\n        aria-selected=${this.selected}\n        aria-controls=${this._contentId}\n        aria-posinset=${this._posInSet || nothing}\n        aria-setsize=${this._setSize || nothing}\n        tabindex=${this.selected || this._isTabStop ? 0 : -1}\n      >\n        <div part=\"base\">\n          <slot name=\"prefix\" part=\"prefix\"></slot>\n          <div part=\"content\">\n            <slot name=\"label\">${this.label}</slot>\n          </div>\n          <slot name=\"suffix\" part=\"suffix\"></slot>\n        </div>\n      </div>\n      <div\n        part=\"tab-body\"\n        role=\"tabpanel\"\n        id=${this._contentId}\n        aria-labelledby=${this._headerId}\n        tabindex=${this.selected ? 0 : -1}\n        .inert=${!this.selected}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab': IgcTabComponent;\n  }\n}\n"]}

package/components/tabs/tabs.d.ts

@@ -67,7 +67,7 @@ export default class IgcTabsComponent extends IgcTabsComponent_base {
     private _handleAttributeChanges;
     private _handleTabsAdded;
     private _handleTabsRemoved;
-    private _getClosestActiveTabIndex;
+    private _getClosestActiveTab;
     /** A tab can be selected if it is a direct child of this component and is not disabled. */
     private _isSelectable;
     /** Pushes the ARIA set information and the roving tab stop down to the tab children. */
@@ -78,10 +78,6 @@ export default class IgcTabsComponent extends IgcTabsComponent_base {
     private _keyboardActivateTab;
     private _skipKeyboard;
     private _isEventFromTabHeader;
-    protected _handleArrowKeys(delta: -1 | 1): void;
-    protected _handleHomeKey(): void;
-    protected _handleEndKey(): void;
-    protected _handleActivationKeys(): void;
     protected _handleClick(event: PointerEvent): void;
     protected _handleScroll(): void;
     /**

package/components/tabs/tabs.js

@@ -10,16 +10,15 @@ import { cache } from 'lit/directives/cache.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { addInternalsController } from '#internals/controllers/internals.js';
-import { addKeybindings, arrowLeft, arrowRight, endKey, homeKey, } from '#internals/controllers/key-bindings.js';
 import { createMutationController, } from '#internals/controllers/mutation-observer.js';
 import { createResizeObserverController } from '#internals/controllers/resize-observer.js';
+import { addRovingFocusController } from '#internals/controllers/roving-focus.js';
 import { registerComponent } from '#internals/definitions/register.js';
 import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
 import { partMap } from '#internals/part-map.js';
-import { firstOf, isEmpty, lastOf } from '#internals/utils/arrays.js';
-import { getRoot, isLTR, scrollIntoView } from '#internals/utils/dom.js';
+import { firstOf, isEmpty } from '#internals/utils/arrays.js';
+import { getRoot, scrollIntoView } from '#internals/utils/dom.js';
 import { getElementFromPath } from '#internals/utils/events.js';
-import { wrap } from '#internals/utils/math.js';
 import { isString } from '#internals/utils/types.js';
 import { addThemingController } from '#theming/theming-controller.js';
 import IgcIconButtonComponent from '../button/icon-button.js';
@@ -66,16 +65,13 @@ export default class IgcTabsComponent extends EventEmitterMixin(LitElement) {
             reflectRole: true,
         });
         addThemingController(this, all);
-        addKeybindings(this, {
-            ref: this._headerRef,
-            skip: this._skipKeyboard,
-        })
-            .set(arrowLeft, () => this._handleArrowKeys(isLTR(this) ? -1 : 1))
-            .set(arrowRight, () => this._handleArrowKeys(isLTR(this) ? 1 : -1))
-            .set(homeKey, this._handleHomeKey)
-            .set(endKey, this._handleEndKey)
-            .setActivateHandler(this._handleActivationKeys, {
-            preventDefault: false,
+        addRovingFocusController(this, {
+            keybindings: { ref: this._headerRef, skip: this._skipKeyboard },
+            items: () => this._enabledTabs,
+            current: () => this._getClosestActiveTab(),
+            focusItem: (tab) => this._keyboardActivateTab(tab),
+            activateItem: (tab) => this._keyboardActivateTab(tab, true),
+            missingCurrent: 'wrap',
         });
         createMutationController(this, {
             callback: this._mutationCallback,
@@ -149,10 +145,8 @@ export default class IgcTabsComponent extends EventEmitterMixin(LitElement) {
             this._syncSelection(firstOf(this._enabledTabs));
         }
     }
-    _getClosestActiveTabIndex() {
-        const active = getRoot(this).activeElement;
-        const tab = active ? active.closest(IgcTabComponent.tagName) : null;
-        return tab ? this._enabledTabs.indexOf(tab) : -1;
+    _getClosestActiveTab() {
+        return (getRoot(this).activeElement?.closest(IgcTabComponent.tagName) ?? null);
     }
     _isSelectable(tab) {
         return tab != null && !tab.disabled && this._tabs.includes(tab);
@@ -206,22 +200,6 @@ export default class IgcTabsComponent extends EventEmitterMixin(LitElement) {
     _isEventFromTabHeader(event) {
         return Boolean(getElementFromPath('[part~="tab-header"]', event));
     }
-    _handleArrowKeys(delta) {
-        const tabs = this._enabledTabs;
-        this._keyboardActivateTab(tabs[wrap(0, tabs.length - 1, this._getClosestActiveTabIndex() + delta)]);
-    }
-    _handleHomeKey() {
-        this._keyboardActivateTab(firstOf(this._enabledTabs));
-    }
-    _handleEndKey() {
-        this._keyboardActivateTab(lastOf(this._enabledTabs));
-    }
-    _handleActivationKeys() {
-        const index = this._getClosestActiveTabIndex();
-        if (index > -1) {
-            this._keyboardActivateTab(this._enabledTabs[index], true);
-        }
-    }
     _handleClick(event) {
         if (!this._isEventFromTabHeader(event)) {
             return;

package/components/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  html,\n  LitElement,\n  nothing,\n  type PropertyValues,\n  type TemplateResult,\n} from 'lit';\nimport {\n  eventOptions,\n  property,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\n\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport {\n  addKeybindings,\n  arrowLeft,\n  arrowRight,\n  endKey,\n  homeKey,\n} from '#internals/controllers/key-bindings.js';\nimport {\n  createMutationController,\n  type MutationControllerParams,\n} from '#internals/controllers/mutation-observer.js';\nimport { createResizeObserverController } from '#internals/controllers/resize-observer.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { partMap } from '#internals/part-map.js';\nimport { firstOf, isEmpty, lastOf } from '#internals/utils/arrays.js';\nimport { getRoot, isLTR, scrollIntoView } from '#internals/utils/dom.js';\nimport { getElementFromPath } from '#internals/utils/events.js';\nimport { wrap } from '#internals/utils/math.js';\nimport { isString } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport type { TabsActivation, TabsAlignment } from '../types.js';\nimport { createTabHelpers, getTabHeader } from './tab-dom.js';\nimport IgcTabComponent from './tab.js';\nimport { styles as shared } from './themes/shared/tabs/tabs.common.css.js';\nimport { all } from './themes/tabs-themes.js';\nimport { styles } from './themes/tabs.base.css.js';\n\ntype TabSelectionOptions = {\n  /** The tab to select. Omitting it clears the current selection. */\n  tab?: IgcTabComponent;\n  shouldEmit?: boolean;\n  shouldScroll?: boolean;\n};\n\ntype TabMutations = MutationControllerParams<IgcTabComponent>['changes'];\n\nexport interface IgcTabsComponentEventMap {\n  igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/* blazorAdditionalDependency: IgcTabComponent */\n/**\n * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.\n *\n * The tabs component allows the user to navigate between multiple tab children.\n * It supports keyboard navigation and provides API methods to control the selected tab.\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the `IgcTabComponents` inside default slot.\n *\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart selected-indicator - The indicator that shows which tab is selected.\n */\nexport default class IgcTabsComponent extends EventEmitterMixin<\n  IgcTabsComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-tabs';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcTabsComponent,\n      IgcTabComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  //#region Private state & properties\n\n  private readonly _resizeController = createResizeObserverController(this, {\n    callback: this._refreshLayout,\n    options: { box: 'border-box' },\n    target: null,\n  });\n\n  /** The tabs container reference holding the tab headers. */\n  private readonly _headerRef = createRef<HTMLElement>();\n\n  /** The selected tab indicator reference.  */\n  private readonly _indicatorRef = createRef<HTMLElement>();\n\n  private readonly _domHelpers = createTabHelpers(\n    this,\n    this._headerRef,\n    this._indicatorRef\n  );\n\n  @queryAssignedElements({ selector: IgcTabComponent.tagName, flatten: true })\n  private _tabs!: IgcTabComponent[];\n\n  protected get _enabledTabs(): IgcTabComponent[] {\n    return this._tabs.filter((tab) => !tab.disabled);\n  }\n\n  private _activeTab?: IgcTabComponent;\n\n  //#endregion\n\n  //#region Public properties\n\n  /**\n   * Determines the alignment of the tabs header strip.\n   *\n   * @attr alignment\n   * @default 'start'\n   */\n  @property({ reflect: true })\n  public alignment: TabsAlignment = 'start';\n\n  /**\n   * Determines the activation behavior of the tabs.\n   *\n   * When set to 'auto', the tab will be selected when it receives focus.\n   * When set to 'manual', the tab will only be selected when it is clicked or activated with the keyboard.\n   *\n   * @attr activation\n   * @default 'auto'\n   */\n  @property()\n  public activation: TabsActivation = 'auto';\n\n  /* blazorSuppress */\n  /** Returns the direct tab children of this element. */\n  public get tabs(): IgcTabComponent[] {\n    return this._tabs;\n  }\n\n  /** Returns the currently selected tab label or IDREF if no label property is set. */\n  public get selected(): string {\n    if (this._activeTab) {\n      return this._activeTab.label || this._activeTab.id;\n    }\n\n    return '';\n  }\n\n  /* blazorSuppress */\n  /** Returns the currently selected tab, if any. */\n  public get selectedTab(): IgcTabComponent | null {\n    return this._activeTab ?? null;\n  }\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n\n    addInternalsController(this, {\n      initialARIA: { role: 'tablist', ariaOrientation: 'horizontal' },\n      reflectRole: true,\n    });\n\n    addThemingController(this, all);\n\n    addKeybindings(this, {\n      ref: this._headerRef,\n      skip: this._skipKeyboard,\n    })\n      .set(arrowLeft, () => this._handleArrowKeys(isLTR(this) ? -1 : 1))\n      .set(arrowRight, () => this._handleArrowKeys(isLTR(this) ? 1 : -1))\n      .set(homeKey, this._handleHomeKey)\n      .set(endKey, this._handleEndKey)\n      .setActivateHandler(this._handleActivationKeys, {\n        preventDefault: false,\n      });\n\n    createMutationController(this, {\n      callback: this._mutationCallback,\n      config: {\n        attributeFilter: ['selected', 'disabled'],\n        childList: true,\n        subtree: true,\n      },\n      filter: [IgcTabComponent.tagName],\n    });\n  }\n\n  protected override async firstUpdated(): Promise<void> {\n    await this.updateComplete;\n\n    const selectedTab =\n      this._tabs.findLast((tab) => tab.selected && !tab.disabled) ??\n      firstOf(this._enabledTabs);\n\n    this._updateLayout();\n    this._syncSelection(selectedTab);\n\n    this._resizeController.observe(this._headerRef.value!);\n  }\n\n  protected override update(props: PropertyValues<this>): void {\n    const directionChanged = this._domHelpers.checkAndUpdateDirection();\n\n    if (props.has('alignment') || directionChanged) {\n      this._domHelpers.setIndicator(this._activeTab);\n    }\n\n    super.update(props);\n  }\n\n  //#endregion\n\n  //#region Observers callbacks\n\n  private _updateLayout(): void {\n    this._domHelpers.setStyleProperties();\n    this._domHelpers.setScrollButtonState();\n  }\n\n  private _refreshLayout(): void {\n    this._updateLayout();\n    this._domHelpers.setIndicator(this._activeTab);\n  }\n\n  private _mutationCallback({\n    changes,\n  }: MutationControllerParams<IgcTabComponent>): void {\n    const structural = !isEmpty(changes.added) || !isEmpty(changes.removed);\n\n    this._handleAttributeChanges(changes);\n    this._handleTabsRemoved(changes);\n    this._handleTabsAdded(changes);\n\n    // Positions shift on any add/removal, including ones that leave the selection intact.\n    this._updateTabsState();\n\n    // Only a changed tab set moves the indicator on its own - selection changes\n    // reposition it through `_setSelectedTab`.\n    if (structural) {\n      this._refreshLayout();\n    } else {\n      this._updateLayout();\n    }\n  }\n\n  private _handleAttributeChanges(changes: TabMutations): void {\n    const own = changes.attributes.filter(({ node }) =>\n      this._tabs.includes(node)\n    );\n\n    if (isEmpty(own)) {\n      return;\n    }\n\n    const selected = own.findLast(\n      ({ node, attributeName }) => attributeName === 'selected' && node.selected\n    )?.node;\n\n    if (selected) {\n      // A tab turning selected takes over.\n      this._syncSelection(selected);\n    } else if (own.some(({ node }) => node === this._activeTab)) {\n      // The active tab was either deselected from the outside, which leaves the\n      // component without a selection, or disabled and has to hand over.\n      this._syncSelection(\n        this._activeTab?.disabled ? firstOf(this._enabledTabs) : undefined\n      );\n    }\n  }\n\n  private _handleTabsAdded(changes: TabMutations): void {\n    const added = changes.added.filter(({ node }) => this._tabs.includes(node));\n\n    if (isEmpty(added)) {\n      return;\n    }\n\n    // An added selected tab takes over, otherwise keep the current selection or\n    // recover from an empty one.\n    const selected = added.findLast(\n      ({ node }) => node.selected && this._isSelectable(node)\n    )?.node;\n\n    this._syncSelection(\n      selected ?? this._activeTab ?? firstOf(this._enabledTabs)\n    );\n  }\n\n  private _handleTabsRemoved(changes: TabMutations): void {\n    if (changes.removed.some(({ node }) => node === this._activeTab)) {\n      this._syncSelection(firstOf(this._enabledTabs));\n    }\n  }\n\n  //#endregion\n\n  //#region Private API\n\n  private _getClosestActiveTabIndex(): number {\n    const active = getRoot(this).activeElement;\n    const tab = active ? active.closest(IgcTabComponent.tagName) : null;\n    return tab ? this._enabledTabs.indexOf(tab) : -1;\n  }\n\n  /** A tab can be selected if it is a direct child of this component and is not disabled. */\n  private _isSelectable(tab?: IgcTabComponent): tab is IgcTabComponent {\n    return tab != null && !tab.disabled && this._tabs.includes(tab);\n  }\n\n  /** Pushes the ARIA set information and the roving tab stop down to the tab children. */\n  private _updateTabsState(): void {\n    const tabs = this._tabs;\n    const tabStop = this._activeTab ?? firstOf(this._enabledTabs);\n\n    for (const [index, tab] of tabs.entries()) {\n      tab._setTabState(index + 1, tabs.length, tab === tabStop);\n    }\n  }\n\n  /** Applies a selection driven by the DOM rather than by user interaction. */\n  private _syncSelection(tab?: IgcTabComponent): void {\n    this._setSelectedTab({ tab, shouldEmit: false, shouldScroll: false });\n  }\n\n  private _setSelectedTab(options: TabSelectionOptions): void {\n    const { tab, shouldEmit = true, shouldScroll = true } = options;\n\n    // An explicit `undefined` clears the selection, while a tab that cannot be\n    // selected leaves the current one in place.\n    const next =\n      tab === undefined || this._isSelectable(tab) ? tab : this._activeTab;\n    const changed = next !== this._activeTab;\n\n    // Runs on every pass so that tabs holding a stale `selected` state are reconciled.\n    for (const each of this._tabs) {\n      each.selected = each === next;\n    }\n\n    this._activeTab = next;\n    this._updateTabsState();\n\n    if (!changed) {\n      return;\n    }\n\n    if (next && shouldScroll) {\n      scrollIntoView(getTabHeader(next));\n    }\n\n    this._domHelpers.setIndicator(next);\n\n    if (next && shouldEmit) {\n      this.emitEvent('igcChange', { detail: next });\n    }\n  }\n\n  private _keyboardActivateTab(tab?: IgcTabComponent, activate = false): void {\n    if (!tab) {\n      return;\n    }\n\n    const header = getTabHeader(tab);\n\n    this._domHelpers.setScrollSnap();\n    scrollIntoView(header);\n    header?.focus({ preventScroll: true });\n\n    if (activate || this.activation === 'auto') {\n      this._setSelectedTab({ tab });\n    }\n  }\n\n  private _skipKeyboard(node: Element, event: KeyboardEvent): boolean {\n    return !(\n      this._isEventFromTabHeader(event) &&\n      this._tabs.includes(node.closest(IgcTabComponent.tagName)!)\n    );\n  }\n\n  private _isEventFromTabHeader(event: Event): boolean {\n    return Boolean(getElementFromPath('[part~=\"tab-header\"]', event));\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected _handleArrowKeys(delta: -1 | 1): void {\n    const tabs = this._enabledTabs;\n    this._keyboardActivateTab(\n      tabs[wrap(0, tabs.length - 1, this._getClosestActiveTabIndex() + delta)]\n    );\n  }\n\n  protected _handleHomeKey(): void {\n    this._keyboardActivateTab(firstOf(this._enabledTabs));\n  }\n\n  protected _handleEndKey(): void {\n    this._keyboardActivateTab(lastOf(this._enabledTabs));\n  }\n\n  protected _handleActivationKeys(): void {\n    const index = this._getClosestActiveTabIndex();\n\n    if (index > -1) {\n      this._keyboardActivateTab(this._enabledTabs[index], true);\n    }\n  }\n\n  protected _handleClick(event: PointerEvent): void {\n    if (!this._isEventFromTabHeader(event)) {\n      return;\n    }\n\n    const tab = getElementFromPath(IgcTabComponent.tagName, event);\n\n    if (!this._isSelectable(tab)) {\n      return;\n    }\n\n    this._domHelpers.setScrollSnap();\n    getTabHeader(tab)?.focus({ preventScroll: true });\n    this._setSelectedTab({ tab });\n  }\n\n  @eventOptions({ passive: true })\n  protected _handleScroll(): void {\n    this._domHelpers.setScrollButtonState();\n  }\n\n  //#endregion\n\n  //#region Public API methods\n\n  /**\n   * Selects the tab matching the passed IDREF or label and displays the corresponding panel.\n   *\n   * Disabled tabs and values not matching any tab are ignored.\n   */\n  public select(idOrLabel: string): void;\n  /* blazorSuppress (ref is reserved) */\n  public select(ref: IgcTabComponent): void;\n  /* blazorSuppress (ref is reserved) */\n  public select(ref: IgcTabComponent | string): void {\n    const tab = isString(ref)\n      ? this._tabs.find((each) => each.id === ref || each.label === ref)\n      : ref;\n\n    if (this._isSelectable(tab)) {\n      this._setSelectedTab({ tab, shouldEmit: false });\n    }\n  }\n\n  //#endregion\n\n  //#region Render\n\n  protected _renderScrollButton(direction: 'start' | 'end'): TemplateResult {\n    const isStart = direction === 'start';\n    const { start, end } = this._domHelpers.scrollButtonsDisabled;\n\n    return html`${cache(\n      this._domHelpers.hasScrollButtons\n        ? html`\n            <igc-icon-button\n              tabindex=\"-1\"\n              variant=\"flat\"\n              collection=\"default\"\n              part=\"${direction}-scroll-button\"\n              exportparts=\"icon\"\n              name=${isStart ? 'prev' : 'next'}\n              ?disabled=${isStart ? start : end}\n              @click=${() => this._domHelpers.scrollTabs(direction)}\n            >\n            </igc-icon-button>\n          `\n        : nothing\n    )}`;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n      <div\n        ${ref(this._headerRef)}\n        part=\"tabs\"\n        style=${styleMap(this._domHelpers.styleProperties)}\n        @scroll=${this._handleScroll}\n      >\n        <div\n          part=${partMap({\n            inner: true,\n            scrollable: this._domHelpers.hasScrollButtons,\n          })}\n        >\n          ${this._renderScrollButton('start')}\n          <slot @click=${this._handleClick}></slot>\n          ${this._renderScrollButton('end')}\n          <div part=\"selected-indicator\">\n            <span ${ref(this._indicatorRef)}></span>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tabs': IgcTabsComponent;\n  }\n}\n"]}
+{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  html,\n  LitElement,\n  nothing,\n  type PropertyValues,\n  type TemplateResult,\n} from 'lit';\nimport {\n  eventOptions,\n  property,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\n\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport {\n  createMutationController,\n  type MutationControllerParams,\n} from '#internals/controllers/mutation-observer.js';\nimport { createResizeObserverController } from '#internals/controllers/resize-observer.js';\nimport { addRovingFocusController } from '#internals/controllers/roving-focus.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { partMap } from '#internals/part-map.js';\nimport { firstOf, isEmpty } from '#internals/utils/arrays.js';\nimport { getRoot, scrollIntoView } from '#internals/utils/dom.js';\nimport { getElementFromPath } from '#internals/utils/events.js';\nimport { isString } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport type { TabsActivation, TabsAlignment } from '../types.js';\nimport { createTabHelpers, getTabHeader } from './tab-dom.js';\nimport IgcTabComponent from './tab.js';\nimport { styles as shared } from './themes/shared/tabs/tabs.common.css.js';\nimport { all } from './themes/tabs-themes.js';\nimport { styles } from './themes/tabs.base.css.js';\n\ntype TabSelectionOptions = {\n  /** The tab to select. Omitting it clears the current selection. */\n  tab?: IgcTabComponent;\n  shouldEmit?: boolean;\n  shouldScroll?: boolean;\n};\n\ntype TabMutations = MutationControllerParams<IgcTabComponent>['changes'];\n\nexport interface IgcTabsComponentEventMap {\n  igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/* blazorAdditionalDependency: IgcTabComponent */\n/**\n * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.\n *\n * The tabs component allows the user to navigate between multiple tab children.\n * It supports keyboard navigation and provides API methods to control the selected tab.\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the `IgcTabComponents` inside default slot.\n *\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart selected-indicator - The indicator that shows which tab is selected.\n */\nexport default class IgcTabsComponent extends EventEmitterMixin<\n  IgcTabsComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-tabs';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcTabsComponent,\n      IgcTabComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  //#region Private state & properties\n\n  private readonly _resizeController = createResizeObserverController(this, {\n    callback: this._refreshLayout,\n    options: { box: 'border-box' },\n    target: null,\n  });\n\n  /** The tabs container reference holding the tab headers. */\n  private readonly _headerRef = createRef<HTMLElement>();\n\n  /** The selected tab indicator reference.  */\n  private readonly _indicatorRef = createRef<HTMLElement>();\n\n  private readonly _domHelpers = createTabHelpers(\n    this,\n    this._headerRef,\n    this._indicatorRef\n  );\n\n  @queryAssignedElements({ selector: IgcTabComponent.tagName, flatten: true })\n  private _tabs!: IgcTabComponent[];\n\n  protected get _enabledTabs(): IgcTabComponent[] {\n    return this._tabs.filter((tab) => !tab.disabled);\n  }\n\n  private _activeTab?: IgcTabComponent;\n\n  //#endregion\n\n  //#region Public properties\n\n  /**\n   * Determines the alignment of the tabs header strip.\n   *\n   * @attr alignment\n   * @default 'start'\n   */\n  @property({ reflect: true })\n  public alignment: TabsAlignment = 'start';\n\n  /**\n   * Determines the activation behavior of the tabs.\n   *\n   * When set to 'auto', the tab will be selected when it receives focus.\n   * When set to 'manual', the tab will only be selected when it is clicked or activated with the keyboard.\n   *\n   * @attr activation\n   * @default 'auto'\n   */\n  @property()\n  public activation: TabsActivation = 'auto';\n\n  /* blazorSuppress */\n  /** Returns the direct tab children of this element. */\n  public get tabs(): IgcTabComponent[] {\n    return this._tabs;\n  }\n\n  /** Returns the currently selected tab label or IDREF if no label property is set. */\n  public get selected(): string {\n    if (this._activeTab) {\n      return this._activeTab.label || this._activeTab.id;\n    }\n\n    return '';\n  }\n\n  /* blazorSuppress */\n  /** Returns the currently selected tab, if any. */\n  public get selectedTab(): IgcTabComponent | null {\n    return this._activeTab ?? null;\n  }\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n\n    addInternalsController(this, {\n      initialARIA: { role: 'tablist', ariaOrientation: 'horizontal' },\n      reflectRole: true,\n    });\n\n    addThemingController(this, all);\n\n    addRovingFocusController(this, {\n      keybindings: { ref: this._headerRef, skip: this._skipKeyboard },\n      items: () => this._enabledTabs,\n      current: () => this._getClosestActiveTab(),\n      focusItem: (tab) => this._keyboardActivateTab(tab),\n      activateItem: (tab) => this._keyboardActivateTab(tab, true),\n      missingCurrent: 'wrap',\n    });\n\n    createMutationController(this, {\n      callback: this._mutationCallback,\n      config: {\n        attributeFilter: ['selected', 'disabled'],\n        childList: true,\n        subtree: true,\n      },\n      filter: [IgcTabComponent.tagName],\n    });\n  }\n\n  protected override async firstUpdated(): Promise<void> {\n    await this.updateComplete;\n\n    const selectedTab =\n      this._tabs.findLast((tab) => tab.selected && !tab.disabled) ??\n      firstOf(this._enabledTabs);\n\n    this._updateLayout();\n    this._syncSelection(selectedTab);\n\n    this._resizeController.observe(this._headerRef.value!);\n  }\n\n  protected override update(props: PropertyValues<this>): void {\n    const directionChanged = this._domHelpers.checkAndUpdateDirection();\n\n    if (props.has('alignment') || directionChanged) {\n      this._domHelpers.setIndicator(this._activeTab);\n    }\n\n    super.update(props);\n  }\n\n  //#endregion\n\n  //#region Observers callbacks\n\n  private _updateLayout(): void {\n    this._domHelpers.setStyleProperties();\n    this._domHelpers.setScrollButtonState();\n  }\n\n  private _refreshLayout(): void {\n    this._updateLayout();\n    this._domHelpers.setIndicator(this._activeTab);\n  }\n\n  private _mutationCallback({\n    changes,\n  }: MutationControllerParams<IgcTabComponent>): void {\n    const structural = !isEmpty(changes.added) || !isEmpty(changes.removed);\n\n    this._handleAttributeChanges(changes);\n    this._handleTabsRemoved(changes);\n    this._handleTabsAdded(changes);\n\n    // Positions shift on any add/removal, including ones that leave the selection intact.\n    this._updateTabsState();\n\n    // Only a changed tab set moves the indicator on its own - selection changes\n    // reposition it through `_setSelectedTab`.\n    if (structural) {\n      this._refreshLayout();\n    } else {\n      this._updateLayout();\n    }\n  }\n\n  private _handleAttributeChanges(changes: TabMutations): void {\n    const own = changes.attributes.filter(({ node }) =>\n      this._tabs.includes(node)\n    );\n\n    if (isEmpty(own)) {\n      return;\n    }\n\n    const selected = own.findLast(\n      ({ node, attributeName }) => attributeName === 'selected' && node.selected\n    )?.node;\n\n    if (selected) {\n      // A tab turning selected takes over.\n      this._syncSelection(selected);\n    } else if (own.some(({ node }) => node === this._activeTab)) {\n      // The active tab was either deselected from the outside, which leaves the\n      // component without a selection, or disabled and has to hand over.\n      this._syncSelection(\n        this._activeTab?.disabled ? firstOf(this._enabledTabs) : undefined\n      );\n    }\n  }\n\n  private _handleTabsAdded(changes: TabMutations): void {\n    const added = changes.added.filter(({ node }) => this._tabs.includes(node));\n\n    if (isEmpty(added)) {\n      return;\n    }\n\n    // An added selected tab takes over, otherwise keep the current selection or\n    // recover from an empty one.\n    const selected = added.findLast(\n      ({ node }) => node.selected && this._isSelectable(node)\n    )?.node;\n\n    this._syncSelection(\n      selected ?? this._activeTab ?? firstOf(this._enabledTabs)\n    );\n  }\n\n  private _handleTabsRemoved(changes: TabMutations): void {\n    if (changes.removed.some(({ node }) => node === this._activeTab)) {\n      this._syncSelection(firstOf(this._enabledTabs));\n    }\n  }\n\n  //#endregion\n\n  //#region Private API\n\n  private _getClosestActiveTab(): IgcTabComponent | null {\n    return (\n      getRoot(this).activeElement?.closest(IgcTabComponent.tagName) ?? null\n    );\n  }\n\n  /** A tab can be selected if it is a direct child of this component and is not disabled. */\n  private _isSelectable(tab?: IgcTabComponent): tab is IgcTabComponent {\n    return tab != null && !tab.disabled && this._tabs.includes(tab);\n  }\n\n  /** Pushes the ARIA set information and the roving tab stop down to the tab children. */\n  private _updateTabsState(): void {\n    const tabs = this._tabs;\n    const tabStop = this._activeTab ?? firstOf(this._enabledTabs);\n\n    for (const [index, tab] of tabs.entries()) {\n      tab._setTabState(index + 1, tabs.length, tab === tabStop);\n    }\n  }\n\n  /** Applies a selection driven by the DOM rather than by user interaction. */\n  private _syncSelection(tab?: IgcTabComponent): void {\n    this._setSelectedTab({ tab, shouldEmit: false, shouldScroll: false });\n  }\n\n  private _setSelectedTab(options: TabSelectionOptions): void {\n    const { tab, shouldEmit = true, shouldScroll = true } = options;\n\n    // An explicit `undefined` clears the selection, while a tab that cannot be\n    // selected leaves the current one in place.\n    const next =\n      tab === undefined || this._isSelectable(tab) ? tab : this._activeTab;\n    const changed = next !== this._activeTab;\n\n    // Runs on every pass so that tabs holding a stale `selected` state are reconciled.\n    for (const each of this._tabs) {\n      each.selected = each === next;\n    }\n\n    this._activeTab = next;\n    this._updateTabsState();\n\n    if (!changed) {\n      return;\n    }\n\n    if (next && shouldScroll) {\n      scrollIntoView(getTabHeader(next));\n    }\n\n    this._domHelpers.setIndicator(next);\n\n    if (next && shouldEmit) {\n      this.emitEvent('igcChange', { detail: next });\n    }\n  }\n\n  private _keyboardActivateTab(tab?: IgcTabComponent, activate = false): void {\n    if (!tab) {\n      return;\n    }\n\n    const header = getTabHeader(tab);\n\n    this._domHelpers.setScrollSnap();\n    scrollIntoView(header);\n    header?.focus({ preventScroll: true });\n\n    if (activate || this.activation === 'auto') {\n      this._setSelectedTab({ tab });\n    }\n  }\n\n  private _skipKeyboard(node: Element, event: KeyboardEvent): boolean {\n    return !(\n      this._isEventFromTabHeader(event) &&\n      this._tabs.includes(node.closest(IgcTabComponent.tagName)!)\n    );\n  }\n\n  private _isEventFromTabHeader(event: Event): boolean {\n    return Boolean(getElementFromPath('[part~=\"tab-header\"]', event));\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected _handleClick(event: PointerEvent): void {\n    if (!this._isEventFromTabHeader(event)) {\n      return;\n    }\n\n    const tab = getElementFromPath(IgcTabComponent.tagName, event);\n\n    if (!this._isSelectable(tab)) {\n      return;\n    }\n\n    this._domHelpers.setScrollSnap();\n    getTabHeader(tab)?.focus({ preventScroll: true });\n    this._setSelectedTab({ tab });\n  }\n\n  @eventOptions({ passive: true })\n  protected _handleScroll(): void {\n    this._domHelpers.setScrollButtonState();\n  }\n\n  //#endregion\n\n  //#region Public API methods\n\n  /**\n   * Selects the tab matching the passed IDREF or label and displays the corresponding panel.\n   *\n   * Disabled tabs and values not matching any tab are ignored.\n   */\n  public select(idOrLabel: string): void;\n  /* blazorSuppress (ref is reserved) */\n  public select(ref: IgcTabComponent): void;\n  /* blazorSuppress (ref is reserved) */\n  public select(ref: IgcTabComponent | string): void {\n    const tab = isString(ref)\n      ? this._tabs.find((each) => each.id === ref || each.label === ref)\n      : ref;\n\n    if (this._isSelectable(tab)) {\n      this._setSelectedTab({ tab, shouldEmit: false });\n    }\n  }\n\n  //#endregion\n\n  //#region Render\n\n  protected _renderScrollButton(direction: 'start' | 'end'): TemplateResult {\n    const isStart = direction === 'start';\n    const { start, end } = this._domHelpers.scrollButtonsDisabled;\n\n    return html`${cache(\n      this._domHelpers.hasScrollButtons\n        ? html`\n            <igc-icon-button\n              tabindex=\"-1\"\n              variant=\"flat\"\n              collection=\"default\"\n              part=\"${direction}-scroll-button\"\n              exportparts=\"icon\"\n              name=${isStart ? 'prev' : 'next'}\n              ?disabled=${isStart ? start : end}\n              @click=${() => this._domHelpers.scrollTabs(direction)}\n            >\n            </igc-icon-button>\n          `\n        : nothing\n    )}`;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n      <div\n        ${ref(this._headerRef)}\n        part=\"tabs\"\n        style=${styleMap(this._domHelpers.styleProperties)}\n        @scroll=${this._handleScroll}\n      >\n        <div\n          part=${partMap({\n            inner: true,\n            scrollable: this._domHelpers.hasScrollButtons,\n          })}\n        >\n          ${this._renderScrollButton('start')}\n          <slot @click=${this._handleClick}></slot>\n          ${this._renderScrollButton('end')}\n          <div part=\"selected-indicator\">\n            <span ${ref(this._indicatorRef)}></span>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tabs': IgcTabsComponent;\n  }\n}\n"]}

package/components/textarea/textarea.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, nothing, type PropertyValues, type TemplateResult } from 'lit';
+import { LitElement, nothing, type PropertyValues } from 'lit';
 import { type InferSlotNames } from '#internals/controllers/slot.js';
 import type { Constructor } from '#internals/mixins/constructor.js';
 import type { RangeTextSelectMode, SelectionRangeDirection, TextareaResize } from '../types.js';
@@ -176,12 +176,11 @@ export default class IgcTextareaComponent extends IgcTextareaComponent_base {
     setRangeText(replacement: string, start: number, end: number, selectMode?: RangeTextSelectMode): void;
     scrollTo(options?: ScrollToOptions | undefined): void;
     scrollTo(x: number, y: number): void;
-    protected _renderSlot(name: InferSlotNames<typeof Slots>): TemplateResult<1>;
-    protected _renderLabel(): TemplateResult<1> | typeof nothing;
-    protected _renderStandard(): TemplateResult<1>;
-    protected _renderMaterial(): TemplateResult<1>;
-    protected _renderInput(): TemplateResult<1>;
-    protected _renderValidationContainer(): TemplateResult;
+    protected _renderSlot(name: InferSlotNames<typeof Slots>): import("lit-html").TemplateResult<1>;
+    protected _renderLabel(): typeof nothing | import("lit-html").TemplateResult<1>;
+    protected _renderStandard(): import("lit-html").TemplateResult<1>;
+    protected _renderMaterial(): import("lit-html").TemplateResult<1>;
+    protected _renderInput(): import("lit-html").TemplateResult<1>;
     protected render(): import("lit-html/directive.js").DirectiveResult<typeof import("lit-html/directives/cache.js").CacheDirective>;
 }
 declare global {