import { jsxs, jsx } from 'react/jsx-runtime';
import { forwardRef, useRef, useState, useMemo, useId, isValidElement } from 'react';
import { w as warnDeprecatedErrorUsage } from './utils-pudAMGnO.js';
import { S as Spinner } from './Spinner-CpEm3Lud.js';
import { t as textFieldStyles } from './TextField.module-BP-hDP5m.js';
import { c as cx } from './index-SvGbrGuT.js';
import { F as FieldLabel } from './FieldLabel-DL0D6fvc.js';
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
import { useTrackingId } from './useTrackingId.js';
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-loxbyklF.js';
import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
import { H as Helper } from './Helper-B2UrgJvr.js';

const TextField = forwardRef(
  (props, ref) => {
    const data = {
      label: childrenToString(props.label),
      labelProps: props.labelProps,
      prefix: childrenToString(props.prefix),
      hint: childrenToString(props.hint),
      description: childrenToString(props.description),
      size: props.size,
      type: props.type
    };
    const trackingId = useTrackingId({
      name: "TextField",
      data,
      hasOverride: !!props["data-tracking-id"]
    });
    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
    const {
      className,
      error,
      errorAriaLive: _errorAriaLive,
      defaultValue: defaultValueProp,
      value: valueProp,
      label,
      moreInfo,
      prefix,
      suffix,
      size,
      type = "text",
      required,
      onChange,
      onFocus,
      onBlur,
      id: idProp,
      description,
      hint,
      showCounter,
      maxLength,
      loading,
      disabled,
      labelProps,
      style,
      placeholder,
      warning,
      "aria-label": ariaLabelProp,
      ...rest
    } = componentProps;
    const inputRef = useRef(null);
    const [isTyping, setIsTyping] = useState(false);
    const [openInfo, setOpenInfo] = useState(false);
    const [value, setValue] = useOptionallyControlledState({
      controlledValue: valueProp,
      defaultValue: defaultValueProp
    });
    const length = useMemo(() => {
      if (typeof value === "string" || typeof value === "number" || Array.isArray(value)) {
        return String(value).length;
      }
      return 0;
    }, [value]);
    const onChangeHandler = (e) => {
      setValue(e.target.value);
      onChange?.(e);
      if (!isTyping) {
        setIsTyping(true);
      }
    };
    const focusHandler = (e) => {
      onFocus?.(e);
      setOpenInfo(true);
    };
    const blurHandler = (e) => {
      onBlur?.(e);
      setOpenInfo(false);
      if (isTyping) {
        setIsTyping(false);
      }
    };
    const labelUid = useId();
    const id = idProp ?? labelUid;
    const prefixUid = useId();
    const suffixUid = useId();
    const helperUid = useId();
    warnDeprecatedErrorUsage("TextField", error);
    const errorMessages = typeof error === "boolean" || error === void 0 ? void 0 : error;
    const styleCombined = { ...style, ...layoutStyles };
    const hasHelperText = hint || showCounter || errorMessages || warning || description;
    return /* @__PURE__ */ jsxs(
      "div",
      {
        className: cx(textFieldStyles["textfield"], className),
        "data-anv": "textfield",
        style: styleCombined,
        children: [
          label && /* @__PURE__ */ jsx(
            FieldLabel,
            {
              moreInfo,
              moreInfoOpen: openInfo,
              required,
              htmlFor: id,
              ...labelProps,
              children: label
            }
          ),
          /* @__PURE__ */ jsxs(
            "div",
            {
              className: cx(textFieldStyles["input-wrapper"], {
                [textFieldStyles["small"]]: size === "small",
                [textFieldStyles["large"]]: size === "large"
              }),
              role: "presentation",
              onClick: () => inputRef.current?.focus(),
              children: [
                prefix ? /* @__PURE__ */ jsx(
                  "div",
                  {
                    "aria-hidden": true,
                    className: textFieldStyles["prefix"],
                    id: `prefix${prefixUid}`,
                    children: prefix
                  }
                ) : null,
                /* @__PURE__ */ jsx(
                  "input",
                  {
                    id,
                    className: cx(textFieldStyles["input"], {
                      [textFieldStyles["error"]]: error
                    }),
                    onChange: onChangeHandler,
                    onFocus: focusHandler,
                    onBlur: blurHandler,
                    ref: useMergeRefs([ref, inputRef]),
                    required,
                    maxLength,
                    placeholder,
                    type,
                    disabled,
                    value: value ?? "",
                    "data-tracking-id": trackingId,
                    ...rest,
                    "aria-label": ariaLabelProp || (label ? void 0 : placeholder),
                    "aria-describedby": hasHelperText ? helperUid : void 0,
                    "aria-invalid": error ? !!error : void 0
                  }
                ),
                loading ? /* @__PURE__ */ jsx("div", { className: textFieldStyles["loading-spinner-wrapper"], children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) : null,
                suffix ? /* @__PURE__ */ jsx(
                  "div",
                  {
                    className: textFieldStyles["suffix"],
                    "aria-hidden": true,
                    id: `suffix${suffixUid}`,
                    children: suffix
                  }
                ) : null
              ]
            }
          ),
          hasHelperText ? /* @__PURE__ */ jsx(
            Helper,
            {
              id: helperUid,
              hint,
              maxLength,
              inputLength: length,
              isTyping,
              showCounter,
              error: typeof errorMessages === "string" || Array.isArray(errorMessages) ? errorMessages : void 0,
              warning,
              errorMessage: isValidElement(errorMessages) ? errorMessages : void 0,
              description
            }
          ) : null
        ]
      }
    );
  }
);
TextField.displayName = "InternalTextField";

export { TextField as T };
//# sourceMappingURL=TextField-atI4M79b.js.map
