;
{
  try {
    let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "1f951d66-e12e-4d31-a1f7-9b0095f9b3c6", e._sentryDebugIdIdentifier = "sentry-dbid-1f951d66-e12e-4d31-a1f7-9b0095f9b3c6");
  } catch (e) {
  }
}
;
import { jsxs, jsx } from "preact/jsx-runtime";
import cx from "classnames";
import { u as useTranslation, p as useAnalyticsContext } from "./StoreProvider-CqQrndhS.js";
import { a as useId } from "./useId-BZ0PA7jP.js";
import { R as Radio } from "./Radio-BMtxBpnn.js";
const RadioWithLabel = ({
  value,
  label,
  content,
  groupName,
  checked = false,
  disabled = false,
  onClick
}) => {
  const id = useId("radio");
  return /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "adyen-kyc-input-radio", children: [
    /* @__PURE__ */ jsx(
      Radio,
      {
        id,
        checked,
        groupName,
        onClick,
        value,
        disabled
      }
    ),
    /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-input-radio__content", children: [
      /* @__PURE__ */ jsx("span", { className: "adyen-kyc-input-radio__label adyen-kyc-label__text", children: label }),
      content
    ] })
  ] });
};
function RadioGroup({
  items,
  name,
  onChange,
  value,
  disabled = false,
  horizontal = false,
  showContentOnlyOnSelected = false,
  className,
  enableTracking = false
}) {
  const { t, i18n } = useTranslation("common");
  const userEvents = useAnalyticsContext();
  const handleChange = (id) => {
    if (enableTracking) {
      userEvents.addFieldEvent("Interacted with form field", {
        actionType: "input",
        field: name,
        returnValue: value
      });
    }
    onChange(id);
  };
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: cx([
        "adyen-kyc-radio-group",
        { "adyen-kyc-radio-group--horizontal": horizontal },
        className
      ]),
      children: items.map((item) => {
        const isSelected = item.id === value;
        const visibleContent = isSelected || !showContentOnlyOnSelected ? item.content : void 0;
        const keyExists = i18n.exists(item.name, { ns: "common" });
        return /* @__PURE__ */ jsx(
          RadioWithLabel,
          {
            value: item.id,
            label: keyExists ? t(($) => $[item.name]) : item.name,
            content: visibleContent,
            groupName: name,
            checked: isSelected,
            disabled,
            onClick: () => {
              handleChange(item.id);
            }
          },
          item.id
        );
      })
    }
  );
}
export {
  RadioGroup as R,
  RadioWithLabel as a
};
