import { jsxs as p, jsx as e } from "@emotion/react/jsx-runtime";
import { useMemo as o } from "react";
import { useStepper as s } from "../../../../hooks/useStepper/index.js";
import { WrapperTitleStyled as l, TitleStyled as c, TitleTextStyled as d, DescriptionStyled as u } from "../../../../slots/StepperSlot.js";
function h() {
  const { steps: t, currentStep: i } = s((n) => ({
    steps: n.steps,
    currentStep: n.currentStep
  })), r = o(() => t[i], [t, i]);
  return r ? /* @__PURE__ */ p(l, { children: [
    /* @__PURE__ */ e(c, { variant: "paragraphDens", children: /* @__PURE__ */ e(d, { children: r.title }) }),
    r.description && /* @__PURE__ */ e(u, { variant: "bodyStandard", children: r.description })
  ] }) : null;
}
export {
  h as WrapperTitle
};
