@itwin/itwinui-react
Version:
A react component library for iTwinUI
82 lines (81 loc) • 1.97 kB
JavaScript
import * as React from 'react';
import cx from 'classnames';
import { Box } from '../../utils/index.js';
import { InputGrid } from '../InputGrid/InputGrid.js';
import { Label } from '../Label/Label.js';
import { StatusMessage } from '../StatusMessage/StatusMessage.js';
export const InputGroup = React.forwardRef((props, forwardedRef) => {
let {
className,
children,
disabled = false,
displayStyle = 'default',
label,
status,
required = false,
labelProps,
innerProps,
message,
svgIcon,
messageProps,
...rest
} = props;
return React.createElement(
InputGrid,
{
ref: forwardedRef,
as: 'div',
labelPlacement: displayStyle,
className: cx('iui-input-group-wrapper', className),
'data-iui-status': status,
...rest,
},
label &&
React.createElement(
Label,
{
as: 'label',
required: required,
disabled: disabled,
...labelProps,
},
label,
),
React.createElement(
Box,
{
as: 'div',
...innerProps,
className: cx('iui-input-group', innerProps?.className),
},
children,
),
React.createElement(BottomMessage, {
message: message,
status: status,
svgIcon: svgIcon,
displayStyle: displayStyle,
messageProps: messageProps,
}),
);
});
if ('development' === process.env.NODE_ENV)
InputGroup.displayName = 'InputGroup';
let BottomMessage = (props) => {
let { message, status, svgIcon, displayStyle, messageProps } = props;
if (message && 'string' != typeof message) return message;
if (message || status || svgIcon)
return React.createElement(
StatusMessage,
{
iconProps: {
'aria-hidden': true,
},
startIcon: svgIcon,
status: status,
...messageProps,
},
'inline' !== displayStyle && message,
);
return null;
};