FormItemLabel.js 3.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import _extends from "@babel/runtime/helpers/esm/extends";
  3. import { Fragment as _Fragment, createVNode as _createVNode } from "vue";
  4. import Col from '../grid/Col';
  5. import { useInjectForm } from './context';
  6. import { useLocaleReceiver } from '../locale-provider/LocaleReceiver';
  7. import defaultLocale from '../locale/en_US';
  8. import classNames from '../_util/classNames';
  9. import Tooltip from '../tooltip';
  10. import QuestionCircleOutlined from "@ant-design/icons-vue/es/icons/QuestionCircleOutlined";
  11. const FormItemLabel = (props, _ref) => {
  12. let {
  13. slots,
  14. emit,
  15. attrs
  16. } = _ref;
  17. var _a, _b, _c, _d, _e;
  18. const {
  19. prefixCls,
  20. htmlFor,
  21. labelCol,
  22. labelAlign,
  23. colon,
  24. required,
  25. requiredMark
  26. } = _extends(_extends({}, props), attrs);
  27. const [formLocale] = useLocaleReceiver('Form');
  28. const label = (_a = props.label) !== null && _a !== void 0 ? _a : (_b = slots.label) === null || _b === void 0 ? void 0 : _b.call(slots);
  29. if (!label) return null;
  30. const {
  31. vertical,
  32. labelAlign: contextLabelAlign,
  33. labelCol: contextLabelCol,
  34. labelWrap,
  35. colon: contextColon
  36. } = useInjectForm();
  37. const mergedLabelCol = labelCol || (contextLabelCol === null || contextLabelCol === void 0 ? void 0 : contextLabelCol.value) || {};
  38. const mergedLabelAlign = labelAlign || (contextLabelAlign === null || contextLabelAlign === void 0 ? void 0 : contextLabelAlign.value);
  39. const labelClsBasic = `${prefixCls}-item-label`;
  40. const labelColClassName = classNames(labelClsBasic, mergedLabelAlign === 'left' && `${labelClsBasic}-left`, mergedLabelCol.class, {
  41. [`${labelClsBasic}-wrap`]: !!labelWrap.value
  42. });
  43. let labelChildren = label;
  44. // Keep label is original where there should have no colon
  45. const computedColon = colon === true || (contextColon === null || contextColon === void 0 ? void 0 : contextColon.value) !== false && colon !== false;
  46. const haveColon = computedColon && !vertical.value;
  47. // Remove duplicated user input colon
  48. if (haveColon && typeof label === 'string' && label.trim() !== '') {
  49. labelChildren = label.replace(/[:|:]\s*$/, '');
  50. }
  51. // Tooltip
  52. if (props.tooltip || slots.tooltip) {
  53. const tooltipNode = _createVNode("span", {
  54. "class": `${prefixCls}-item-tooltip`
  55. }, [_createVNode(Tooltip, {
  56. "title": props.tooltip
  57. }, {
  58. default: () => [_createVNode(QuestionCircleOutlined, null, null)]
  59. })]);
  60. labelChildren = _createVNode(_Fragment, null, [labelChildren, slots.tooltip ? (_c = slots.tooltip) === null || _c === void 0 ? void 0 : _c.call(slots, {
  61. class: `${prefixCls}-item-tooltip`
  62. }) : tooltipNode]);
  63. }
  64. // Add required mark if optional
  65. if (requiredMark === 'optional' && !required) {
  66. labelChildren = _createVNode(_Fragment, null, [labelChildren, _createVNode("span", {
  67. "class": `${prefixCls}-item-optional`
  68. }, [((_d = formLocale.value) === null || _d === void 0 ? void 0 : _d.optional) || ((_e = defaultLocale.Form) === null || _e === void 0 ? void 0 : _e.optional)])]);
  69. }
  70. const labelClassName = classNames({
  71. [`${prefixCls}-item-required`]: required,
  72. [`${prefixCls}-item-required-mark-optional`]: requiredMark === 'optional',
  73. [`${prefixCls}-item-no-colon`]: !computedColon
  74. });
  75. return _createVNode(Col, _objectSpread(_objectSpread({}, mergedLabelCol), {}, {
  76. "class": labelColClassName
  77. }), {
  78. default: () => [_createVNode("label", {
  79. "for": htmlFor,
  80. "class": labelClassName,
  81. "title": typeof label === 'string' ? label : '',
  82. "onClick": e => emit('click', e)
  83. }, [labelChildren])]
  84. });
  85. };
  86. FormItemLabel.displayName = 'FormItemLabel';
  87. FormItemLabel.inheritAttrs = false;
  88. export default FormItemLabel;