import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-Co4V4Zk-.js';

const spwWizardCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:var(--spw-ds-font-main)}body{margin:0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-wizard{display:flex;gap:0}.spw-wizard--horizontal{flex-direction:row}.spw-wizard--vertical{flex-direction:column;align-items:flex-start}`;

const SpwWizard = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.stepClick = createEvent(this, "stepClick", 7);
        /** Étape actuellement active (index basé sur 1) */
        this.currentStep = 1;
        /** Orientation du wizard */
        this.variant = 'horizontal';
        /** Si `true`, les étapes suivantes sont également cliquables */
        this.canClickNextSteps = false;
    }
    componentWillLoad() {
        this.updateStepsState();
    }
    slotChanged() {
        this.updateStepsState();
    }
    /** Méthode publique pour définir une step au wizard */
    async setStep(step) {
        this.currentStep = step;
        this.updateStepsState();
        this.scrollToWizard();
    }
    handleStepClick(event) {
        const clickedStep = event.detail;
        if (clickedStep < this.currentStep || (this.canClickNextSteps && clickedStep > this.currentStep)) {
            this.currentStep = clickedStep;
            this.updateStepsState();
            this.stepClick.emit(clickedStep);
            this.scrollToWizard();
        }
    }
    scrollToWizard() {
        var _a;
        const host = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.host;
        const scrollTarget = (host === null || host === void 0 ? void 0 : host.parentElement) || this.el;
        if (scrollTarget) {
            scrollTarget.scrollIntoView({ behavior: 'smooth', block: 'start' });
        }
    }
    updateStepsState() {
        requestAnimationFrame(() => {
            const items = this.el.querySelectorAll('spw-wizard-item');
            items.forEach((item, index) => {
                const stepNumber = index + 1;
                if (stepNumber > this.currentStep && item.hasAttribute('status')) {
                    item.removeAttribute('status');
                }
                if (!item.hasAttribute('status')) {
                    if (stepNumber < this.currentStep) {
                        item.setAttribute('state', 'completed');
                    }
                    else if (stepNumber === this.currentStep) {
                        item.setAttribute('state', 'active');
                    }
                    else {
                        item.setAttribute('state', 'inactive');
                    }
                }
                item.setAttribute('variant', this.variant);
                item.setAttribute('step-number', stepNumber.toString());
                item.setAttribute('is-last', (index === items.length - 1).toString());
                item.setAttribute('is-clickable', (stepNumber !== this.currentStep && (stepNumber < this.currentStep || this.canClickNextSteps)).toString());
                item.setAttribute('is-current', (stepNumber === this.currentStep).toString());
                item.setAttribute('is-before-current', (stepNumber < this.currentStep).toString());
                item.setAttribute('is-after-current', (stepNumber > this.currentStep).toString());
            });
        });
    }
    get elementClass() {
        return {
            'spw-wizard': true,
            [`spw-wizard--${this.variant}`]: true,
        };
    }
    render() {
        return (h(Host, { key: '178e7cccd1389ea3f3d606ae16384d6779d79f06' }, h("div", { key: '6eea80c6829912766df4f1ce8fa772e406381ecb', class: this.elementClass }, h("slot", { key: '7c315f82ec60d02e0cc4a0fe132a4ec6248f9d24' }))));
    }
    get el() { return getElement(this); }
};
SpwWizard.style = spwWizardCss();

export { SpwWizard as spw_wizard };
