'use strict';
'use client';
import { c } from 'react/compiler-runtime';
import { jsx, jsxs } from 'react/jsx-runtime';
import { useState, useEffect, Fragment } from 'react';
import '../../../fd-component-toolbox/client/framework/index.js';
import { Separator } from '../../../fd-component-toolbox/separator/Separator.js';
import { Icon, iconSizes, iconNames } from '../../../fd-component-toolbox/icon/Icon.js';
import { cn } from '../../../../fd-toolbox/lib/utils.js';
import { wizardStepperStepContentKinds } from './fd-wizard-constants.js';
import { getVisibleSteps, isMobileChecker, getWizardStepperStepContent, getWizardStepperBackgroundClass } from './WizardStepper.funcs.js';
import FrameworkImage from 'next/image.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function WizardStepper(t0) {
  const $ = c(2);
  const {
    steps,
    currentStep
  } = t0;
  const [isMobile, setIsMobile] = useState(false);
  const {
    visibleSteps,
    adjustedCurrentStep
  } = getVisibleSteps(steps, currentStep);
  let t1;
  let t2;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = () => {
      isMobileChecker(setIsMobile);
    };
    t2 = [];
    $[0] = t1;
    $[1] = t2;
  } else {
    t1 = $[0];
    t2 = $[1];
  }
  useEffect(t1, t2);
  return jsx("div", {
    className: "mb-11 w-full px-2",
    children: jsx("div", {
      className: "flex w-full items-center gap-5",
      children: (isMobile ? visibleSteps : steps).map((step, index) => {
        const stepContent = getWizardStepperStepContent(step, index, isMobile, steps, currentStep, adjustedCurrentStep);
        return jsxs(Fragment, {
          children: [index > 0 && jsx("div", {
            className: "w-full min-w-8 xl:min-w-32",
            children: jsx(Separator, {})
          }), jsxs("div", {
            className: "relative flex flex-col items-center",
            children: [jsx("div", {
              className: cn("flex size-11 items-center justify-center overflow-hidden rounded-full sm:size-14", getWizardStepperBackgroundClass(index, isMobile, currentStep, adjustedCurrentStep)),
              children: stepContent.kind === wizardStepperStepContentKinds.completed ? jsx(Icon, {
                name: iconNames.check,
                size: iconSizes.large,
                color: "text-background"
              }) : stepContent.kind === wizardStepperStepContentKinds.image ? jsx(FrameworkImage, {
                src: stepContent.imageUrl,
                fill: true,
                alt: `step-${index + 1}-${step.description}`,
                sizes: "20rem",
                className: "object-cover"
              }) : jsx("p", {
                className: "text-background text-sm md:text-base",
                children: stepContent.value
              })
            }), jsx("div", {
              className: "absolute top-12 mt-2 max-w-40 sm:top-14",
              children: jsx("div", {
                className: "text-subtle-500 text-center text-sm md:text-base",
                children: step.description
              })
            })]
          })]
        }, step.description);
      })
    })
  });
}
__name(WizardStepper, "WizardStepper");

export { WizardStepper };
