@itwin/itwinui-react/esm/utils/components/InputContainer.js

A react component library for iTwinUI

import * as React from 'react';
import cx from 'classnames';
import { Box } from './Box.js';
import { Label } from '../../core/Label/Label.js';
import { StatusMessage } from '../../core/StatusMessage/StatusMessage.js';
export const InputContainer = React.forwardRef((props, forwardedRef) => {
  let {
    label,
    disabled,
    required,
    status,
    message,
    icon,
    isLabelInline,
    children,
    className,
    style,
    statusMessage,
    inputId,
    labelId,
    ...rest
  } = props;
  return React.createElement(
    Box,
    {
      className: cx('iui-input-grid', className),
      'data-iui-status': status,
      'data-iui-label-placement': isLabelInline ? 'inline' : void 0,
      style: style,
      ref: forwardedRef,
      ...rest,
    },
    label &&
      React.createElement(
        Label,
        {
          as: inputId && 'label' !== props.as ? 'label' : 'div',
          required: required,
          disabled: disabled,
          htmlFor: inputId,
          id: labelId,
        },
        label,
      ),
    children,
    statusMessage
      ? statusMessage
      : message &&
          React.createElement(
            StatusMessage,
            {
              startIcon: icon,
              status: status,
            },
            message,
          ),
  );
});