igniteui-webcomponents 4.0.0 → 4.1.0

package/components/stepper/stepper.js

@@ -0,0 +1,345 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement } from 'lit';
+import { property, queryAssignedElements } from 'lit/decorators.js';
+import { defineComponents } from '../common/definitions/defineComponents.js';
+import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
+import { SizableMixin } from '../common/mixins/sizable.js';
+import IgcStepComponent from './step.js';
+import { themes } from '../../theming/theming-decorator.js';
+import { styles } from './themes/stepper/stepper.base.css.js';
+import { styles as bootstrap } from './themes/stepper/stepper.bootstrap.css.js';
+import { styles as fluent } from './themes/stepper/stepper.fluent.css.js';
+import { styles as indigo } from './themes/stepper/stepper.indigo.css.js';
+import { watch } from '../common/decorators/watch.js';
+defineComponents(IgcStepComponent);
+let IgcStepperComponent = class IgcStepperComponent extends SizableMixin(EventEmitterMixin(LitElement)) {
+    orientationChange() {
+        this.setAttribute('aria-orientation', this.orientation);
+        this.steps.forEach((step) => (step.orientation = this.orientation));
+    }
+    stepTypeChange() {
+        this.steps.forEach((step) => (step.stepType = this.stepType));
+    }
+    titlePositionChange() {
+        this.steps.forEach((step) => (step.titlePosition = this.titlePosition));
+    }
+    contentTopChange() {
+        this.steps.forEach((step) => (step.contentTop = this.contentTop));
+    }
+    linearChange() {
+        this.steps.forEach((step) => {
+            step.linearDisabled = this.linear;
+            if (step.index <= this.activeStep.index) {
+                step.visited = true;
+            }
+            else {
+                step.visited = false;
+            }
+        });
+        if (this.linear) {
+            this.updateStepsLinearDisabled();
+        }
+    }
+    constructor() {
+        super();
+        this.keyDownHandlers = new Map(Object.entries({
+            Enter: this.activateStep,
+            Space: this.activateStep,
+            SpaceBar: this.activateStep,
+            ' ': this.activateStep,
+            ArrowUp: this.onArrowUpKeyDown,
+            ArrowDown: this.onArrowDownKeyDown,
+            ArrowLeft: this.onArrowLeftKeyDown,
+            ArrowRight: this.onArrowRightKeyDown,
+            Home: this.onHomeKey,
+            End: this.onEndKey,
+        }));
+        this.orientation = 'horizontal';
+        this.stepType = 'full';
+        this.linear = false;
+        this.contentTop = false;
+        this.dir = 'auto';
+        this.addEventListener('stepActiveChanged', (event) => {
+            event.stopPropagation();
+            this.activateStep(event.target, event.detail);
+        });
+        this.addEventListener('stepDisabledInvalidChanged', (event) => {
+            event.stopPropagation();
+            if (this.linear) {
+                this.updateStepsLinearDisabled();
+            }
+        });
+        this.addEventListener('stepCompleteChanged', (event) => {
+            event.stopPropagation();
+            const nextStep = this.steps[event.target.index + 1];
+            if (nextStep) {
+                nextStep.previousComplete = event.target.complete;
+            }
+        });
+        this.addEventListener('stepHeaderKeydown', (event) => {
+            event.stopPropagation();
+            this.handleKeydown(event.detail.event, event.detail.focusedStep);
+        });
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'tablist');
+        this.setAttribute('aria-orientation', this.orientation);
+    }
+    activateFirstStep() {
+        const firstEnabledStep = this.steps.find((s) => !s.disabled);
+        if (firstEnabledStep) {
+            this.activateStep(firstEnabledStep, false);
+        }
+    }
+    activateStep(step, shouldEmit = true) {
+        if (step === this.activeStep) {
+            return;
+        }
+        if (shouldEmit) {
+            const args = {
+                detail: {
+                    owner: this,
+                    oldIndex: this.activeStep.index,
+                    newIndex: step.index,
+                },
+                cancelable: true,
+            };
+            const allowed = this.emitEvent('igcActiveStepChanging', args);
+            if (!allowed) {
+                return;
+            }
+            this.changeActiveStep(step);
+            this.emitEvent('igcActiveStepChanged', {
+                detail: { owner: this, index: step.index },
+            });
+        }
+        else {
+            this.changeActiveStep(step);
+        }
+    }
+    changeActiveStep(step) {
+        if (this.activeStep) {
+            this.activeStep.active = false;
+        }
+        step.active = true;
+        step.visited = true;
+        this.activeStep = step;
+    }
+    moveToNextStep(next = true) {
+        let steps = this.steps;
+        let activeStepIndex = this.activeStep.index;
+        if (!next) {
+            steps = this.steps.reverse();
+            activeStepIndex = steps.findIndex((step) => step === this.activeStep);
+        }
+        const nextStep = steps.find((step, i) => i > activeStepIndex && step.isAccessible);
+        if (nextStep) {
+            this.activateStep(nextStep, false);
+        }
+    }
+    handleKeydown(event, focusedStep) {
+        var _a;
+        const key = event.key.toLowerCase();
+        if (this.keyDownHandlers.has(event.key)) {
+            event.preventDefault();
+            (_a = this.keyDownHandlers.get(event.key)) === null || _a === void 0 ? void 0 : _a.call(this, focusedStep);
+        }
+        if (key === 'tab' && this.orientation === 'vertical') {
+            return;
+        }
+        if (key === 'tab' && this.activeStep.index !== focusedStep.index) {
+            this.activeStep.header.focus();
+        }
+    }
+    onHomeKey() {
+        var _a, _b;
+        (_b = (_a = this.steps
+            .filter((step) => step.isAccessible)[0]) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+    }
+    onEndKey() {
+        var _a, _b;
+        (_b = (_a = this.steps
+            .filter((step) => step.isAccessible)
+            .pop()) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+    }
+    onArrowDownKeyDown(focusedStep) {
+        var _a, _b;
+        if (this.orientation === 'horizontal') {
+            return;
+        }
+        (_b = (_a = this.getNextStep(focusedStep)) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+    }
+    onArrowUpKeyDown(focusedStep) {
+        var _a, _b;
+        if (this.orientation === 'horizontal') {
+            return;
+        }
+        (_b = (_a = this.getPreviousStep(focusedStep)) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+    }
+    onArrowRightKeyDown(focusedStep) {
+        var _a, _b, _c, _d;
+        if (this.dir === 'rtl' && this.orientation === 'horizontal') {
+            (_b = (_a = this.getPreviousStep(focusedStep)) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+        else {
+            (_d = (_c = this.getNextStep(focusedStep)) === null || _c === void 0 ? void 0 : _c.header) === null || _d === void 0 ? void 0 : _d.focus();
+        }
+    }
+    onArrowLeftKeyDown(focusedStep) {
+        var _a, _b, _c, _d;
+        if (this.dir === 'rtl' && this.orientation === 'horizontal') {
+            (_b = (_a = this.getNextStep(focusedStep)) === null || _a === void 0 ? void 0 : _a.header) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+        else {
+            (_d = (_c = this.getPreviousStep(focusedStep)) === null || _c === void 0 ? void 0 : _c.header) === null || _d === void 0 ? void 0 : _d.focus();
+        }
+    }
+    getNextStep(focusedStep) {
+        if (focusedStep.index === this.steps.length - 1) {
+            return this.steps.find((step) => step.isAccessible);
+        }
+        const nextAccessible = this.steps.find((step, i) => i > focusedStep.index && step.isAccessible);
+        return nextAccessible
+            ? nextAccessible
+            : this.steps.find((step) => step.isAccessible);
+    }
+    getPreviousStep(focusedStep) {
+        if (focusedStep.index === 0) {
+            return this.steps
+                .filter((step) => step.isAccessible)
+                .pop();
+        }
+        let prevStep;
+        for (let i = focusedStep.index - 1; i >= 0; i--) {
+            const step = this.steps[i];
+            if (step.isAccessible) {
+                prevStep = step;
+                break;
+            }
+        }
+        return prevStep
+            ? prevStep
+            : this.steps.filter((step) => step.isAccessible).pop();
+    }
+    updateStepsLinearDisabled() {
+        const firstInvalidStep = this.steps
+            .filter((step) => !step.disabled && !step.optional)
+            .find((step) => step.invalid);
+        if (firstInvalidStep) {
+            this.steps.forEach((step) => {
+                if (step.index <= firstInvalidStep.index) {
+                    step.linearDisabled = false;
+                }
+                else {
+                    step.linearDisabled = true;
+                }
+            });
+        }
+        else {
+            this.steps.forEach((step) => (step.linearDisabled = false));
+        }
+    }
+    syncProperties() {
+        this.steps.forEach((step, index) => {
+            var _a, _b, _c, _d;
+            step.orientation = this.orientation;
+            step.stepType = this.stepType;
+            step.titlePosition = this.titlePosition;
+            step.contentTop = this.contentTop;
+            step.index = index;
+            step.active = this.activeStep === step;
+            (_a = step.header) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-posinset', (index + 1).toString());
+            (_b = step.header) === null || _b === void 0 ? void 0 : _b.setAttribute('aria-setsize', this.steps.length.toString());
+            (_c = step.header) === null || _c === void 0 ? void 0 : _c.setAttribute('id', `igc-step-header-${index}`);
+            (_d = step.header) === null || _d === void 0 ? void 0 : _d.setAttribute('aria-controls', `igc-step-content-${index}`);
+            if (index > 0) {
+                step.previousComplete = this.steps[index - 1].complete;
+            }
+        });
+    }
+    stepsChanged() {
+        this.style.setProperty('--steps-count', this.steps.length.toString());
+        const lastActiveStep = this.steps
+            .reverse()
+            .find((step) => step.active);
+        if (!lastActiveStep) {
+            this.activateFirstStep();
+        }
+        else {
+            this.activateStep(lastActiveStep, false);
+        }
+        this.syncProperties();
+        if (this.linear) {
+            this.updateStepsLinearDisabled();
+        }
+    }
+    navigateTo(index) {
+        const step = this.steps[index];
+        if (!step) {
+            return;
+        }
+        this.activateStep(step, false);
+    }
+    next() {
+        this.moveToNextStep();
+    }
+    prev() {
+        this.moveToNextStep(false);
+    }
+    reset() {
+        this.steps.forEach((step) => (step.visited = false));
+        this.activateFirstStep();
+    }
+    render() {
+        return html `<slot @slotchange=${this.stepsChanged}></slot>`;
+    }
+};
+IgcStepperComponent.tagName = 'igc-stepper';
+IgcStepperComponent.styles = styles;
+__decorate([
+    queryAssignedElements({ selector: 'igc-step' })
+], IgcStepperComponent.prototype, "steps", void 0);
+__decorate([
+    property({ reflect: true })
+], IgcStepperComponent.prototype, "orientation", void 0);
+__decorate([
+    property({ reflect: true, attribute: 'step-type' })
+], IgcStepperComponent.prototype, "stepType", void 0);
+__decorate([
+    property({ type: Boolean })
+], IgcStepperComponent.prototype, "linear", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean, attribute: 'content-top' })
+], IgcStepperComponent.prototype, "contentTop", void 0);
+__decorate([
+    property({ reflect: true })
+], IgcStepperComponent.prototype, "dir", void 0);
+__decorate([
+    property({ reflect: false, attribute: 'title-position' })
+], IgcStepperComponent.prototype, "titlePosition", void 0);
+__decorate([
+    watch('orientation', { waitUntilFirstUpdate: true })
+], IgcStepperComponent.prototype, "orientationChange", null);
+__decorate([
+    watch('stepType', { waitUntilFirstUpdate: true })
+], IgcStepperComponent.prototype, "stepTypeChange", null);
+__decorate([
+    watch('titlePosition', { waitUntilFirstUpdate: true })
+], IgcStepperComponent.prototype, "titlePositionChange", null);
+__decorate([
+    watch('contentTop', { waitUntilFirstUpdate: true })
+], IgcStepperComponent.prototype, "contentTopChange", null);
+__decorate([
+    watch('linear', { waitUntilFirstUpdate: true })
+], IgcStepperComponent.prototype, "linearChange", null);
+IgcStepperComponent = __decorate([
+    themes({ bootstrap, fluent, indigo })
+], IgcStepperComponent);
+export default IgcStepperComponent;
+//# sourceMappingURL=stepper.js.map

package/components/stepper/stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { SizableMixin } from '../common/mixins/sizable.js';\nimport { IgcStepperEventMap } from './stepper.common.js';\nimport IgcStepComponent from './step.js';\nimport { Direction } from '../common/types.js';\nimport { themes } from '../../theming/theming-decorator.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';\nimport { watch } from '../common/decorators/watch.js';\n\ndefineComponents(IgcStepComponent);\n\n/**\n * IgxStepper 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 steps.\n * It supports horizontal and vertical orientation as well as keyboard navigation and provides API methods to control the active step.\n *\n * @element igc-stepper\n *\n * @slot - Renders the step components inside default slot.\n *\n * @fires igcActiveStepChanging - Emitted when the active step is about to change.\n * @fires igcActiveStepChanged - Emitted when the active step is changed.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcStepperComponent extends SizableMixin(\n  EventEmitterMixin<IgcStepperEventMap, Constructor<LitElement>>(LitElement)\n) {\n  /** @private */\n  public static readonly tagName = 'igc-stepper';\n  /** @private */\n  protected static styles = styles;\n\n  private readonly keyDownHandlers: Map<string, Function> = new Map(\n    Object.entries({\n      Enter: this.activateStep,\n      Space: this.activateStep,\n      SpaceBar: this.activateStep,\n      ' ': this.activateStep,\n      ArrowUp: this.onArrowUpKeyDown,\n      ArrowDown: this.onArrowDownKeyDown,\n      ArrowLeft: this.onArrowLeftKeyDown,\n      ArrowRight: this.onArrowRightKeyDown,\n      Home: this.onHomeKey,\n      End: this.onEndKey,\n    })\n  );\n\n  private activeStep!: IgcStepComponent;\n\n  /** Returns all of the stepper's steps. */\n  @queryAssignedElements({ selector: 'igc-step' })\n  public steps!: Array<IgcStepComponent>;\n\n  /** Gets/Sets the orientation of the stepper.\n   *\n   * @remarks\n   * Default value is `horizontal`.\n   */\n  @property({ reflect: true })\n  public orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n  /** Get/Set the type of the steps.\n   *\n   * @remarks\n   * Default value is `full`.\n   */\n  @property({ reflect: true, attribute: 'step-type' })\n  public stepType: 'indicator' | 'title' | 'full' = 'full';\n\n  /**\n   * Get/Set 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  @property({ type: Boolean })\n  public linear = false;\n\n  /**\n   * Get/Set whether the content is displayed above the steps.\n   *\n   * @remarks\n   * Default value is `false` and the content is below the steps.\n   */\n  @property({ reflect: true, type: Boolean, attribute: 'content-top' })\n  public contentTop = false;\n\n  /** The direction attribute of the control. */\n  @property({ reflect: true })\n  public override dir: Direction = 'auto';\n\n  /**\n   * Get/Set the position of the steps title.\n   *\n   * @remarks\n   * The default value is undefined.\n   * When the stepper is horizontally orientated the title is positioned below the indicator.\n   * When the stepper is horizontally orientated the title is positioned on the right side of the indicator.\n   */\n  @property({ reflect: false, attribute: 'title-position' })\n  public titlePosition?: 'bottom' | 'top' | 'end' | 'start';\n\n  @watch('orientation', { waitUntilFirstUpdate: true })\n  protected orientationChange(): void {\n    this.setAttribute('aria-orientation', this.orientation);\n    this.steps.forEach(\n      (step: IgcStepComponent) => (step.orientation = this.orientation)\n    );\n  }\n\n  @watch('stepType', { waitUntilFirstUpdate: true })\n  protected stepTypeChange(): void {\n    this.steps.forEach(\n      (step: IgcStepComponent) => (step.stepType = this.stepType)\n    );\n  }\n\n  @watch('titlePosition', { waitUntilFirstUpdate: true })\n  protected titlePositionChange(): void {\n    this.steps.forEach(\n      (step: IgcStepComponent) => (step.titlePosition = this.titlePosition)\n    );\n  }\n\n  @watch('contentTop', { waitUntilFirstUpdate: true })\n  protected contentTopChange(): void {\n    this.steps.forEach(\n      (step: IgcStepComponent) => (step.contentTop = this.contentTop)\n    );\n  }\n\n  @watch('linear', { waitUntilFirstUpdate: true })\n  protected linearChange(): void {\n    this.steps.forEach((step: IgcStepComponent) => {\n      step.linearDisabled = this.linear;\n      if (step.index <= this.activeStep.index) {\n        step.visited = true;\n      } else {\n        step.visited = false;\n      }\n    });\n    if (this.linear) {\n      this.updateStepsLinearDisabled();\n    }\n  }\n\n  constructor() {\n    super();\n\n    this.addEventListener('stepActiveChanged', (event: any) => {\n      event.stopPropagation();\n      this.activateStep(event.target, event.detail);\n    });\n\n    this.addEventListener('stepDisabledInvalidChanged', (event: any) => {\n      event.stopPropagation();\n      if (this.linear) {\n        this.updateStepsLinearDisabled();\n      }\n    });\n\n    this.addEventListener('stepCompleteChanged', (event: any) => {\n      event.stopPropagation();\n      const nextStep = this.steps[event.target.index + 1];\n      if (nextStep) {\n        nextStep.previousComplete = event.target.complete;\n      }\n    });\n\n    this.addEventListener('stepHeaderKeydown', (event: any) => {\n      event.stopPropagation();\n      this.handleKeydown(event.detail.event, event.detail.focusedStep);\n    });\n  }\n\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.setAttribute('role', 'tablist');\n    this.setAttribute('aria-orientation', this.orientation);\n  }\n\n  private activateFirstStep() {\n    const firstEnabledStep = this.steps.find(\n      (s: IgcStepComponent) => !s.disabled\n    );\n    if (firstEnabledStep) {\n      this.activateStep(firstEnabledStep, false);\n    }\n  }\n\n  private activateStep(step: IgcStepComponent, shouldEmit = true) {\n    if (step === this.activeStep) {\n      return;\n    }\n\n    if (shouldEmit) {\n      const args = {\n        detail: {\n          owner: this,\n          oldIndex: this.activeStep.index,\n          newIndex: step.index,\n        },\n        cancelable: true,\n      };\n\n      const allowed = this.emitEvent('igcActiveStepChanging', args);\n\n      if (!allowed) {\n        return;\n      }\n      this.changeActiveStep(step);\n      this.emitEvent('igcActiveStepChanged', {\n        detail: { owner: this, index: step.index },\n      });\n    } else {\n      this.changeActiveStep(step);\n    }\n  }\n\n  private changeActiveStep(step: IgcStepComponent) {\n    if (this.activeStep) {\n      this.activeStep.active = false;\n    }\n    step.active = true;\n    step.visited = true;\n    this.activeStep = step;\n  }\n\n  private moveToNextStep(next = true) {\n    let steps = this.steps;\n    let activeStepIndex = this.activeStep.index;\n    if (!next) {\n      steps = this.steps.reverse();\n      activeStepIndex = steps.findIndex(\n        (step: IgcStepComponent) => step === this.activeStep\n      );\n    }\n\n    const nextStep = steps.find(\n      (step: IgcStepComponent, i: number) =>\n        i > activeStepIndex && step.isAccessible\n    );\n    if (nextStep) {\n      this.activateStep(nextStep, false);\n    }\n  }\n\n  private handleKeydown(event: KeyboardEvent, focusedStep: IgcStepComponent) {\n    const key = event.key.toLowerCase();\n\n    if (this.keyDownHandlers.has(event.key)) {\n      event.preventDefault();\n      this.keyDownHandlers.get(event.key)?.call(this, focusedStep);\n    }\n    if (key === 'tab' && this.orientation === 'vertical') {\n      return;\n    }\n    if (key === 'tab' && this.activeStep.index !== focusedStep.index) {\n      this.activeStep.header.focus();\n    }\n  }\n\n  private onHomeKey() {\n    this.steps\n      .filter((step: IgcStepComponent) => step.isAccessible)[0]\n      ?.header?.focus();\n  }\n\n  private onEndKey() {\n    this.steps\n      .filter((step: IgcStepComponent) => step.isAccessible)\n      .pop()\n      ?.header?.focus();\n  }\n\n  private onArrowDownKeyDown(focusedStep: IgcStepComponent) {\n    if (this.orientation === 'horizontal') {\n      return;\n    }\n    this.getNextStep(focusedStep)?.header?.focus();\n  }\n\n  private onArrowUpKeyDown(focusedStep: IgcStepComponent) {\n    if (this.orientation === 'horizontal') {\n      return;\n    }\n    this.getPreviousStep(focusedStep)?.header?.focus();\n  }\n\n  private onArrowRightKeyDown(focusedStep: IgcStepComponent) {\n    if (this.dir === 'rtl' && this.orientation === 'horizontal') {\n      this.getPreviousStep(focusedStep)?.header?.focus();\n    } else {\n      this.getNextStep(focusedStep)?.header?.focus();\n    }\n  }\n\n  private onArrowLeftKeyDown(focusedStep: IgcStepComponent) {\n    if (this.dir === 'rtl' && this.orientation === 'horizontal') {\n      this.getNextStep(focusedStep)?.header?.focus();\n    } else {\n      this.getPreviousStep(focusedStep)?.header?.focus();\n    }\n  }\n\n  private getNextStep(\n    focusedStep: IgcStepComponent\n  ): IgcStepComponent | undefined {\n    if (focusedStep.index === this.steps.length - 1) {\n      return this.steps.find((step: IgcStepComponent) => step.isAccessible);\n    }\n\n    const nextAccessible = this.steps.find(\n      (step: IgcStepComponent, i: number) =>\n        i > focusedStep.index && step.isAccessible\n    );\n    return nextAccessible\n      ? nextAccessible\n      : this.steps.find((step: IgcStepComponent) => step.isAccessible);\n  }\n\n  private getPreviousStep(\n    focusedStep: IgcStepComponent\n  ): IgcStepComponent | undefined {\n    if (focusedStep.index === 0) {\n      return this.steps\n        .filter((step: IgcStepComponent) => step.isAccessible)\n        .pop();\n    }\n\n    let prevStep;\n    for (let i = focusedStep.index - 1; i >= 0; i--) {\n      const step = this.steps[i];\n      if (step.isAccessible) {\n        prevStep = step;\n        break;\n      }\n    }\n\n    return prevStep\n      ? prevStep\n      : this.steps.filter((step: IgcStepComponent) => step.isAccessible).pop();\n  }\n\n  private updateStepsLinearDisabled(): void {\n    const firstInvalidStep = this.steps\n      .filter((step: IgcStepComponent) => !step.disabled && !step.optional)\n      .find((step: IgcStepComponent) => step.invalid);\n    if (firstInvalidStep) {\n      this.steps.forEach((step: IgcStepComponent) => {\n        if (step.index <= firstInvalidStep.index) {\n          step.linearDisabled = false;\n        } else {\n          step.linearDisabled = true;\n        }\n      });\n    } else {\n      this.steps.forEach(\n        (step: IgcStepComponent) => (step.linearDisabled = false)\n      );\n    }\n  }\n\n  private syncProperties(): void {\n    this.steps.forEach((step: IgcStepComponent, index: number) => {\n      step.orientation = this.orientation;\n      step.stepType = this.stepType;\n      step.titlePosition = this.titlePosition;\n      step.contentTop = this.contentTop;\n      step.index = index;\n      step.active = this.activeStep === step;\n      step.header?.setAttribute('aria-posinset', (index + 1).toString());\n      step.header?.setAttribute('aria-setsize', this.steps.length.toString());\n      step.header?.setAttribute('id', `igc-step-header-${index}`);\n      step.header?.setAttribute('aria-controls', `igc-step-content-${index}`);\n      if (index > 0) {\n        step.previousComplete = this.steps[index - 1].complete;\n      }\n    });\n  }\n\n  private stepsChanged(): void {\n    this.style.setProperty('--steps-count', this.steps.length.toString());\n\n    const lastActiveStep = this.steps\n      .reverse()\n      .find((step: IgcStepComponent) => step.active);\n    if (!lastActiveStep) {\n      // initially when there isn't a predefined active step or when the active step is removed\n      this.activateFirstStep();\n    } else {\n      // activate the last step marked as active\n      this.activateStep(lastActiveStep, false);\n    }\n\n    this.syncProperties();\n    if (this.linear) {\n      this.updateStepsLinearDisabled();\n    }\n  }\n\n  /** Activates the step at a given index. */\n  public navigateTo(index: number) {\n    const step = this.steps[index];\n    if (!step) {\n      return;\n    }\n    this.activateStep(step, false);\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.steps.forEach((step) => (step.visited = false));\n    this.activateFirstStep();\n  }\n\n  protected override render() {\n    return html`<slot @slotchange=${this.stepsChanged}></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-stepper': IgcStepperComponent;\n  }\n}\n"]}

package/components/stepper/themes/step/dark/step.bootstrap.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/components/stepper/themes/step/dark/step.bootstrap.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;
+//# sourceMappingURL=step.bootstrap.css.js.map

package/components/stepper/themes/step/dark/step.bootstrap.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y0BAAy0B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;\n"]}

package/components/stepper/themes/step/dark/step.fluent.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/components/stepper/themes/step/dark/step.fluent.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;
+//# sourceMappingURL=step.fluent.css.js.map

package/components/stepper/themes/step/dark/step.fluent.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y0BAAy0B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;\n"]}

package/components/stepper/themes/step/dark/step.indigo.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/components/stepper/themes/step/dark/step.indigo.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;
+//# sourceMappingURL=step.indigo.css.js.map

package/components/stepper/themes/step/dark/step.indigo.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y0BAAy0B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;\n"]}

package/components/stepper/themes/step/dark/step.material.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/components/stepper/themes/step/dark/step.material.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;
+//# sourceMappingURL=step.material.css.js.map

package/components/stepper/themes/step/dark/step.material.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/stepper/themes/step/dark/step.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y0BAAy0B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */`;\n"]}

package/components/stepper/themes/step/light/step.base.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;