@hw-component/form 1.9.26 → 1.9.28

package/es/Form/config.d.ts

@@ -35,5 +35,10 @@ declare const componentConfig: {
         Component: import("react").ForwardRefExoticComponent<import("./modal").HFormItemProps & import("react").RefAttributes<any>>;
         placeholder: ({ label }: import("./modal").HItemProps) => string[];
     };
+    treeSelect: ({ request, options, ...props }: {
+        [x: string]: any;
+        request: any;
+        options: any;
+    }) => JSX.Element;
 };
 export default componentConfig;

package/es/Form/config.js

@@ -1,5 +1,6 @@
 // welcome to hoo hoo hoo
 import HSelect from '../Select/index.js';
+import HTreeSelect from '../Select/TreeSelect.js';
 import HInput from '../Input/index.js';
 import HInputNumber from '../Input/InputNumber.js';
 import HSelectInput from '../Input/SelectInput.js';
@@ -24,7 +25,7 @@ import HInputNumberGroup from '../Input/InputNumberGroup.js';
 
 var placeholderConfig = {
   inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload", "textArea"],
-  selectType: ["select", "datePicker", "timePicker", "colorInput"]
+  selectType: ["select", "datePicker", "timePicker", "colorInput", "treeSelect"]
 };
 var componentConfig = {
   select: HSelect,
@@ -48,7 +49,8 @@ var componentConfig = {
   verificationCodeInput: VerificationCodeInput,
   trimInput: TrimInput,
   trimTextArea: TrimTextArea,
-  inputNumberGroup: HInputNumberGroup
+  inputNumberGroup: HInputNumberGroup,
+  treeSelect: HTreeSelect
 };
 
 export { componentConfig as default, placeholderConfig };

package/es/Select/TreeSelect.d.ts

@@ -0,0 +1,7 @@
+import { TreeSelectProps } from "antd/lib/tree-select";
+import { PromiseFnResult } from "../modal";
+interface IProps extends TreeSelectProps {
+    request?: PromiseFnResult;
+}
+declare const _default: ({ request, treeData, ...props }: IProps) => JSX.Element;
+export default _default;

package/es/Select/TreeSelect.js

@@ -0,0 +1,30 @@
+// welcome to hoo hoo hoo
+import _defineProperty from '@babel/runtime-corejs3/helpers/defineProperty';
+import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/objectWithoutProperties';
+import { jsx } from 'react/jsx-runtime';
+import { TreeSelect } from 'antd';
+import { useRequest } from 'ahooks';
+
+var _excluded = ["request", "treeData"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var HTreeSelect = (function (_ref) {
+  var request = _ref.request,
+    treeData = _ref.treeData,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useRequest = useRequest(function () {
+      if (request) {
+        return request({});
+      }
+      return Promise.resolve(treeData);
+    }),
+    loading = _useRequest.loading,
+    data = _useRequest.data;
+  return jsx(TreeSelect, _objectSpread({
+    treeData: data,
+    loading: loading
+  }, props));
+});
+
+export { HTreeSelect as default };
+// powered by hdj

package/es/Upload/UrlUpload/index.d.ts

@@ -1,5 +1,5 @@
 import type { IUrlUploadProps } from "../modal";
-import { HItemProps } from "@/components/Form/modal";
+import type { HItemProps } from "@/components/Form/modal";
 declare const _default: {
     Component: ({ placeholder, value, onChange, mediaType, inputHelper, style, exFiles, spaceSize, ...props }: IUrlUploadProps) => JSX.Element;
     placeholder: ({ label }: HItemProps) => string;

package/es/index.css

@@ -14,11 +14,11 @@
   content: ":";
 }
 .ant-hw-form-label-item-tooltip {
-  margin-left: 4px;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
   display: inline-flex;
+  margin-left: 4px;
 }
 .ant-hw-form-base-item {
   display: -webkit-box;
@@ -63,10 +63,6 @@
   height: auto;
 }
 .ant-hw-form-base-item-right > .ant-form-item-label .ant-hw-form-label-item {
-  -webkit-box-pack: end;
-  -webkit-justify-content: end;
-      -ms-flex-pack: end;
-          justify-content: end;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -75,12 +71,15 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  -webkit-box-pack: end;
+  -webkit-justify-content: end;
+      -ms-flex-pack: end;
+          justify-content: end;
 }
 .ant-hw-form-base-item-right > .ant-form-item-label .ant-form-item-label > label {
   height: 32px;
 }
 .ant-hw-form-base-item-left > .ant-form-item-label .ant-hw-form-label-item {
-  text-align: left;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -89,6 +88,7 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  text-align: left;
 }
 .ant-hw-form-base-item-left > .ant-form-item-label .ant-hw-form-item-required {
   position: absolute;
@@ -125,6 +125,17 @@
 .ant-hw-form-form-item .ant-form-item-label {
   overflow: visible;
 }
+.ant-form-item-has-error .ant-hw-input-group-body {
+  border-color: #ff4d4f !important;
+}
+.ant-form-item-has-error .ant-hw-input-group-active {
+  border-color: #ff4d4f !important;
+  box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2) !important;
+}
+.ant-form-item-has-error .ant-hw-input-group-addon {
+  color: #ff4d4f;
+  border-color: #ff4d4f !important;
+}
 .ant-hw-input-group {
   display: -webkit-box !important;
   display: -webkit-flex !important;
@@ -191,9 +202,6 @@
   box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
 }
 .ant-hw-input-group .ant-hw-input-group-addon {
-  padding: 0 11px;
-  background-color: #fafafa;
-  border: 1px solid #d9d9d9;
   display: -webkit-box !important;
   display: -webkit-flex !important;
   display: -ms-flexbox !important;
@@ -202,6 +210,9 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  padding: 0 11px;
+  background-color: #fafafa;
+  border: 1px solid #d9d9d9;
 }
 .ant-hw-color-box {
   width: 22px;

package/lib/Form/config.d.ts

@@ -35,5 +35,10 @@ declare const componentConfig: {
         Component: import("react").ForwardRefExoticComponent<import("./modal").HFormItemProps & import("react").RefAttributes<any>>;
         placeholder: ({ label }: import("./modal").HItemProps) => string[];
     };
+    treeSelect: ({ request, options, ...props }: {
+        [x: string]: any;
+        request: any;
+        options: any;
+    }) => JSX.Element;
 };
 export default componentConfig;

package/lib/Form/config.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var index = require('../Select/index.js');
+var TreeSelect = require('../Select/TreeSelect.js');
 var index$6 = require('../Input/index.js');
 var InputNumber = require('../Input/InputNumber.js');
 var SelectInput = require('../Input/SelectInput.js');
@@ -27,7 +28,7 @@ var InputNumberGroup = require('../Input/InputNumberGroup.js');
 
 var placeholderConfig = {
   inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload", "textArea"],
-  selectType: ["select", "datePicker", "timePicker", "colorInput"]
+  selectType: ["select", "datePicker", "timePicker", "colorInput", "treeSelect"]
 };
 var componentConfig = {
   select: index.default,
@@ -51,7 +52,8 @@ var componentConfig = {
   verificationCodeInput: index$d.default,
   trimInput: TrimInput.default,
   trimTextArea: TrimTextArea.default,
-  inputNumberGroup: InputNumberGroup.default
+  inputNumberGroup: InputNumberGroup.default,
+  treeSelect: TreeSelect.default
 };
 
 exports.default = componentConfig;

package/lib/Select/TreeSelect.d.ts

@@ -0,0 +1,7 @@
+import { TreeSelectProps } from "antd/lib/tree-select";
+import { PromiseFnResult } from "../modal";
+interface IProps extends TreeSelectProps {
+    request?: PromiseFnResult;
+}
+declare const _default: ({ request, treeData, ...props }: IProps) => JSX.Element;
+export default _default;

package/lib/Select/TreeSelect.js

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
+var jsxRuntime = require('react/jsx-runtime');
+var antd = require('antd');
+var ahooks = require('ahooks');
+
+var _excluded = ["request", "treeData"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var HTreeSelect = (function (_ref) {
+  var request = _ref.request,
+    treeData = _ref.treeData,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useRequest = ahooks.useRequest(function () {
+      if (request) {
+        return request({});
+      }
+      return Promise.resolve(treeData);
+    }),
+    loading = _useRequest.loading,
+    data = _useRequest.data;
+  return jsxRuntime.jsx(antd.TreeSelect, _objectSpread({
+    treeData: data,
+    loading: loading
+  }, props));
+});
+
+exports.default = HTreeSelect;
+// powered by h

package/lib/Upload/UrlUpload/index.d.ts

@@ -1,5 +1,5 @@
 import type { IUrlUploadProps } from "../modal";
-import { HItemProps } from "@/components/Form/modal";
+import type { HItemProps } from "@/components/Form/modal";
 declare const _default: {
     Component: ({ placeholder, value, onChange, mediaType, inputHelper, style, exFiles, spaceSize, ...props }: IUrlUploadProps) => JSX.Element;
     placeholder: ({ label }: HItemProps) => string;

package/lib/index.css

@@ -14,11 +14,11 @@
   content: ":";
 }
 .ant-hw-form-label-item-tooltip {
-  margin-left: 4px;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
   display: inline-flex;
+  margin-left: 4px;
 }
 .ant-hw-form-base-item {
   display: -webkit-box;
@@ -63,10 +63,6 @@
   height: auto;
 }
 .ant-hw-form-base-item-right > .ant-form-item-label .ant-hw-form-label-item {
-  -webkit-box-pack: end;
-  -webkit-justify-content: end;
-      -ms-flex-pack: end;
-          justify-content: end;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -75,12 +71,15 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  -webkit-box-pack: end;
+  -webkit-justify-content: end;
+      -ms-flex-pack: end;
+          justify-content: end;
 }
 .ant-hw-form-base-item-right > .ant-form-item-label .ant-form-item-label > label {
   height: 32px;
 }
 .ant-hw-form-base-item-left > .ant-form-item-label .ant-hw-form-label-item {
-  text-align: left;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -89,6 +88,7 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  text-align: left;
 }
 .ant-hw-form-base-item-left > .ant-form-item-label .ant-hw-form-item-required {
   position: absolute;
@@ -125,6 +125,17 @@
 .ant-hw-form-form-item .ant-form-item-label {
   overflow: visible;
 }
+.ant-form-item-has-error .ant-hw-input-group-body {
+  border-color: #ff4d4f !important;
+}
+.ant-form-item-has-error .ant-hw-input-group-active {
+  border-color: #ff4d4f !important;
+  box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2) !important;
+}
+.ant-form-item-has-error .ant-hw-input-group-addon {
+  color: #ff4d4f;
+  border-color: #ff4d4f !important;
+}
 .ant-hw-input-group {
   display: -webkit-box !important;
   display: -webkit-flex !important;
@@ -191,9 +202,6 @@
   box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
 }
 .ant-hw-input-group .ant-hw-input-group-addon {
-  padding: 0 11px;
-  background-color: #fafafa;
-  border: 1px solid #d9d9d9;
   display: -webkit-box !important;
   display: -webkit-flex !important;
   display: -ms-flexbox !important;
@@ -202,6 +210,9 @@
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
+  padding: 0 11px;
+  background-color: #fafafa;
+  border: 1px solid #d9d9d9;
 }
 .ant-hw-color-box {
   width: 22px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/form",
-  "version": "1.9.26",
+  "version": "1.9.28",
   "description": "基于antd二次开发",
   "repository": {
     "type": "git",

package/src/components/DialogForm/hooks.ts

@@ -17,7 +17,6 @@ export const useModifyProps = ({
   title,
   onCancel,
   autoClear,
-
 }: ModifyPropsModal) => {
   const [modalVisible, setModalVisible] = useState(visible);
   const [modalFormData, setModalFormData] = useState(configData);

package/src/components/Form/Basic.tsx

@@ -19,7 +19,7 @@ export default ({
   const {
     form,
     itemProps: formItemProps,
-    itemSpan:formItemSpan,
+    itemSpan: formItemSpan,
     colon: formColon,
     setData,
   } = useFormContext();
@@ -33,19 +33,19 @@ export default ({
   const defaultOnPressEnter = () => {
     form.submit();
   };
-  const globalItemSpan=itemSpan||formItemSpan;
+  const globalItemSpan = itemSpan || formItemSpan;
   return (
     <Row gutter={gutter} style={{ width: "100%" }}>
       {newConfigData.map((itemData: HItemProps, index) => {
         const {
-          labelWidth: itemLabelWidth=labelWidth,
+          labelWidth: itemLabelWidth = labelWidth,
           hideLabel,
           labelAlign,
           name,
           style,
           itemProps = {},
           colon: itemColon,
-           itemSpan:configItemSpan,
+          itemSpan: configItemSpan,
         } = itemData;
         const defaultItemProps = {
           onPressEnter: dismissOnPressEnter ? undefined : defaultOnPressEnter,
@@ -61,7 +61,7 @@ export default ({
             style={style}
             itemProps={defaultItemProps as ItemPropsType}
             hideLabel={hideLabel}
-            itemSpan={configItemSpan||globalItemSpan}
+            itemSpan={configItemSpan || globalItemSpan}
             labelWidth={itemLabelWidth}
             colon={typeof itemColon === "undefined" ? formColon : itemColon}
           />

package/src/components/Form/FormItem/BasicItem.tsx

@@ -1,5 +1,5 @@
 import Label from "../Label";
-import {Form, Space, Col, Row} from "antd";
+import { Form, Space, Col, Row } from "antd";
 import React from "react";
 import Helper from "./Helper";
 import { useClassName } from "../../hooks";
@@ -119,12 +119,14 @@ const Index: React.FC<HFormItemProps> = (props) => {
   );
 };
 
-export default (props:HFormItemProps)=>{
-   const {rowWrapper,...oProps}=props;
-   if (rowWrapper){
-     return <Row style={{width:"100%"}}>
-          <Index {...oProps}/>
-     </Row>
-   }
-   return   <Index {...oProps}/>;
+export default (props: HFormItemProps) => {
+  const { rowWrapper, ...oProps } = props;
+  if (rowWrapper) {
+    return (
+      <Row style={{ width: "100%" }}>
+        <Index {...oProps} />
+      </Row>
+    );
+  }
+  return <Index {...oProps} />;
 };

package/src/components/Form/FormItem/index.tsx

@@ -10,7 +10,7 @@ export default (props: HItemProps) => {
     hideLabel: formLabelHide,
     formItemStyle,
     colon: formColon,
-    rowWrapper:formRowWrapper,
+    rowWrapper: formRowWrapper,
   } = useFormContext();
   const {
     labelWidth = formLabelWidth,
@@ -18,7 +18,7 @@ export default (props: HItemProps) => {
     hideLabel = formLabelHide,
     style = formItemStyle,
     colon,
-      rowWrapper=formRowWrapper
+    rowWrapper = formRowWrapper,
   } = props;
   const Component = useFormItemDomControl(props);
   return (

package/src/components/Form/Label.tsx

@@ -32,7 +32,7 @@ const Index: React.FC<IProps> = ({
   const className = useClassName([...array, "hw-form-label-item"]);
   const requiredClass = useClassName("hw-form-item-required");
   const noRequiredClass = useClassName("hw-form-item-no-required");
-  const tooltipClassName=useClassName("hw-form-label-item-tooltip")
+  const tooltipClassName = useClassName("hw-form-label-item-tooltip");
   return (
     <div style={{ width: labelWidth }} className={className}>
       <span className={required ? requiredClass : noRequiredClass} />

package/src/components/Form/config.ts

@@ -1,4 +1,5 @@
 import HSelect from "../Select";
+import HTreeSelect from "../Select/TreeSelect";
 import HInput from "../Input";
 import HInputNumber from "../Input/InputNumber";
 import HSelectInput from "../Input/SelectInput";
@@ -31,7 +32,13 @@ export const placeholderConfig = {
     "urlUpload",
     "textArea",
   ],
-  selectType: ["select", "datePicker", "timePicker", "colorInput"],
+  selectType: [
+    "select",
+    "datePicker",
+    "timePicker",
+    "colorInput",
+    "treeSelect",
+  ],
 };
 const componentConfig = {
   select: HSelect,
@@ -56,6 +63,7 @@ const componentConfig = {
   trimInput: TrimInput,
   trimTextArea: TrimTextArea,
   inputNumberGroup: HInputNumberGroup,
+  treeSelect: HTreeSelect,
 };
 
 export default componentConfig;

package/src/components/Form/hooks/index.ts

@@ -51,8 +51,8 @@ export const useInfoReq = ({
       form?.setFieldsValue(result);
       return result || {};
     }
-    if (typeof initialValues==="undefined"){
-      return  {};
+    if (typeof initialValues === "undefined") {
+      return {};
     }
     form?.setFieldsValue(initialValues);
     return initialValues;

package/src/components/Form/index.less

@@ -6,8 +6,8 @@
   content: ":";
 }
 .@{ant-prefix}-hw-form-label-item-tooltip {
-  margin-left: 4px;
   display: inline-flex;
+  margin-left: 4px;
 }
 .@{ant-prefix}-hw-form-base-item {
   display: flex;
@@ -47,9 +47,9 @@
 }
 .@{ant-prefix}-hw-form-base-item-right > .@{ant-prefix}-form-item-label {
   .@{ant-prefix}-hw-form-label-item {
-    justify-content: end;
     display: flex;
     align-items: center;
+    justify-content: end;
   }
   .@{ant-prefix}-form-item-label > label {
     height: 32px;
@@ -58,9 +58,9 @@
 
 .@{ant-prefix}-hw-form-base-item-left > .@{ant-prefix}-form-item-label {
   .@{ant-prefix}-hw-form-label-item {
-    text-align: left;
     display: flex;
     align-items: center;
+    text-align: left;
   }
   .@{ant-prefix}-hw-form-item-required {
     position: absolute;

package/src/components/Form/index.tsx

@@ -28,7 +28,7 @@ export default ({
   colon = true,
   dismissOnPressEnter,
   preserve,
-                  rowWrapper,
+  rowWrapper,
   ...props
 }: HFormProps) => {
   const hForm = useCurrentForm(form);
@@ -90,7 +90,7 @@ export default ({
           itemProps: formItemProps,
           itemSpan,
           setData,
-          rowWrapper
+          rowWrapper,
         }}
       >
         <Form

package/src/components/Form/modal.ts

@@ -98,7 +98,7 @@ export interface HItemProps
   labelAlign?: LabelAlignModal;
   label?: React.ReactNode | HelperModal;
   hidden?: boolean | HideModal;
-  rowWrapper?:boolean;
+  rowWrapper?: boolean;
 }
 export interface HFormProps<T = any, R = any>
   extends Omit<FormProps, "form" | "onFinish" | "labelAlign"> {
@@ -118,7 +118,7 @@ export interface HFormProps<T = any, R = any>
   formItemStyle?: React.CSSProperties;
   itemProps?: ItemPropsType;
   dismissOnPressEnter?: boolean;
-  rowWrapper?:boolean;
+  rowWrapper?: boolean;
 }
 export interface HFormItemProps extends HItemProps {
   required?: boolean;
@@ -142,7 +142,7 @@ export interface FormContextProps {
   itemProps?: ItemPropsType;
   itemSpan?: ColProps;
   setData?: (newData: any) => void;
-  rowWrapper?:boolean;
+  rowWrapper?: boolean;
 }
 interface ConfigUploadProps {
   exFiles?: string[];

package/src/components/Input/ColorInput/index.tsx

@@ -19,8 +19,8 @@ export default ({
     <Input
       {...props}
       value={value}
-      onChange={(e)=>{
-        onChange?.(e.target.value)
+      onChange={(e) => {
+        onChange?.(e.target.value);
       }}
       suffix={
         <Popover