@hashicorp/design-system-components
Version:
Helios Design System Components
53 lines (52 loc) • 1.97 kB
TypeScript
/**
* Copyright IBM Corp. 2021, 2025
* SPDX-License-Identifier: MPL-2.0
*/
import Component from '@glimmer/component';
import type { WithBoundArgs } from '@glint/template';
import HdsStepperNavStep from './step';
import HdsStepperNavPanel from './panel';
import type { HdsStepperTitleTags, HdsStepperNavStep as HdsStepperNavStepType } from '../types.ts';
export interface HdsStepperNavSignature {
Args: {
steps?: HdsStepperNavStepType[];
currentStep?: number;
isInteractive?: boolean;
titleTag?: HdsStepperTitleTags;
ariaLabel: string;
onStepChange?: (event: MouseEvent, stepNumber: number) => void;
};
Blocks: {
body?: [];
default: [
{
Step?: WithBoundArgs<typeof HdsStepperNavStep, 'currentStep' | 'isNavInteractive' | 'titleTag' | 'stepIds' | 'panelIds' | 'didInsertNode' | 'willDestroyNode' | 'onStepChange' | 'onKeyUp'>;
Panel?: WithBoundArgs<typeof HdsStepperNavPanel, 'currentStep' | 'isNavInteractive' | 'stepIds' | 'panelIds' | 'didInsertNode' | 'willDestroyNode'>;
}
];
};
Element: HTMLDivElement;
}
export default class HdsStepperNav extends Component<HdsStepperNavSignature> {
private _stepIds;
private _stepNodes;
private _panelNodes;
private _panelIds;
private _element;
private _setUpStepperNav;
get currentStep(): number;
get isInteractive(): boolean;
get titleTag(): HdsStepperTitleTags;
get inlineStyles(): Record<string, unknown>;
get progressBarWidthStyle(): string;
didInsertStep: () => void;
willDestroyStep: (element: HTMLElement) => void;
didInsertPanel: () => void;
willDestroyPanel: (element: HTMLElement) => void;
onKeyUp: (currentStepIndex: number, event: KeyboardEvent) => void;
private updateSteps;
private updatePanels;
private findNextInteractiveStepIndex;
private focusStep;
get classNames(): string;
}