@tetjana/flowmakers-ds 0.1.6 → 0.1.8

package/dist/index.esm.js

@@ -1,158 +1,876 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { useRef as d, useEffect as p } from "react";
-const b = ({
-  variant: c = "primary",
-  size: a = "md",
+import { jsxs as c, jsx as e, Fragment as _ } from "react/jsx-runtime";
+import { useRef as k, useEffect as b, useState as v } from "react";
+const A = ({
+  variant: a = "primary",
+  size: i = "md",
   leftIcon: s,
-  rightIcon: l,
-  children: n,
+  rightIcon: r,
+  children: l,
   fullWidth: t = !1,
-  disabled: m,
-  className: o = "",
-  ...i
+  disabled: n,
+  className: d = "",
+  ...o
 }) => {
-  const f = [
+  const m = [
     "fm-btn",
-    `fm-btn--${c}`,
     `fm-btn--${a}`,
+    `fm-btn--${i}`,
     t ? "fm-btn--full" : "",
-    m ? "fm-btn--disabled" : "",
-    o
+    n ? "fm-btn--disabled" : "",
+    d
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r("button", { className: f, disabled: m, ...i, children: [
+  return /* @__PURE__ */ c("button", { className: m, disabled: n, ...o, children: [
     s && /* @__PURE__ */ e("span", { className: "fm-btn__icon fm-btn__icon--left", children: s }),
-    n && /* @__PURE__ */ e("span", { className: "fm-btn__label", children: n }),
-    l && /* @__PURE__ */ e("span", { className: "fm-btn__icon fm-btn__icon--right", children: l })
+    l && /* @__PURE__ */ e("span", { className: "fm-btn__label", children: l }),
+    r && /* @__PURE__ */ e("span", { className: "fm-btn__icon fm-btn__icon--right", children: r })
   ] });
-}, g = ({
-  label: c,
-  placeholder: a,
+}, E = ({
+  label: a,
+  placeholder: i,
   state: s = "default",
-  errorMessage: l,
-  successMessage: n,
+  errorMessage: r,
+  successMessage: l,
   leftIcon: t,
-  rightIcon: m,
-  className: o = "",
-  disabled: i,
-  ...f
+  rightIcon: n,
+  className: d = "",
+  disabled: o,
+  ...m
 }) => {
-  const _ = [
+  const f = [
     "fm-input-wrapper",
     `fm-input-wrapper--${s}`,
-    i ? "fm-input-wrapper--disabled" : "",
-    o
+    o ? "fm-input-wrapper--disabled" : "",
+    d
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r("div", { className: _, children: [
-    c && /* @__PURE__ */ e("label", { className: "fm-input__label", children: c }),
-    /* @__PURE__ */ r("div", { className: "fm-input__field", children: [
+  return /* @__PURE__ */ c("div", { className: f, children: [
+    a && /* @__PURE__ */ e("label", { className: "fm-input__label", children: a }),
+    /* @__PURE__ */ c("div", { className: "fm-input__field", children: [
       t && /* @__PURE__ */ e("span", { className: "fm-input__icon fm-input__icon--left", children: t }),
       /* @__PURE__ */ e(
         "input",
         {
           className: "fm-input__el",
-          placeholder: a,
-          disabled: i,
-          ...f
+          placeholder: i,
+          disabled: o,
+          ...m
         }
       ),
-      m && /* @__PURE__ */ e("span", { className: "fm-input__icon fm-input__icon--right", children: m })
+      n && /* @__PURE__ */ e("span", { className: "fm-input__icon fm-input__icon--right", children: n })
     ] }),
-    s === "error" && l && /* @__PURE__ */ e("p", { className: "fm-input__message fm-input__message--error", children: l }),
-    s === "success" && n && /* @__PURE__ */ e("p", { className: "fm-input__message fm-input__message--success", children: n })
+    s === "error" && r && /* @__PURE__ */ e("p", { className: "fm-input__message fm-input__message--error", children: r }),
+    s === "success" && l && /* @__PURE__ */ e("p", { className: "fm-input__message fm-input__message--success", children: l })
   ] });
-}, k = ({ children: c, color: a = "grey", className: s = "" }) => {
-  const l = ["fm-tag", `fm-tag--${a}`, s].filter(Boolean).join(" ");
-  return /* @__PURE__ */ e("span", { className: l, children: c });
-}, x = ({ checked: c, onChange: a, disabled: s, label: l, className: n = "" }) => /* @__PURE__ */ r("label", { className: ["fm-toggle", s ? "fm-toggle--disabled" : "", n].filter(Boolean).join(" "), children: [
+}, F = ({ children: a, color: i = "grey", className: s = "" }) => {
+  const r = ["fm-tag", `fm-tag--${i}`, s].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("span", { className: r, children: a });
+}, H = ({ checked: a, onChange: i, disabled: s, label: r, className: l = "" }) => /* @__PURE__ */ c("label", { className: ["fm-toggle", s ? "fm-toggle--disabled" : "", l].filter(Boolean).join(" "), children: [
   /* @__PURE__ */ e(
     "input",
     {
       type: "checkbox",
       className: "fm-toggle__input",
-      checked: c,
-      onChange: (t) => a(t.target.checked),
+      checked: a,
+      onChange: (t) => i(t.target.checked),
       disabled: s
     }
   ),
   /* @__PURE__ */ e("span", { className: "fm-toggle__track", children: /* @__PURE__ */ e("span", { className: "fm-toggle__thumb" }) }),
-  l && /* @__PURE__ */ e("span", { className: "fm-toggle__label", children: l })
-] }), v = ({
-  checked: c = !1,
-  indeterminate: a = !1,
+  r && /* @__PURE__ */ e("span", { className: "fm-toggle__label", children: r })
+] }), R = ({
+  checked: a = !1,
+  indeterminate: i = !1,
   onChange: s,
-  disabled: l,
-  size: n = "small",
+  disabled: r,
+  size: l = "small",
   label: t,
-  className: m = ""
+  className: n = ""
 }) => {
-  const o = d(null);
-  return p(() => {
-    o.current && (o.current.indeterminate = a);
-  }, [a]), /* @__PURE__ */ r("label", { className: ["fm-checkbox", `fm-checkbox--${n}`, l ? "fm-checkbox--disabled" : "", m].filter(Boolean).join(" "), children: [
+  const d = k(null);
+  return b(() => {
+    d.current && (d.current.indeterminate = i);
+  }, [i]), /* @__PURE__ */ c("label", { className: ["fm-checkbox", `fm-checkbox--${l}`, r ? "fm-checkbox--disabled" : "", n].filter(Boolean).join(" "), children: [
     /* @__PURE__ */ e(
       "input",
       {
-        ref: o,
+        ref: d,
         type: "checkbox",
         className: "fm-checkbox__input",
-        checked: c,
-        onChange: (i) => s == null ? void 0 : s(i.target.checked),
-        disabled: l
+        checked: a,
+        onChange: (o) => s == null ? void 0 : s(o.target.checked),
+        disabled: r
       }
     ),
-    /* @__PURE__ */ r("span", { className: "fm-checkbox__box", children: [
-      c && !a && /* @__PURE__ */ e("svg", { width: "10", height: "8", viewBox: "0 0 10 8", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 4L3.5 6.5L9 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }),
-      a && /* @__PURE__ */ e("span", { className: "fm-checkbox__minus" })
+    /* @__PURE__ */ c("span", { className: "fm-checkbox__box", children: [
+      a && !i && /* @__PURE__ */ e("svg", { width: "10", height: "8", viewBox: "0 0 10 8", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 4L3.5 6.5L9 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }),
+      i && /* @__PURE__ */ e("span", { className: "fm-checkbox__minus" })
     ] }),
     t && /* @__PURE__ */ e("span", { className: "fm-checkbox__label", children: t })
   ] });
-}, j = ({
-  title: c,
-  subtitle: a,
+}, O = ({
+  title: a,
+  subtitle: i,
   color: s = "purple",
-  leftSlot: l,
-  rightSlot: n,
+  leftSlot: r,
+  rightSlot: l,
   className: t = ""
 }) => {
-  const m = ["fm-header", `fm-header--${s}`, t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r("div", { className: m, children: [
-    l && /* @__PURE__ */ e("div", { className: "fm-header__slot fm-header__slot--left", children: l }),
-    /* @__PURE__ */ r("div", { className: "fm-header__title-block", children: [
-      /* @__PURE__ */ e("h4", { className: "fm-header__title", children: c }),
-      a && /* @__PURE__ */ e("p", { className: "fm-header__subtitle", children: a })
+  const n = ["fm-header", `fm-header--${s}`, t].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: n, children: [
+    r && /* @__PURE__ */ e("div", { className: "fm-header__slot fm-header__slot--left", children: r }),
+    /* @__PURE__ */ c("div", { className: "fm-header__title-block", children: [
+      /* @__PURE__ */ e("h4", { className: "fm-header__title", children: a }),
+      i && /* @__PURE__ */ e("p", { className: "fm-header__subtitle", children: i })
     ] }),
-    n && /* @__PURE__ */ e("div", { className: "fm-header__slot fm-header__slot--right", children: n })
+    l && /* @__PURE__ */ e("div", { className: "fm-header__slot fm-header__slot--right", children: l })
   ] });
-}, B = ({
-  variant: c = "light",
-  headline: a = "Є ідеї чи пропозиції?",
+}, U = ({
+  variant: a = "light",
+  headline: i = "Є ідеї чи пропозиції?",
   ctaLabel: s = "Написати нам",
-  onCtaClick: l,
-  sections: n = [],
+  onCtaClick: r,
+  sections: l = [],
   copyright: t = "© 2024 Made by FlowMakers. All rights reserved",
-  className: m = ""
-}) => {
-  const o = ["fm-footer", `fm-footer--${c}`, m].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r("footer", { className: o, children: [
-    /* @__PURE__ */ r("div", { className: "fm-footer__top", children: [
-      /* @__PURE__ */ r("div", { className: "fm-footer__cta-block", children: [
-        /* @__PURE__ */ e("h3", { className: "fm-footer__headline", children: a }),
-        /* @__PURE__ */ e("button", { className: "fm-footer__cta-btn", onClick: l, children: s })
+  className: n = ""
+}) => {
+  const d = ["fm-footer", `fm-footer--${a}`, n].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("footer", { className: d, children: [
+    /* @__PURE__ */ c("div", { className: "fm-footer__top", children: [
+      /* @__PURE__ */ c("div", { className: "fm-footer__cta-block", children: [
+        /* @__PURE__ */ e("h3", { className: "fm-footer__headline", children: i }),
+        /* @__PURE__ */ e("button", { className: "fm-footer__cta-btn", onClick: r, children: s })
       ] }),
-      /* @__PURE__ */ e("div", { className: "fm-footer__sections", children: n.map((i, f) => /* @__PURE__ */ r("div", { className: "fm-footer__section", children: [
-        /* @__PURE__ */ e("p", { className: "fm-footer__section-title", children: i.title }),
-        /* @__PURE__ */ e("ul", { className: "fm-footer__section-links", children: i.links.map((_, h) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e("a", { href: _.href, className: "fm-footer__link", children: _.label }) }, h)) })
-      ] }, f)) })
+      /* @__PURE__ */ e("div", { className: "fm-footer__sections", children: l.map((o, m) => /* @__PURE__ */ c("div", { className: "fm-footer__section", children: [
+        /* @__PURE__ */ e("p", { className: "fm-footer__section-title", children: o.title }),
+        /* @__PURE__ */ e("ul", { className: "fm-footer__section-links", children: o.links.map((f, g) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e("a", { href: f.href, className: "fm-footer__link", children: f.label }) }, g)) })
+      ] }, m)) })
     ] }),
     /* @__PURE__ */ e("div", { className: "fm-footer__bottom", children: /* @__PURE__ */ e("p", { className: "fm-footer__copyright", children: t }) })
   ] });
+}, V = ({
+  icon: a,
+  label: i,
+  active: s = !1,
+  href: r,
+  onClick: l,
+  className: t = ""
+}) => {
+  const n = [
+    "fm-nav-item",
+    s ? "fm-nav-item--active" : "",
+    t
+  ].filter(Boolean).join(" "), d = /* @__PURE__ */ c(_, { children: [
+    a && /* @__PURE__ */ e("span", { className: "fm-nav-item__icon", children: a }),
+    /* @__PURE__ */ e("span", { className: "fm-nav-item__label", children: i })
+  ] });
+  return r ? /* @__PURE__ */ e("a", { className: n, href: r, children: d }) : /* @__PURE__ */ e("button", { className: n, onClick: l, type: "button", children: d });
+}, G = ({
+  children: a,
+  horizontal: i = !1,
+  className: s = ""
+}) => {
+  const r = [
+    "fm-nav-bar",
+    i ? "fm-nav-bar--horizontal" : "",
+    s
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("nav", { className: r, children: a });
+}, w = {
+  available: "Доступно",
+  "in-progress": "В процесі",
+  completed: "Завершено",
+  unavailable: "Недоступно"
+}, Z = ({
+  title: a,
+  description: i,
+  image: s,
+  state: r = "available",
+  tags: l,
+  meta: t,
+  action: n,
+  className: d = ""
+}) => {
+  const o = [
+    "fm-card-test",
+    r === "unavailable" ? "fm-card-test--unavailable" : "",
+    d
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: o, children: [
+    /* @__PURE__ */ c("div", { className: "fm-card-test__image", children: [
+      s && /* @__PURE__ */ e("img", { src: s, alt: a }),
+      /* @__PURE__ */ e("div", { className: "fm-card-test__image-overlay" }),
+      /* @__PURE__ */ e("span", { className: `fm-card-test__status-tag fm-card-test__status-tag--${r}`, children: w[r] })
+    ] }),
+    /* @__PURE__ */ c("div", { className: "fm-card-test__content", children: [
+      /* @__PURE__ */ e("h3", { className: "fm-card-test__title", children: a }),
+      i && /* @__PURE__ */ e("p", { className: "fm-card-test__description", children: i })
+    ] }),
+    l && /* @__PURE__ */ e("div", { className: "fm-card-test__tags", children: l }),
+    t && t.length > 0 && /* @__PURE__ */ e("div", { className: "fm-card-test__meta", children: t.map((m, f) => /* @__PURE__ */ c("div", { className: "fm-card-test__meta-item", children: [
+      /* @__PURE__ */ e("span", { className: "fm-card-test__meta-icon", children: m.icon }),
+      m.label
+    ] }, f)) }),
+    n
+  ] });
+}, h = 21, p = 2 * Math.PI * h, L = ({ value: a }) => {
+  const i = p * (1 - Math.min(100, Math.max(0, a)) / 100), s = a >= 100;
+  return /* @__PURE__ */ c("div", { className: "fm-card-career__progress", children: [
+    /* @__PURE__ */ c("svg", { viewBox: "0 0 50 50", children: [
+      /* @__PURE__ */ e("circle", { className: "fm-card-career__progress-track", cx: "25", cy: "25", r: h }),
+      /* @__PURE__ */ e(
+        "circle",
+        {
+          className: `fm-card-career__progress-fill${s ? " fm-card-career__progress-fill--complete" : ""}`,
+          cx: "25",
+          cy: "25",
+          r: h,
+          strokeDasharray: p,
+          strokeDashoffset: i
+        }
+      )
+    ] }),
+    /* @__PURE__ */ c("span", { className: "fm-card-career__progress-label", children: [
+      a,
+      "%"
+    ] })
+  ] });
+}, x = () => /* @__PURE__ */ e("svg", { className: "fm-card-career__chevron", viewBox: "0 0 20 20", fill: "none", children: /* @__PURE__ */ e("path", { d: "M5 7.5l5 5 5-5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), z = ({
+  title: a,
+  subtitle: i,
+  statusTag: s,
+  tasks: r = [],
+  defaultOpen: l = !1,
+  className: t = ""
+}) => {
+  const [n, d] = v(l), o = [
+    "fm-card-career",
+    n ? "fm-card-career--open" : "",
+    t
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: o, children: [
+    /* @__PURE__ */ c("div", { className: "fm-card-career__header", onClick: () => d((m) => !m), children: [
+      /* @__PURE__ */ c("div", { className: "fm-card-career__header-content", children: [
+        /* @__PURE__ */ c("div", { className: "fm-card-career__title-row", children: [
+          /* @__PURE__ */ e("h3", { className: "fm-card-career__title", children: a }),
+          s
+        ] }),
+        i && /* @__PURE__ */ e("p", { className: "fm-card-career__subtitle", children: i })
+      ] }),
+      /* @__PURE__ */ e(x, {})
+    ] }),
+    /* @__PURE__ */ e("div", { className: "fm-card-career__tasks", children: r.map((m, f) => /* @__PURE__ */ c("div", { className: "fm-card-career__task", children: [
+      /* @__PURE__ */ c("div", { className: "fm-card-career__task-info", children: [
+        /* @__PURE__ */ e(L, { value: m.progress }),
+        /* @__PURE__ */ c("div", { className: "fm-card-career__task-text", children: [
+          /* @__PURE__ */ e("p", { className: "fm-card-career__task-title", children: m.title }),
+          m.subtitle && /* @__PURE__ */ e("p", { className: "fm-card-career__task-subtitle", children: m.subtitle })
+        ] })
+      ] }),
+      m.action
+    ] }, f)) })
+  ] });
+}, B = {
+  minus: /* @__PURE__ */ e("svg", { viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M3 9H15", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }),
+  plus: /* @__PURE__ */ e("svg", { viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M9 3V15M3 9H15", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }),
+  dots: /* @__PURE__ */ c("svg", { viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
+    /* @__PURE__ */ e("circle", { cx: "3.5", cy: "9", r: "1.5", fill: "currentColor" }),
+    /* @__PURE__ */ e("circle", { cx: "9", cy: "9", r: "1.5", fill: "currentColor" }),
+    /* @__PURE__ */ e("circle", { cx: "14.5", cy: "9", r: "1.5", fill: "currentColor" })
+  ] }),
+  pen: /* @__PURE__ */ e("svg", { viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M12.5 2.5L15.5 5.5M2 16L6 15L15.5 5.5L12.5 2.5L3 12L2 16Z",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) }),
+  link: /* @__PURE__ */ c("svg", { viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M7 11L11 7M8 5L5.5 7.5C4.5 8.5 4.5 10 5.5 11L7 12.5C8 13.5 9.5 13.5 10.5 12.5L13 10",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round"
+      }
+    ),
+    /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M10 13L12.5 10.5C13.5 9.5 13.5 8 12.5 7L11 5.5C10 4.5 8.5 4.5 7.5 5.5L5 8",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round"
+      }
+    )
+  ] }),
+  "arrow-left": /* @__PURE__ */ e("svg", { viewBox: "0 0 15 15", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M10.5 2.5L5 7.5L10.5 12.5",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) }),
+  "arrow-right": /* @__PURE__ */ e("svg", { viewBox: "0 0 15 15", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M4.5 2.5L10 7.5L4.5 12.5",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) })
+}, N = ({
+  icon: a = "arrow-right",
+  size: i = "regular",
+  variant: s = "filled",
+  className: r = "",
+  disabled: l,
+  ...t
+}) => {
+  const n = [
+    "fm-icon-btn",
+    `fm-icon-btn--${i}`,
+    `fm-icon-btn--${s}`,
+    r
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("button", { className: n, disabled: l, ...t, children: B[a] });
+}, K = ({
+  options: a,
+  value: i,
+  onChange: s,
+  className: r = ""
+}) => {
+  const l = ["fm-segmented-control", r].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { className: l, role: "tablist", children: a.map((t) => /* @__PURE__ */ e(
+    "button",
+    {
+      role: "tab",
+      "aria-selected": t.value === i,
+      className: [
+        "fm-segmented-control__item",
+        t.value === i ? "fm-segmented-control__item--active" : ""
+      ].filter(Boolean).join(" "),
+      onClick: () => s == null ? void 0 : s(t.value),
+      children: t.label
+    },
+    t.value
+  )) });
+}, Q = ({
+  variant: a = "dots",
+  page: i = 1,
+  total: s = 9,
+  onPrev: r,
+  onNext: l,
+  prevDisabled: t = !1,
+  nextDisabled: n = !1,
+  className: d = ""
+}) => {
+  const o = [
+    "fm-pagination",
+    `fm-pagination--${a}`,
+    d
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: o, children: [
+    /* @__PURE__ */ e(
+      N,
+      {
+        icon: "arrow-left",
+        "aria-label": "Попередня",
+        disabled: t,
+        onClick: r
+      }
+    ),
+    a === "dots" && /* @__PURE__ */ e("div", { className: "fm-pagination__dots", children: Array.from({ length: s }).map((m, f) => /* @__PURE__ */ e(
+      "span",
+      {
+        className: [
+          "fm-pagination__dot",
+          f + 1 === i ? "fm-pagination__dot--active" : ""
+        ].filter(Boolean).join(" ")
+      },
+      f
+    )) }),
+    a === "numbers" && /* @__PURE__ */ e("div", { className: "fm-pagination__numbers", children: /* @__PURE__ */ c("span", { className: "fm-pagination__numbers-text", children: [
+      i,
+      " з ",
+      s
+    ] }) }),
+    /* @__PURE__ */ e(
+      N,
+      {
+        icon: "arrow-right",
+        "aria-label": "Наступна",
+        disabled: n,
+        onClick: l
+      }
+    )
+  ] });
+}, J = ({
+  title: a,
+  subtitle: i,
+  color: s = "purple",
+  leftAction: r,
+  rightAction: l,
+  className: t = ""
+}) => {
+  const n = [
+    "fm-widget-header",
+    `fm-widget-header--${s}`,
+    t
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: n, children: [
+    r && /* @__PURE__ */ e("div", { className: "fm-widget-header__action", children: r }),
+    /* @__PURE__ */ c("div", { className: "fm-widget-header__title-group", children: [
+      /* @__PURE__ */ e("h3", { className: "fm-widget-header__title", children: a }),
+      i && /* @__PURE__ */ e("p", { className: "fm-widget-header__subtitle", children: i })
+    ] }),
+    l && /* @__PURE__ */ e("div", { className: "fm-widget-header__action", children: l })
+  ] });
+}, X = ({
+  header: a,
+  children: i,
+  className: s = "",
+  width: r
+}) => {
+  const l = ["fm-widget-card", s].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: l, style: r ? { width: r } : void 0, children: [
+    a,
+    /* @__PURE__ */ e("div", { className: "fm-widget-card__body", children: i })
+  ] });
+}, Y = ({
+  tag: a,
+  title: i,
+  text: s,
+  className: r = ""
+}) => /* @__PURE__ */ c("div", { className: ["fm-widget-news", r].filter(Boolean).join(" "), children: [
+  a && /* @__PURE__ */ e("div", { className: "fm-widget-news__tag", children: a }),
+  /* @__PURE__ */ c("div", { className: "fm-widget-news__content", children: [
+    /* @__PURE__ */ e("p", { className: "fm-widget-news__title", children: i }),
+    /* @__PURE__ */ e("p", { className: "fm-widget-news__text", children: s })
+  ] })
+] }), ee = ({
+  image: a,
+  tag: i,
+  title: s,
+  className: r = ""
+}) => /* @__PURE__ */ c("div", { className: ["fm-widget-general-news", r].filter(Boolean).join(" "), children: [
+  /* @__PURE__ */ e("div", { className: "fm-widget-general-news__image", children: a && /* @__PURE__ */ e("img", { src: a, alt: s }) }),
+  /* @__PURE__ */ c("div", { className: "fm-widget-general-news__content", children: [
+    i && /* @__PURE__ */ e("div", { className: "fm-widget-general-news__tag", children: i }),
+    /* @__PURE__ */ e("p", { className: "fm-widget-general-news__title", children: s })
+  ] })
+] }), ae = ({
+  title: a,
+  text: i,
+  date: s,
+  className: r = ""
+}) => /* @__PURE__ */ c("div", { className: ["fm-widget-notes", r].filter(Boolean).join(" "), children: [
+  /* @__PURE__ */ e("p", { className: "fm-widget-notes__title", children: a }),
+  /* @__PURE__ */ e("p", { className: "fm-widget-notes__text", children: i }),
+  s && /* @__PURE__ */ e("div", { className: "fm-widget-notes__footer", children: /* @__PURE__ */ e("span", { className: "fm-widget-notes__date", children: s }) })
+] }), se = ({
+  tag: a,
+  text: i,
+  action: s,
+  className: r = ""
+}) => /* @__PURE__ */ c("div", { className: ["fm-widget-advice", r].filter(Boolean).join(" "), children: [
+  a && /* @__PURE__ */ e("div", { className: "fm-widget-advice__tag", children: a }),
+  /* @__PURE__ */ e("p", { className: "fm-widget-advice__text", children: i }),
+  s && /* @__PURE__ */ e("div", { className: "fm-widget-advice__action", children: s })
+] }), ie = ({
+  days: a = [],
+  events: i = [],
+  className: s = ""
+}) => /* @__PURE__ */ c("div", { className: ["fm-widget-calendar", s].filter(Boolean).join(" "), children: [
+  /* @__PURE__ */ e("div", { className: "fm-widget-calendar__days", children: a.map((r, l) => /* @__PURE__ */ c(
+    "div",
+    {
+      className: ["fm-widget-calendar__day", r.active ? "fm-widget-calendar__day--active" : ""].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ e("span", { className: "fm-widget-calendar__day-label", children: r.dayLabel }),
+        /* @__PURE__ */ e("span", { className: "fm-widget-calendar__day-num", children: r.date }),
+        r.hasEvent && /* @__PURE__ */ e("span", { className: "fm-widget-calendar__day-dot" })
+      ]
+    },
+    l
+  )) }),
+  i.length > 0 && /* @__PURE__ */ e("div", { className: "fm-widget-calendar__events", children: i.map((r, l) => /* @__PURE__ */ c("div", { className: "fm-widget-calendar__event", children: [
+    /* @__PURE__ */ e("div", { className: "fm-widget-calendar__event-bar", style: { background: r.color || "#9076dc" } }),
+    /* @__PURE__ */ c("div", { className: "fm-widget-calendar__event-body", children: [
+      /* @__PURE__ */ e("span", { className: "fm-widget-calendar__event-title", children: r.title }),
+      /* @__PURE__ */ e("span", { className: "fm-widget-calendar__event-time", children: r.time })
+    ] })
+  ] }, l)) })
+] }), re = ({
+  placeholder: a = "Пошук...",
+  className: i = "",
+  ...s
+}) => /* @__PURE__ */ c("div", { className: `fm-search ${i}`.trim(), children: [
+  /* @__PURE__ */ c("svg", { className: "fm-search__icon", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+    /* @__PURE__ */ e("circle", { cx: "9", cy: "9", r: "6", stroke: "#91939f", strokeWidth: "1.5" }),
+    /* @__PURE__ */ e("path", { d: "M13.5 13.5L17 17", stroke: "#91939f", strokeWidth: "1.5", strokeLinecap: "round" })
+  ] }),
+  /* @__PURE__ */ e(
+    "input",
+    {
+      className: "fm-search__input",
+      placeholder: a,
+      ...s
+    }
+  )
+] }), ce = ({
+  options: a = [],
+  onSelect: i,
+  className: s = ""
+}) => /* @__PURE__ */ e("div", { className: `fm-dropdown ${s}`.trim(), children: a.map((r) => /* @__PURE__ */ e(
+  "button",
+  {
+    className: "fm-dropdown__item",
+    type: "button",
+    onClick: () => i == null ? void 0 : i(r.value),
+    children: r.label
+  },
+  r.value
+)) }), $ = () => /* @__PURE__ */ c("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+  /* @__PURE__ */ e("rect", { x: "2.5", y: "4.5", width: "15", height: "13", rx: "2", stroke: "currentColor", strokeWidth: "1.3" }),
+  /* @__PURE__ */ e("path", { d: "M6.5 2.5v4M13.5 2.5v4M2.5 8.5h15", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round" }),
+  /* @__PURE__ */ e("circle", { cx: "7", cy: "12", r: "1", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "10", cy: "12", r: "1", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "13", cy: "12", r: "1", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "7", cy: "15", r: "1", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "10", cy: "15", r: "1", fill: "currentColor" })
+] }), le = ({
+  label: a,
+  helperText: i,
+  state: s = "default",
+  disabled: r,
+  className: l = "",
+  ...t
+}) => {
+  const n = r || s === "disabled", d = [
+    "fm-datepicker",
+    `fm-datepicker--${s}`,
+    n ? "fm-datepicker--disabled" : "",
+    l
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: d, children: [
+    a && /* @__PURE__ */ e("label", { className: "fm-datepicker__label", children: a }),
+    /* @__PURE__ */ c("div", { className: "fm-datepicker__field", children: [
+      /* @__PURE__ */ e(
+        "input",
+        {
+          type: "date",
+          className: "fm-datepicker__input",
+          disabled: n,
+          ...t
+        }
+      ),
+      /* @__PURE__ */ e("span", { className: "fm-datepicker__icon", children: /* @__PURE__ */ e($, {}) })
+    ] }),
+    i && /* @__PURE__ */ e("p", { className: "fm-datepicker__helper", children: i })
+  ] });
+}, y = () => /* @__PURE__ */ c("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+  /* @__PURE__ */ e("circle", { cx: "10", cy: "10", r: "7", stroke: "currentColor", strokeWidth: "1.3" }),
+  /* @__PURE__ */ e("path", { d: "M10 6.5V10.5L13 12", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round" })
+] }), te = ({
+  label: a,
+  helperText: i,
+  state: s = "default",
+  disabled: r,
+  className: l = "",
+  ...t
+}) => {
+  const n = r || s === "disabled", d = [
+    "fm-timepicker",
+    `fm-timepicker--${s}`,
+    n ? "fm-timepicker--disabled" : "",
+    l
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ c("div", { className: d, children: [
+    a && /* @__PURE__ */ e("label", { className: "fm-timepicker__label", children: a }),
+    /* @__PURE__ */ c("div", { className: "fm-timepicker__field", children: [
+      /* @__PURE__ */ e(
+        "input",
+        {
+          type: "time",
+          className: "fm-timepicker__input",
+          disabled: n,
+          ...t
+        }
+      ),
+      /* @__PURE__ */ e("span", { className: "fm-timepicker__icon", children: /* @__PURE__ */ e(y, {}) })
+    ] }),
+    i && /* @__PURE__ */ e("p", { className: "fm-timepicker__helper", children: i })
+  ] });
+}, ne = ({
+  label: a,
+  checked: i = !1,
+  disabled: s,
+  className: r = "",
+  onChange: l,
+  ...t
+}) => /* @__PURE__ */ c("label", { className: `fm-radio ${s ? "fm-radio--disabled" : ""} ${r}`.trim(), children: [
+  /* @__PURE__ */ e("span", { className: `fm-radio__circle ${i ? "fm-radio__circle--checked" : ""}`, children: i && /* @__PURE__ */ e("span", { className: "fm-radio__dot" }) }),
+  /* @__PURE__ */ e(
+    "input",
+    {
+      type: "radio",
+      className: "fm-radio__input",
+      checked: i,
+      disabled: s,
+      onChange: l,
+      ...t
+    }
+  ),
+  a && /* @__PURE__ */ e("span", { className: "fm-radio__label", children: a })
+] }), C = () => /* @__PURE__ */ e("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1.5 6L6 10.5L14.5 1.5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }), j = ({
+  step: a,
+  index: i,
+  isLast: s
+}) => /* @__PURE__ */ c("div", { className: "fm-stepper__step", children: [
+  /* @__PURE__ */ c("div", { className: `fm-stepper__circle fm-stepper__circle--${a.state}`, children: [
+    a.state === "done" && /* @__PURE__ */ e(C, {}),
+    a.state === "in-process" && /* @__PURE__ */ e("span", { className: "fm-stepper__num", children: i + 1 }),
+    a.state === "inactive" && /* @__PURE__ */ e("span", { className: "fm-stepper__num fm-stepper__num--inactive", children: i + 1 })
+  ] }),
+  !s && /* @__PURE__ */ e("div", { className: `fm-stepper__line fm-stepper__line--${a.state}` }),
+  a.label && /* @__PURE__ */ e("p", { className: `fm-stepper__label fm-stepper__label--${a.state}`, children: a.label })
+] }), de = ({ steps: a, className: i = "" }) => /* @__PURE__ */ e("div", { className: `fm-stepper ${i}`.trim(), children: a.map((s, r) => /* @__PURE__ */ e(j, { step: s, index: r, isLast: r === a.length - 1 }, r)) }), W = () => /* @__PURE__ */ e("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1.5 6L6 10.5L14.5 1.5", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }), M = ({ step: a, isLast: i }) => {
+  const s = a.state ?? "inactive";
+  return /* @__PURE__ */ c("div", { className: `fm-stepper-progress__step fm-stepper-progress__step--${s}`, children: [
+    /* @__PURE__ */ e("div", { className: "fm-stepper-progress__circle", children: /* @__PURE__ */ e(W, {}) }),
+    !i && /* @__PURE__ */ e("div", { className: "fm-stepper-progress__line" }),
+    /* @__PURE__ */ e("p", { className: "fm-stepper-progress__label", children: a.label })
+  ] });
+}, oe = ({ steps: a, className: i = "" }) => /* @__PURE__ */ e("div", { className: `fm-stepper-progress ${i}`.trim(), children: a.map((s, r) => /* @__PURE__ */ e(M, { step: s, isLast: r === a.length - 1 }, r)) }), me = ({
+  avatar: a,
+  name: i,
+  role: s,
+  quote: r,
+  className: l = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-testimonial ${l}`.trim(), children: [
+  /* @__PURE__ */ c("div", { className: "fm-testimonial__author", children: [
+    a ? /* @__PURE__ */ e("img", { className: "fm-testimonial__avatar", src: a, alt: i }) : /* @__PURE__ */ e("div", { className: "fm-testimonial__avatar fm-testimonial__avatar--placeholder", children: i.charAt(0) }),
+    /* @__PURE__ */ c("div", { className: "fm-testimonial__meta", children: [
+      /* @__PURE__ */ e("p", { className: "fm-testimonial__name", children: i }),
+      s && /* @__PURE__ */ e("p", { className: "fm-testimonial__role", children: s })
+    ] })
+  ] }),
+  /* @__PURE__ */ e("p", { className: "fm-testimonial__quote", children: r })
+] }), fe = ({
+  icon: a,
+  title: i,
+  description: s,
+  price: r,
+  period: l = "/місяць",
+  action: t,
+  badge: n,
+  highlighted: d = !1,
+  className: o = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-pricecard ${d ? "fm-pricecard--highlighted" : ""} ${o}`.trim(), children: [
+  n && /* @__PURE__ */ e("span", { className: "fm-pricecard__badge", children: n }),
+  a && /* @__PURE__ */ e("div", { className: "fm-pricecard__icon", children: a }),
+  /* @__PURE__ */ c("div", { className: "fm-pricecard__info", children: [
+    /* @__PURE__ */ e("h3", { className: "fm-pricecard__title", children: i }),
+    s && /* @__PURE__ */ e("p", { className: "fm-pricecard__desc", children: s })
+  ] }),
+  /* @__PURE__ */ c("div", { className: "fm-pricecard__footer", children: [
+    r !== void 0 && /* @__PURE__ */ c("div", { className: "fm-pricecard__price", children: [
+      /* @__PURE__ */ e("span", { className: "fm-pricecard__amount", children: r }),
+      /* @__PURE__ */ e("span", { className: "fm-pricecard__period", children: l })
+    ] }),
+    t && /* @__PURE__ */ e("div", { className: "fm-pricecard__action", children: t })
+  ] })
+] }), I = () => /* @__PURE__ */ e("svg", { width: "14", height: "10", viewBox: "0 0 14 10", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 5L5.5 9.5L13 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _e = ({
+  title: a = "Базовий",
+  amount: i = "₴0",
+  period: s = "/місяць",
+  actionLabel: r = "Отримати",
+  onAction: l,
+  features: t = [],
+  className: n = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-price ${n}`.trim(), children: [
+  /* @__PURE__ */ e("p", { className: "fm-price__title", children: a }),
+  /* @__PURE__ */ c("div", { className: "fm-price__amount-row", children: [
+    /* @__PURE__ */ e("span", { className: "fm-price__amount", children: i }),
+    /* @__PURE__ */ e("span", { className: "fm-price__period", children: s })
+  ] }),
+  /* @__PURE__ */ e("button", { className: "fm-price__cta", type: "button", onClick: l, children: r }),
+  t.length > 0 && /* @__PURE__ */ e("ul", { className: "fm-price__features", children: t.map((d, o) => /* @__PURE__ */ c("li", { className: "fm-price__feature", children: [
+    /* @__PURE__ */ e("div", { className: "fm-price__check", children: /* @__PURE__ */ e(I, {}) }),
+    /* @__PURE__ */ e("span", { children: d })
+  ] }, o)) })
+] }), P = () => /* @__PURE__ */ e("svg", { width: "14", height: "10", viewBox: "0 0 14 10", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 5L5.5 9.5L13 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), he = ({ children: a, className: i = "" }) => /* @__PURE__ */ c("div", { className: `fm-list-item ${i}`.trim(), children: [
+  /* @__PURE__ */ e("div", { className: "fm-list-item__check", children: /* @__PURE__ */ e(P, {}) }),
+  /* @__PURE__ */ e("span", { className: "fm-list-item__text", children: a })
+] }), D = () => /* @__PURE__ */ c("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
+  /* @__PURE__ */ e("path", { d: "M8 1L9.5 6.5L15 8L9.5 9.5L8 15L6.5 9.5L1 8L6.5 6.5L8 1Z", fill: "url(#fm-sparkle-grad)" }),
+  /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ c("linearGradient", { id: "fm-sparkle-grad", x1: "0", y1: "0", x2: "16", y2: "16", gradientUnits: "userSpaceOnUse", children: [
+    /* @__PURE__ */ e("stop", { offset: "0%", stopColor: "#9076dc" }),
+    /* @__PURE__ */ e("stop", { offset: "100%", stopColor: "#ffa8f1" })
+  ] }) })
+] }), u = ({
+  label: a = "АІ-помічник для кар'єрного розвитку",
+  showIcon: i = !0,
+  className: s = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-tag-big ${s}`.trim(), children: [
+  i && /* @__PURE__ */ e("span", { className: "fm-tag-big__icon", children: /* @__PURE__ */ e(D, {}) }),
+  /* @__PURE__ */ e("span", { className: "fm-tag-big__label", children: a })
+] }), pe = ({
+  tag: a = "Можливості платформи",
+  showTag: i = !0,
+  title: s = "Все для твоєї кар'єри",
+  subtitle: r = "Комплексна платформа для пошуку роботи, навчання та професійного розвитку",
+  showSubtitle: l = !0,
+  variant: t = "centered",
+  className: n = ""
+}) => /* @__PURE__ */ e("div", { className: `fm-section-title fm-section-title--${t} ${n}`.trim(), children: t === "split" ? /* @__PURE__ */ c(_, { children: [
+  /* @__PURE__ */ c("div", { className: "fm-section-title__left", children: [
+    i && /* @__PURE__ */ e(u, { label: a, showIcon: !1 }),
+    /* @__PURE__ */ e("h2", { className: "fm-section-title__heading", children: s })
+  ] }),
+  l && /* @__PURE__ */ e("p", { className: "fm-section-title__subtitle", children: r })
+] }) : /* @__PURE__ */ c(_, { children: [
+  i && /* @__PURE__ */ e(u, { label: a, showIcon: !1 }),
+  /* @__PURE__ */ e("h2", { className: "fm-section-title__heading", children: s }),
+  l && /* @__PURE__ */ e("p", { className: "fm-section-title__subtitle", children: r })
+] }) }), Ne = ({
+  title: a = "Привіт!",
+  subtitle: i = "Сьогодні чудовий день для кар'єрного зростання.",
+  actionLabel: s = "Почати тренування",
+  showAction: r = !0,
+  onAction: l,
+  className: t = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-dashboard-title ${t}`.trim(), children: [
+  /* @__PURE__ */ c("div", { className: "fm-dashboard-title__text", children: [
+    /* @__PURE__ */ e("h1", { className: "fm-dashboard-title__heading", children: a }),
+    /* @__PURE__ */ e("p", { className: "fm-dashboard-title__subtitle", children: i })
+  ] }),
+  r && /* @__PURE__ */ e("button", { className: "fm-dashboard-title__action", type: "button", onClick: l, children: s })
+] }), ue = ({
+  number: a = 1,
+  title: i = "Пройди тестування",
+  content: s = "АІ аналізує твої навички, інтерес та досвід",
+  style: r = "select",
+  className: l = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-process-step fm-process-step--${r} ${l}`.trim(), children: [
+  /* @__PURE__ */ e("div", { className: "fm-process-step__number", children: /* @__PURE__ */ e("span", { children: a }) }),
+  /* @__PURE__ */ c("div", { className: "fm-process-step__body", children: [
+    /* @__PURE__ */ e("h3", { className: "fm-process-step__title", children: i }),
+    /* @__PURE__ */ e("p", { className: "fm-process-step__content", children: s })
+  ] })
+] }), T = () => /* @__PURE__ */ e("svg", { width: "14", height: "10", viewBox: "0 0 14 10", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 5L5.5 9.5L13 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), ve = ({ tasks: a, className: i = "" }) => /* @__PURE__ */ e("div", { className: `fm-tasks-widget ${i}`.trim(), children: a.map((s, r) => /* @__PURE__ */ c("div", { className: "fm-tasks-widget__row", children: [
+  /* @__PURE__ */ e("div", { className: `fm-tasks-widget__checkbox ${s.done ? "fm-tasks-widget__checkbox--done" : ""}`, children: s.done && /* @__PURE__ */ e(T, {}) }),
+  /* @__PURE__ */ e("span", { className: `fm-tasks-widget__label ${s.done ? "fm-tasks-widget__label--done" : ""}`, children: s.label }),
+  s.time && /* @__PURE__ */ e("span", { className: "fm-tasks-widget__tag", children: s.time })
+] }, r)) }), ge = ({
+  placeholder: a = "Ваша електронна пошта",
+  buttonLabel: i = "Почати безкоштовно",
+  onSubmit: s,
+  className: r = ""
+}) => {
+  const [l, t] = v(""), n = (d) => {
+    d.preventDefault(), s == null || s(l);
+  };
+  return /* @__PURE__ */ c("form", { className: `fm-signup-form ${r}`.trim(), onSubmit: n, children: [
+    /* @__PURE__ */ e(
+      "input",
+      {
+        type: "email",
+        className: "fm-signup-form__input",
+        placeholder: a,
+        value: l,
+        onChange: (d) => t(d.target.value)
+      }
+    ),
+    /* @__PURE__ */ e("button", { type: "submit", className: "fm-signup-form__btn", children: i })
+  ] });
+}, ke = ({
+  icon: a,
+  title: i = "Базовий",
+  description: s = "Ідеальний старт для знайомства з платформою та визначення кар'єрного напрямку.",
+  variant: r = "default",
+  className: l = ""
+}) => /* @__PURE__ */ c("div", { className: `fm-tariffs fm-tariffs--${r} ${l}`.trim(), children: [
+  a && /* @__PURE__ */ e("div", { className: "fm-tariffs__icon", children: a }),
+  /* @__PURE__ */ c("div", { className: "fm-tariffs__body", children: [
+    /* @__PURE__ */ e("p", { className: "fm-tariffs__title", children: i }),
+    /* @__PURE__ */ e("p", { className: "fm-tariffs__desc", children: s })
+  ] })
+] }), be = ({
+  label: a = "Творчість та інновації",
+  state: i = "default",
+  selected: s = !1,
+  onClick: r,
+  className: l = ""
+}) => {
+  const t = i === "active" || s;
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      className: [
+        "fm-question",
+        `fm-question--${i}`,
+        t ? "fm-question--selected" : "",
+        l
+      ].filter(Boolean).join(" "),
+      onClick: r,
+      role: "button",
+      tabIndex: 0,
+      onKeyDown: (n) => n.key === "Enter" && (r == null ? void 0 : r()),
+      children: [
+        /* @__PURE__ */ e("span", { className: "fm-question__label", children: a }),
+        /* @__PURE__ */ e("span", { className: `fm-question__radio ${t ? "fm-question__radio--checked" : ""}`, children: t && /* @__PURE__ */ e("span", { className: "fm-question__dot" }) })
+      ]
+    }
+  );
 };
 export {
-  b as Button,
-  v as Checkbox,
-  B as Footer,
-  j as Header,
-  g as Input,
-  k as Tag,
-  x as Toggle
+  A as Button,
+  ie as CalendarWidget,
+  z as CardCareer,
+  Z as CardTest,
+  R as Checkbox,
+  Ne as DashboardTitle,
+  le as DatePicker,
+  ce as Dropdown,
+  U as Footer,
+  ee as GeneralNewsWidget,
+  O as Header,
+  N as IconButton,
+  E as Input,
+  he as ListItem,
+  G as NavBar,
+  V as NavItem,
+  ae as NotesWidget,
+  Q as Pagination,
+  se as PersonalAdviceWidget,
+  Y as PlatformNewsWidget,
+  _e as Price,
+  fe as PriceCard,
+  ue as ProcessStep,
+  be as Question,
+  ne as RadioButton,
+  re as Search,
+  pe as SectionTitle,
+  K as SegmentedControl,
+  ge as SignupForm,
+  de as Stepper,
+  oe as StepperProgress,
+  F as Tag,
+  u as TagBig,
+  ke as Tariffs,
+  ve as TasksWidget,
+  me as TestimonialCard,
+  te as TimePicker,
+  H as Toggle,
+  X as WidgetCard,
+  J as WidgetHeader
 };