import { jsx as t } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { ARIA_ERROR_SUFFIX as Q } from "../../../core/Errors/constants.js";
import M from "classnames";
import { forwardRef as S } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/compat/dist/compat.module.js";
import { useCallback as n, useMemo as U } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import { filterDisallowedCharacters as W } from "./utils.js";
/* empty css                */
import { ButtonVariant as Z } from "../Button/types.js";
import { FieldError as H } from "./FieldError/FieldError.js";
import ee from "./Select/Select.js";
import { Fragment as ae } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/dist/preact.module.js";
import { hasOwnProperty as te } from "../../../utils/struct/property.js";
function O({
  onInput: f,
  onKeyUp: o,
  trimOnBlur: y,
  onBlurHandler: h,
  onBlur: _,
  onFocusHandler: v,
  errorMessage: I,
  errorTestId: $,
  iconBeforeSlot: d,
  iconAfterSlot: u,
  dropdown: a,
  dropdownPosition: N = "start",
  onDropdownInput: g,
  onKeyDown: C,
  onUpdateDropdown: b,
  ...i
}, x) {
  const { classNameModifiers: q, isInvalid: r, isValid: A, readonly: s = !1, type: l, uniqueId: p, isCollatingErrors: c, disabled: k } = i;
  te(i, "onChange") && console.error("Error: Form fields that rely on InputBase may not have an onChange property");
  const w = n(
    (e) => {
      f?.(e);
    },
    [f]
  ), P = n(
    (e) => {
      o && o(e);
    },
    [o]
  ), j = n(
    (e) => {
      h?.(e), y && (e.target.value = e.target.value.trim()), _?.(e);
    },
    [_, h, y]
  ), B = n(
    (e) => {
      v?.(e);
    },
    [v]
  ), D = n(
    (e) => {
      const V = e.target?.value;
      g?.(V), a && b?.({ ...a, value: V });
    },
    [a, g, b]
  ), K = M(
    "adyen-pe-input",
    [`adyen-pe-input--${l}`],
    i.className,
    {
      "adyen-pe-input--invalid": r,
      "adyen-pe-input--valid": A
    },
    q?.map((e) => `adyen-pe-input--${e}`)
  ), X = n(
    (e) => {
      W({ event: e, inputType: l, onValidInput: () => C?.(e) });
    },
    [l, C]
  ), {
    classNameModifiers: ne,
    uniqueId: se,
    isInvalid: ie,
    isValid: re,
    isCollatingErrors: le,
    errorTestId: oe,
    autoFocus: de,
    autofocus: ue,
    ...Y
  } = i, z = d || u, m = !!a && a.items.length > 0, G = m && N === "start", J = m && N === "end", L = z || m, F = s || a?.readonly, E = /* @__PURE__ */ t(
    "input",
    {
      id: p,
      ...Y,
      type: l,
      className: K,
      readOnly: s,
      "aria-describedby": c ? void 0 : `${p}${Q}`,
      "aria-invalid": r,
      onInput: w,
      onBlurCapture: j,
      onFocus: B,
      onKeyDown: X,
      onKeyUp: P,
      disabled: k,
      ref: x,
      autoFocus: !1
    }
  ), R = U(() => {
    let e = ["input-field"];
    return s && (e = [...e, "readonly"]), e;
  }, [s]), T = n(
    () => a ? /* @__PURE__ */ t(
      ee,
      {
        name: a.name,
        buttonVariant: Z.TERTIARY,
        items: a.items,
        selected: a.value,
        onChange: D,
        readonly: F,
        filterable: a.filterable,
        "aria-label": a["aria-label"],
        classNameModifiers: R,
        isCollatingErrors: c,
        disableToggleFocusOnClose: !0
      }
    ) : null,
    [a, D, c, F, R]
  );
  return /* @__PURE__ */ t(ae, { children: [
    L ? /* @__PURE__ */ t(
      "div",
      {
        className: M("adyen-pe-input__container", {
          "adyen-pe-input--invalid": r,
          "adyen-pe-input__container--readonly": s
        }),
        children: [
          G && /* @__PURE__ */ t("div", { role: "presentation", className: "adyen-pe-input__dropdown adyen-pe-input__dropdown--start", children: T() }),
          d && /* @__PURE__ */ t("span", { className: "adyen-pe-input__slot-before", children: d }),
          E,
          u && /* @__PURE__ */ t("span", { className: "adyen-pe-input__slot-after", children: u }),
          J && /* @__PURE__ */ t("div", { role: "presentation", className: "adyen-pe-input__dropdown adyen-pe-input__dropdown--end", children: T() })
        ]
      }
    ) : E,
    r && I && /* @__PURE__ */ t(H, { id: p, errorMessage: I, testId: $ })
  ] });
}
O.defaultProps = {
  type: "text",
  classNameModifiers: [],
  onInput: () => {
  }
};
const be = S(O);
export {
  be as default
};
