import { jsx as e } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { REFUND_REASONS as T, TX_DATA_CONTAINER as f, TX_DATA_INPUT_HEAD as p, TX_DATA_INPUT_CONTAINER as u, TX_DATA_INPUT_CONTAINER_SHORT as N } from "../../constants.js";
import { useMemo as n, useCallback as A } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import { getTransactionRefundReason as _ } from "../../../../utils/translation/getters.js";
import { TypographyVariant as R, TypographyElement as y } from "../../../../internal/Typography/types.js";
import g from "../../../../internal/Typography/Typography.js";
import h from "../../../../../hooks/useUniqueId.js";
import I from "../../../../../core/Context/preact/useCoreContext.js";
import b from "../../../../internal/FormFields/Select/Select.js";
const x = ({ disabled: l, onChange: r, reason: i }) => {
  const { i18n: a } = I(), o = h(), m = n(() => a.get("transactions.details.refund.inputs.reason.label"), [a]), c = n(
    () => T.map((t) => ({
      name: _(a, t),
      id: t
    })),
    [a]
  ), d = A(
    (t) => {
      const s = t.target?.value;
      s && r(s);
    },
    [r]
  );
  return /* @__PURE__ */ e("div", { className: f, children: [
    /* @__PURE__ */ e("div", { id: o, className: p, children: /* @__PURE__ */ e(g, { el: y.SPAN, variant: R.BODY, stronger: !0, children: m }) }),
    /* @__PURE__ */ e("div", { className: `${u} ${N}`, children: /* @__PURE__ */ e(
      b,
      {
        "aria-labelledby": o,
        filterable: !1,
        multiSelect: !1,
        readonly: l,
        items: c,
        onChange: d,
        selected: i
      }
    ) })
  ] });
};
export {
  x as default
};
