tdesign-react/cjs/form/hooks/useFormItemStyle.js

TDesign Component for React

/**
 * tdesign v1.13.2
 * (c) 2025 tdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var defineProperty = require('../../_chunks/dep-cc768e34.js');
var React = require('react');
var classNames = require('classnames');
var hooks_useConfig = require('../../hooks/useConfig.js');
var _util_parseTNode = require('../../_util/parseTNode.js');
var form_const = require('../const.js');
require('../../_chunks/dep-6d4d8660.js');
require('../../config-provider/ConfigContext.js');
require('../../_chunks/dep-3a869b87.js');
require('../../_chunks/dep-ac58e1cc.js');
require('dayjs');
require('../../_chunks/dep-7da96a57.js');
require('../../_chunks/dep-07b911d8.js');
require('../../_chunks/dep-4b02d669.js');
require('../../_chunks/dep-f0379c5f.js');
require('../../_chunks/dep-ddacd27a.js');
require('../../_chunks/dep-028b759d.js');
require('../../_chunks/dep-8a116183.js');
require('../../_chunks/dep-4671b9bd.js');
require('../../_chunks/dep-bed9d73e.js');
require('../../_chunks/dep-780eda7b.js');
require('../../_chunks/dep-47bdc05f.js');
require('../../_chunks/dep-cab13149.js');
require('../../_chunks/dep-a30819a4.js');
require('../../_chunks/dep-6a7ba247.js');
require('../../_chunks/dep-c87d9752.js');
require('../../_chunks/dep-bd956a2d.js');
require('../../_chunks/dep-0cdb3286.js');
require('../../_chunks/dep-865c186c.js');
require('../../_chunks/dep-f4e58639.js');
require('../../_chunks/dep-781a2854.js');
require('../../_chunks/dep-1ef213f8.js');
require('../../_chunks/dep-e2c832a5.js');
require('../../_chunks/dep-4bc3c0ab.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);

function useFormItemStyle(props) {
  var _useConfig = hooks_useConfig["default"](),
    classPrefix = _useConfig.classPrefix;
  var className = props.className,
    help = props.help,
    tips = props.tips,
    snakeName = props.snakeName,
    status = props.status,
    successBorder = props.successBorder,
    errorList = props.errorList,
    successList = props.successList,
    layout = props.layout,
    verifyStatus = props.verifyStatus,
    label = props.label,
    labelWidth = props.labelWidth,
    labelAlign = props.labelAlign,
    requiredMark = props.requiredMark,
    requiredMarkPosition = props.requiredMarkPosition,
    showErrorMessage = props.showErrorMessage,
    innerRules = props.innerRules;
  var renderStatus = status || verifyStatus;
  var helpNode = help && /* @__PURE__ */React__default["default"].createElement("div", {
    className: "".concat(classPrefix, "-input__help")
  }, _util_parseTNode["default"](help));
  var needRequiredMark = requiredMark || (requiredMark !== null && requiredMark !== void 0 ? requiredMark : innerRules.filter(function (rule) {
    return rule.required;
  }).length > 0);
  var extraNode = React.useMemo(function () {
    var _errorList$;
    var extra = tips ? /* @__PURE__ */React__default["default"].createElement("div", {
      className: "".concat(classPrefix, "-input__extra"),
      title: tips
    }, tips) : null;
    if (showErrorMessage && errorList !== null && errorList !== void 0 && (_errorList$ = errorList[0]) !== null && _errorList$ !== void 0 && _errorList$.message) {
      extra = /* @__PURE__ */React__default["default"].createElement("div", {
        className: "".concat(classPrefix, "-input__extra"),
        title: errorList[0].message
      }, errorList[0].message);
    } else if (successList.length) {
      extra = /* @__PURE__ */React__default["default"].createElement("div", {
        className: "".concat(classPrefix, "-input__extra"),
        title: successList[0].message
      }, successList[0].message);
    }
    return extra;
  }, [showErrorMessage, errorList, successList, tips, classPrefix]);
  var formSnakeName = snakeName.split(",").join("_");
  var formItemClass = classNames__default["default"]("".concat(classPrefix, "-form__item"), className, defineProperty._defineProperty(defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-form-item__").concat(formSnakeName), formSnakeName), "".concat(classPrefix, "-form__item-with-help"), helpNode), "".concat(classPrefix, "-form__item-with-extra"), extraNode));
  var formItemLabelClass = classNames__default["default"]("".concat(classPrefix, "-form__label"), defineProperty._defineProperty(defineProperty._defineProperty(defineProperty._defineProperty(defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-form__label--required"), needRequiredMark), "".concat(classPrefix, "-form__label--required-right"), needRequiredMark && requiredMarkPosition === "right"), "".concat(classPrefix, "-form__label--top"), labelAlign === "top" || !labelWidth), "".concat(classPrefix, "-form__label--left"), labelAlign === "left" && labelWidth), "".concat(classPrefix, "-form__label--right"), labelAlign === "right" && labelWidth));
  var contentClass = function contentClass() {
    var controlCls = "".concat(classPrefix, "-form__controls");
    if (!showErrorMessage) return controlCls;
    var isSuccess = renderStatus === form_const.ValidateStatus.SUCCESS;
    if (isSuccess) {
      return classNames__default["default"](controlCls, "".concat(classPrefix, "-is-success"), defineProperty._defineProperty({}, "".concat(classPrefix, "-form--success-border"), successBorder));
    }
    return classNames__default["default"](controlCls, defineProperty._defineProperty(defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-is-warning"), renderStatus === "warning"), "".concat(classPrefix, "-is-error"), ["fail", "error"].includes(renderStatus)), "".concat(classPrefix, "-form--has-error"), renderStatus === form_const.ValidateStatus.ERROR || renderStatus === form_const.ValidateStatus.WARNING));
  };
  var labelStyle = {};
  var contentStyle = {};
  if (label && labelWidth && labelAlign !== "top") {
    if (typeof labelWidth === "number") {
      labelStyle = {
        width: "".concat(labelWidth, "px")
      };
      contentStyle = {
        marginLeft: layout !== "inline" ? "".concat(labelWidth, "px") : ""
      };
    } else {
      labelStyle = {
        width: labelWidth
      };
      contentStyle = {
        marginLeft: layout !== "inline" ? labelWidth : ""
      };
    }
  }
  return {
    formItemClass: formItemClass,
    formItemLabelClass: formItemLabelClass,
    contentClass: contentClass,
    labelStyle: labelStyle,
    contentStyle: contentStyle,
    helpNode: helpNode,
    extraNode: extraNode
  };
}

exports["default"] = useFormItemStyle;
//# sourceMappingURL=useFormItemStyle.js.map