@flatbiz/antd/dist/form-item-wrapper-BneADBjX.js

/*! @flatjs/forge MIT @flatbiz/antd */

import { _ as _objectWithoutProperties, b as _objectSpread2 } from './_rollupPluginBabelHelpers-BYm17lo8.js';
import { useMemo, isValidElement, cloneElement } from 'react';
import { Form } from 'antd';
import { composeProps, isUndefinedOrNull } from '@flatbiz/utils';
import { fbaHooks } from './fba-hooks/index.js';
import { preDefinedClassName } from './pre-defined-class-name/index.js';
import { jsx, jsxs } from 'react/jsx-runtime';

var _excluded = ["wrapper", "children", "inputNormalize", "isClear", "beforeAfterStyle"],
  _excluded2 = ["wrapper", "isClear", "labelWidth", "labelItemVertical", "labelAlign", "children", "before", "after", "inputNormalize", "outputNormalize", "className", "dependencies", "hidden", "beforeAfterStyle"];
var FormItemWrapperChildren = function FormItemWrapperChildren(props) {
  var wrapper = props.wrapper,
    children = props.children,
    inputNormalize = props.inputNormalize,
    isClear = props.isClear,
    beforeAfterStyle = props.beforeAfterStyle,
    rest = _objectWithoutProperties(props, _excluded);
  // composeProps 合并执行 Form.Item 传的 onChange 以及组件本身的方法
  var hasValue = Object.prototype.hasOwnProperty.call(rest, 'value');
  if (hasValue && inputNormalize) {
    rest['value'] = inputNormalize(rest['value']);
  }
  var _children = /*#__PURE__*/cloneElement(children, composeProps(children.props, rest, true));
  fbaHooks.useEffectCustom(function () {
    if (isClear && !isUndefinedOrNull(props.value)) {
      var _props$onChange;
      (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, undefined);
    }
  }, [isClear, props.value]);
  if (wrapper) {
    return wrapper(_children);
  }
  if (props.before || props.after) {
    return /*#__PURE__*/jsxs("div", {
      style: _objectSpread2({
        display: 'flex',
        alignItems: 'center'
      }, beforeAfterStyle),
      children: [props.before ? /*#__PURE__*/jsx("span", {
        style: {
          marginRight: 10
        },
        children: props.before
      }) : null, /*#__PURE__*/jsx("div", {
        style: {
          flex: 1
        },
        children: _children
      }), props.after ? /*#__PURE__*/jsx("span", {
        style: {
          marginLeft: 10
        },
        children: props.after
      }) : null]
    });
  }
  return _children;
};

/**
 * 对 Form.Item 包装处理
 * ```
 * 1. 为 children 增加 before、after
 * 2. 对输入、输出数据进行序列化处理
 * 3. 内置布局样式使用 preDefinedClassName.formItem
 * 4. 设置隐藏域（不清除字段值） 使用hidden，存在依赖逻辑，可与dependencies属性配合使用
 * 5. 设置隐藏域（清除字段值）使用isClear，存在依赖逻辑，可与dependencies属性配合使用
 * 6. 不支持noStyle属性、children不支持函数写法、如果需要获取依赖字段值，可使用 FormItemWrapperDependencies 组件
 * 7. 设置noStyle后，可能会导致 FromItemWrapper 在 EasyFrom 内部渲染网格布局时出现异常
 *
 *
 * ** 依赖其他字段 自身切换显示隐藏 **
 * <FormItemWrapper
 *  label="label"
 *  name="xx1"
 *  dependencies={['type']}
 *  isClear={(values)  => {
 *    return values.type == 1
 *  }}>
 *  <Input placeholder="请输入" />
 * </FormItemWrapper>
 *
 * 如果只是想获取依赖字段值，可使用 FormItemWrapperDependencies 组件
 * ```
 */
var FormItemWrapper = function FormItemWrapper(props) {
  var wrapper = props.wrapper,
    isClear = props.isClear,
    labelWidth = props.labelWidth,
    labelItemVertical = props.labelItemVertical,
    labelAlign = props.labelAlign,
    _children2 = props.children,
    before = props.before,
    after = props.after,
    inputNormalize = props.inputNormalize,
    outputNormalize = props.outputNormalize,
    className = props.className,
    dependencies = props.dependencies,
    hidden = props.hidden,
    beforeAfterStyle = props.beforeAfterStyle,
    rest = _objectWithoutProperties(props, _excluded2);
  var form = Form.useFormInstance();
  var innerClassName = useMemo(function () {
    return preDefinedClassName.getFormItemLayoutClassName({
      labelWidth: labelWidth,
      labelItemVertical: labelItemVertical,
      labelAlign: labelAlign,
      className: className
    });
  }, [labelWidth, labelItemVertical, labelAlign, className]);
  if (dependencies && (dependencies === null || dependencies === void 0 ? void 0 : dependencies.length) > 0) {
    return /*#__PURE__*/jsx(Form.Item, {
      dependencies: dependencies,
      noStyle: true,
      children: function children(innerForm) {
        var innerHidden = typeof hidden === 'function' ? hidden === null || hidden === void 0 ? void 0 : hidden(innerForm.getFieldsValue()) : hidden;
        var innerIsClear = typeof isClear === 'function' ? isClear === null || isClear === void 0 ? void 0 : isClear(innerForm.getFieldsValue()) : isClear;
        var rules = rest.rules;
        if (innerIsClear || innerHidden) {
          rules = [];
        }
        return /*#__PURE__*/jsx(Form.Item, _objectSpread2(_objectSpread2({
          normalize: outputNormalize
        }, rest), {}, {
          className: innerClassName,
          hidden: innerIsClear || innerHidden,
          rules: rules,
          children: /*#__PURE__*/isValidElement(_children2) ? /*#__PURE__*/jsx(FormItemWrapperChildren, {
            wrapper: wrapper,
            before: before,
            after: after,
            inputNormalize: inputNormalize,
            isClear: innerIsClear,
            beforeAfterStyle: beforeAfterStyle,
            children: _children2
          }) : _children2
        }));
      }
    });
  }
  var innerHidden = typeof hidden === 'function' ? hidden(form.getFieldsValue()) : hidden;
  var innerIsClear = typeof isClear === 'function' ? isClear(form.getFieldsValue()) : isClear;
  return /*#__PURE__*/jsx(Form.Item, _objectSpread2(_objectSpread2({
    normalize: outputNormalize
  }, rest), {}, {
    rules: innerIsClear ? [] : rest.rules,
    className: innerClassName,
    hidden: innerHidden || innerIsClear,
    children: /*#__PURE__*/isValidElement(_children2) ? /*#__PURE__*/jsx(FormItemWrapperChildren, {
      wrapper: wrapper,
      before: before,
      after: after,
      inputNormalize: inputNormalize,
      isClear: innerIsClear,
      beforeAfterStyle: beforeAfterStyle,
      children: _children2
    }) : _children2
  }));
};
FormItemWrapper['domTypeName'] = 'FormItemWrapper';

export { FormItemWrapper as F };
//# sourceMappingURL=form-item-wrapper-BneADBjX.js.map