{"version":3,"sources":["../src/form/input-group/input-group.tsx"],"sourcesContent":["import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ValidationMessage, type ValidationMessageProps } from \"../validation-message\";\nimport { type ErrorMessageProps } from \"../error-message\";\nimport { getValidationMessageValue } from \"../../utils\";\n\ninterface InputProps {\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: boolean;\n  id?: string;\n  className?: string;\n}\n\nexport interface InputGroupProps {\n  id?: string;\n  className?: string;\n  style?: CSSProperties;\n  \"data-color\"?: \"info\" | \"success\" | \"warning\" | \"error\";\n  size?: \"large\" | \"small\";\n  validationMessage?: ReactNode | { value: ReactNode };\n  validationMessageProps?: Partial<ValidationMessageProps>;\n  /** @deprecated Use `validationMessage` instead */\n  errorMessage?: ReactNode;\n  /** @deprecated Use `validationMessageProps` instead */\n  errorMessageProps?: Partial<ErrorMessageProps>;\n  labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n  label?: ReactNode;\n  disabled?: boolean;\n  readOnly?: boolean;\n  /**\n   * `children` must be either a single input element or a render function.\n   *\n   * If you use a render function, make sure you spread the input props to the appropriate element.\n   */\n  children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n  {\n    id,\n    className,\n    style,\n    \"data-color\": dataColor = undefined,\n    size = \"large\",\n    validationMessage,\n    validationMessageProps,\n    errorMessage,\n    errorMessageProps,\n    labelProps: { className: labelClassName, ...labelProps } = {},\n    label,\n    disabled,\n    readOnly,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const validationMessageId = useId();\n  const inputId = useId();\n  const validationColor = errorMessage ? \"error\" : dataColor;\n  const validationMessageValue = getValidationMessageValue(validationMessage, errorMessage);\n\n  const renderInput = () => {\n    const inputProps: InputProps = {\n      \"aria-describedby\": validationMessage ? validationMessageId : undefined,\n      \"aria-invalid\": errorMessage ? true : undefined,\n      id: id ?? inputId,\n      className: clsx(\"hds-input-group__input\"),\n    };\n\n    if (typeof children === \"function\") {\n      return children(inputProps);\n    }\n\n    const input: ReactNode = Children.toArray(children)[0];\n\n    if (!isValidElement<InputProps>(input)) {\n      return;\n    }\n\n    return cloneElement<InputProps>(input, {\n      ...inputProps,\n      ...input.props,\n      className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n    });\n  };\n\n  return (\n    <div\n      className={clsx(\n        \"hds-input-group\",\n        {\n          [`hds-input-group--${size}`]: size,\n        },\n        className as undefined,\n      )}\n      ref={ref}\n      style={style}\n      data-color={validationColor}\n      {...rest}\n    >\n      {label !== null && label !== undefined && label !== false && (\n        <label\n          className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n          {...labelProps}\n          htmlFor={id ?? inputId}\n        >\n          {label}\n        </label>\n      )}\n      <div\n        className={clsx(\"hds-input-group__input-wrapper\")}\n        data-disabled={disabled}\n        data-readonly={readOnly}\n      >\n        {renderInput()}\n      </div>\n      <ValidationMessage\n        id={validationMessageId}\n        {...(validationMessageProps ?? errorMessageProps)}\n      >\n        {validationMessageValue}\n      </ValidationMessage>\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,OAAO,YAAY,UAAU,gBAAgB,oBAAoB;AAE1E,SAAS,YAAY;AAuFjB,SAcI,KAdJ;AAnDG,IAAM,aAAa,WAA4C,SAASA,YAC7E,IAiBA,KACA;AAlBA,eAUc;AAAA,IATZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc,YAAY;AAAA,IAC1B,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY,KAA+C,CAAC;AAAA,EAjDhE,IAuCE,IAUc,SAAE,aAAW,eAjD7B,IAiDgB,IAAgC,uBAAhC,IAAgC,CAA9B,eAVhB,SAWE;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EArDJ,IAuCE,IAeK,iBAfL,IAeK;AAAA,IAdH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAKF,QAAM,sBAAsB,MAAM;AAClC,QAAM,UAAU,MAAM;AACtB,QAAM,kBAAkB,eAAe,UAAU;AACjD,QAAM,yBAAyB,0BAA0B,mBAAmB,YAAY;AAExF,QAAM,cAAc,MAAM;AA/D5B,QAAAC;AAgEI,UAAM,aAAyB;AAAA,MAC7B,oBAAoB,oBAAoB,sBAAsB;AAAA,MAC9D,gBAAgB,eAAe,OAAO;AAAA,MACtC,IAAI,kBAAM;AAAA,MACV,WAAW,KAAK,wBAAwB;AAAA,IAC1C;AAEA,QAAI,OAAO,aAAa,YAAY;AAClC,aAAO,SAAS,UAAU;AAAA,IAC5B;AAEA,UAAM,QAAmB,SAAS,QAAQ,QAAQ,EAAE,CAAC;AAErD,QAAI,CAAC,eAA2B,KAAK,GAAG;AACtC;AAAA,IACF;AAEA,WAAO,aAAyB,OAAO,gDAClC,aACA,MAAM,QAF4B;AAAA,MAGrC,WAAW,GAAG,WAAW,SAAS,KAAIA,MAAA,MAAM,MAAM,cAAZ,OAAAA,MAAyB,EAAE;AAAA,IACnE,EAAC;AAAA,EACH;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,oBAAoB,IAAI,EAAE,GAAG;AAAA,QAChC;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAY;AAAA,OACR,OAXL;AAAA,MAaE;AAAA,kBAAU,QAAQ,UAAU,UAAa,UAAU,SAClD;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,0BAA0B,cAA2B;AAAA,aACjE,aAFL;AAAA,YAGC,SAAS,kBAAM;AAAA,YAEd;AAAA;AAAA,QACH;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,gCAAgC;AAAA,YAChD,iBAAe;AAAA,YACf,iBAAe;AAAA,YAEd,sBAAY;AAAA;AAAA,QACf;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,aACC,0DAA0B,oBAFhC;AAAA,YAIE;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["InputGroup","_a"]}