Group.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. "use client";
  2. import * as React from 'react';
  3. import { useContext, useMemo } from 'react';
  4. import classNames from 'classnames';
  5. import { devUseWarning } from '../_util/warning';
  6. import { ConfigContext } from '../config-provider';
  7. import { FormItemInputContext } from '../form/context';
  8. import useStyle from './style';
  9. /** @deprecated Please use `Space.Compact` */
  10. const Group = props => {
  11. const {
  12. getPrefixCls,
  13. direction
  14. } = useContext(ConfigContext);
  15. const {
  16. prefixCls: customizePrefixCls,
  17. className
  18. } = props;
  19. const prefixCls = getPrefixCls('input-group', customizePrefixCls);
  20. const inputPrefixCls = getPrefixCls('input');
  21. const [wrapCSSVar, hashId, cssVarCls] = useStyle(inputPrefixCls);
  22. const cls = classNames(prefixCls, cssVarCls, {
  23. [`${prefixCls}-lg`]: props.size === 'large',
  24. [`${prefixCls}-sm`]: props.size === 'small',
  25. [`${prefixCls}-compact`]: props.compact,
  26. [`${prefixCls}-rtl`]: direction === 'rtl'
  27. }, hashId, className);
  28. const formItemContext = useContext(FormItemInputContext);
  29. const groupFormItemContext = useMemo(() => Object.assign(Object.assign({}, formItemContext), {
  30. isFormItemInput: false
  31. }), [formItemContext]);
  32. if (process.env.NODE_ENV !== 'production') {
  33. const warning = devUseWarning('Input.Group');
  34. warning.deprecated(false, 'Input.Group', 'Space.Compact');
  35. }
  36. return wrapCSSVar(/*#__PURE__*/React.createElement("span", {
  37. className: cls,
  38. style: props.style,
  39. onMouseEnter: props.onMouseEnter,
  40. onMouseLeave: props.onMouseLeave,
  41. onFocus: props.onFocus,
  42. onBlur: props.onBlur
  43. }, /*#__PURE__*/React.createElement(FormItemInputContext.Provider, {
  44. value: groupFormItemContext
  45. }, props.children)));
  46. };
  47. export default Group;