@hw-component/form 0.0.9-beta-v16 → 0.0.9-beta-v18

package/es/Form/FormItem/BasicItem.js

@@ -18,8 +18,9 @@ import { usePositionClassName, useHide } from './hooks.js';
 import { useFormContext } from '../Context/index.js';
 import { useDefaultRender } from '../hooks/useDefaultRender.js';
 import { useDefaultComponents } from '../hooks/index.js';
+import { useFormConfigContext } from '../Context/FormConfigProvider.js';
 
-var _excluded = ["hover", "labelWidth", "required", "colon", "label", "itemProps", "children", "helper", "hide", "render", "itemSpan", "hideLabel", "labelAlign"],
+var _excluded = ["hover", "labelWidth", "required", "colon", "label", "itemProps", "children", "helper", "hide", "render", "itemSpan", "hideLabel", "labelAlign", "style"],
   _excluded2 = ["labelAlign"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -66,13 +67,15 @@ var Index = function Index(props) {
     _props$hideLabel = props.hideLabel,
     hideLabel = _props$hideLabel === void 0 ? false : _props$hideLabel;
     props.labelAlign;
-    var oProps = _objectWithoutProperties(props, _excluded);
+    var style = props.style,
+    oProps = _objectWithoutProperties(props, _excluded);
   var _props$labelAlign = props.labelAlign,
     align = _props$labelAlign === void 0 ? "right" : _props$labelAlign,
     inProps = _objectWithoutProperties(props, _excluded2);
   var _useFormContext = useFormContext(),
     form = _useFormContext.form;
   var defaultComponent = useDefaultComponents();
+  var formItemStyle = useFormConfigContext("formItemStyle");
   var defaultRender = useDefaultRender(inProps, defaultComponent);
   var className = usePositionClassName(align);
   var hideItem = useHide({
@@ -93,6 +96,7 @@ var Index = function Index(props) {
         children: label
       })
     }, oProps), {}, {
+      style: style || formItemStyle,
       colon: false,
       required: false,
       children: jsx(Content, {

package/es/Form/index.d.ts

@@ -1,3 +1,3 @@
 import type { HFormProps } from "./modal";
-declare const _default: ({ configData, labelWidth, form, request, onFinish, infoRequest, valueType, initialValues, params, onValuesChange, itemSpan, hideLabel: formHideLabel, gutter, submitLoading, labelAlign: formLabelAlign, ...props }: HFormProps) => JSX.Element;
+declare const _default: ({ configData, labelWidth, form, request, onFinish, infoRequest, valueType, initialValues, params, onValuesChange, itemSpan, hideLabel: formHideLabel, gutter, submitLoading, labelAlign: formLabelAlign, formItemStyle, ...props }: HFormProps) => JSX.Element;
 export default _default;

package/es/Form/index.js

@@ -20,7 +20,7 @@ import Index from '../PageHandler/index.js';
 import useInitConfigData from './hooks/useInitConfigData.js';
 import InitSet from './InitSet.js';
 
-var _excluded = ["configData", "labelWidth", "form", "request", "onFinish", "infoRequest", "valueType", "initialValues", "params", "onValuesChange", "itemSpan", "hideLabel", "gutter", "submitLoading", "labelAlign"];
+var _excluded = ["configData", "labelWidth", "form", "request", "onFinish", "infoRequest", "valueType", "initialValues", "params", "onValuesChange", "itemSpan", "hideLabel", "gutter", "submitLoading", "labelAlign", "formItemStyle"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HForm = (function (_ref) {
@@ -42,6 +42,7 @@ var HForm = (function (_ref) {
     gutter = _ref.gutter,
     submitLoading = _ref.submitLoading,
     formLabelAlign = _ref.labelAlign,
+    formItemStyle = _ref.formItemStyle,
     props = _objectWithoutProperties(_ref, _excluded);
   var hForm = useCurrentForm(form);
   var _useInitConfigData = useInitConfigData({
@@ -101,10 +102,13 @@ var HForm = (function (_ref) {
               hideLabel = _itemData$hideLabel === void 0 ? formHideLabel : _itemData$hideLabel,
               _itemData$labelAlign = itemData.labelAlign,
               labelAlign = _itemData$labelAlign === void 0 ? formLabelAlign : _itemData$labelAlign,
-              name = itemData.name;
+              name = itemData.name,
+              _itemData$style = itemData.style,
+              style = _itemData$style === void 0 ? formItemStyle : _itemData$style;
             return /*#__PURE__*/createElement(Item, _objectSpread(_objectSpread({}, itemData), {}, {
               labelAlign: labelAlign,
               key: name || index,
+              style: style,
               hideLabel: hideLabel,
               itemSpan: itemSpan,
               labelWidth: itemLabelWidth || labelWidth

package/es/Form/modal.d.ts

@@ -62,6 +62,7 @@ export interface HFormProps<T = any, R = any> extends Omit<FormProps, "form" | "
     gutter?: Gutter | [Gutter, Gutter];
     submitLoading?: boolean;
     labelAlign?: LabelAlignModal;
+    formItemStyle?: React.CSSProperties;
 }
 export interface HFormItemProps extends HItemProps {
     required?: boolean;
@@ -99,6 +100,7 @@ export interface IFormConfigContextProps {
     dateRanges?: RangePickerProps["ranges"];
     uploadProps?: ConfigUploadProps;
     defaultComponent?: DefaultComponentModal;
+    formItemStyle?: React.CSSProperties;
 }
 interface ActionModal {
     key: string;

package/es/config.js

@@ -58,7 +58,8 @@ var baseConfig = {
     }(),
     maxSize: 1024 * 1024 * 1.8
   },
-  defaultComponent: {}
+  defaultComponent: {},
+  formItemStyle: {}
 };
 
 export { baseConfig };

package/lib/Form/FormItem/BasicItem.js

@@ -21,8 +21,9 @@ var hooks = require('./hooks.js');
 var index = require('../Context/index.js');
 var useDefaultRender = require('../hooks/useDefaultRender.js');
 var index$1 = require('../hooks/index.js');
+var FormConfigProvider = require('../Context/FormConfigProvider.js');
 
-var _excluded = ["hover", "labelWidth", "required", "colon", "label", "itemProps", "children", "helper", "hide", "render", "itemSpan", "hideLabel", "labelAlign"],
+var _excluded = ["hover", "labelWidth", "required", "colon", "label", "itemProps", "children", "helper", "hide", "render", "itemSpan", "hideLabel", "labelAlign", "style"],
   _excluded2 = ["labelAlign"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -69,13 +70,15 @@ var Index = function Index(props) {
     _props$hideLabel = props.hideLabel,
     hideLabel = _props$hideLabel === void 0 ? false : _props$hideLabel;
     props.labelAlign;
-    var oProps = _objectWithoutProperties(props, _excluded);
+    var style = props.style,
+    oProps = _objectWithoutProperties(props, _excluded);
   var _props$labelAlign = props.labelAlign,
     align = _props$labelAlign === void 0 ? "right" : _props$labelAlign,
     inProps = _objectWithoutProperties(props, _excluded2);
   var _useFormContext = index.useFormContext(),
     form = _useFormContext.form;
   var defaultComponent = index$1.useDefaultComponents();
+  var formItemStyle = FormConfigProvider.useFormConfigContext("formItemStyle");
   var defaultRender = useDefaultRender.useDefaultRender(inProps, defaultComponent);
   var className = hooks.usePositionClassName(align);
   var hideItem = hooks.useHide({
@@ -96,6 +99,7 @@ var Index = function Index(props) {
         children: label
       })
     }, oProps), {}, {
+      style: style || formItemStyle,
       colon: false,
       required: false,
       children: jsxRuntime.jsx(Content, {

package/lib/Form/index.d.ts

@@ -1,3 +1,3 @@
 import type { HFormProps } from "./modal";
-declare const _default: ({ configData, labelWidth, form, request, onFinish, infoRequest, valueType, initialValues, params, onValuesChange, itemSpan, hideLabel: formHideLabel, gutter, submitLoading, labelAlign: formLabelAlign, ...props }: HFormProps) => JSX.Element;
+declare const _default: ({ configData, labelWidth, form, request, onFinish, infoRequest, valueType, initialValues, params, onValuesChange, itemSpan, hideLabel: formHideLabel, gutter, submitLoading, labelAlign: formLabelAlign, formItemStyle, ...props }: HFormProps) => JSX.Element;
 export default _default;

package/lib/Form/index.js

@@ -23,7 +23,7 @@ var index$1 = require('../PageHandler/index.js');
 var useInitConfigData = require('./hooks/useInitConfigData.js');
 var InitSet = require('./InitSet.js');
 
-var _excluded = ["configData", "labelWidth", "form", "request", "onFinish", "infoRequest", "valueType", "initialValues", "params", "onValuesChange", "itemSpan", "hideLabel", "gutter", "submitLoading", "labelAlign"];
+var _excluded = ["configData", "labelWidth", "form", "request", "onFinish", "infoRequest", "valueType", "initialValues", "params", "onValuesChange", "itemSpan", "hideLabel", "gutter", "submitLoading", "labelAlign", "formItemStyle"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HForm = (function (_ref) {
@@ -45,6 +45,7 @@ var HForm = (function (_ref) {
     gutter = _ref.gutter,
     submitLoading = _ref.submitLoading,
     formLabelAlign = _ref.labelAlign,
+    formItemStyle = _ref.formItemStyle,
     props = _objectWithoutProperties(_ref, _excluded);
   var hForm = index.useCurrentForm(form);
   var _useInitConfigData = useInitConfigData.default({
@@ -104,10 +105,13 @@ var HForm = (function (_ref) {
               hideLabel = _itemData$hideLabel === void 0 ? formHideLabel : _itemData$hideLabel,
               _itemData$labelAlign = itemData.labelAlign,
               labelAlign = _itemData$labelAlign === void 0 ? formLabelAlign : _itemData$labelAlign,
-              name = itemData.name;
+              name = itemData.name,
+              _itemData$style = itemData.style,
+              style = _itemData$style === void 0 ? formItemStyle : _itemData$style;
             return /*#__PURE__*/React.createElement(index$3.default, _objectSpread(_objectSpread({}, itemData), {}, {
               labelAlign: labelAlign,
               key: name || index,
+              style: style,
               hideLabel: hideLabel,
               itemSpan: itemSpan,
               labelWidth: itemLabelWidth || labelWidth

package/lib/Form/modal.d.ts

@@ -62,6 +62,7 @@ export interface HFormProps<T = any, R = any> extends Omit<FormProps, "form" | "
     gutter?: Gutter | [Gutter, Gutter];
     submitLoading?: boolean;
     labelAlign?: LabelAlignModal;
+    formItemStyle?: React.CSSProperties;
 }
 export interface HFormItemProps extends HItemProps {
     required?: boolean;
@@ -99,6 +100,7 @@ export interface IFormConfigContextProps {
     dateRanges?: RangePickerProps["ranges"];
     uploadProps?: ConfigUploadProps;
     defaultComponent?: DefaultComponentModal;
+    formItemStyle?: React.CSSProperties;
 }
 interface ActionModal {
     key: string;

package/lib/config.js

@@ -59,7 +59,8 @@ var baseConfig = {
     }(),
     maxSize: 1024 * 1024 * 1.8
   },
-  defaultComponent: {}
+  defaultComponent: {},
+  formItemStyle: {}
 };
 
 exports.baseConfig = baseConfig;

package/package.json

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

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

@@ -9,6 +9,7 @@ import type { HItemProps } from "../modal";
 import { useDefaultRender } from "../hooks/useDefaultRender";
 import type { HFormItemProps } from "../modal";
 import { useDefaultComponents } from "../hooks";
+import {useFormConfigContext} from "../Context/FormConfigProvider";
 
 interface ContentProps extends Omit<HItemProps, "name"> {
   value?: any;
@@ -45,11 +46,13 @@ const Index: React.FC<HFormItemProps> = (props) => {
     itemSpan = { span: 24 },
     hideLabel = false,
     labelAlign,
+    style,
     ...oProps
   } = props;
   const { labelAlign: align = "right", ...inProps } = props;
   const { form } = useFormContext();
   const defaultComponent = useDefaultComponents();
+  const formItemStyle = useFormConfigContext("formItemStyle");
   const defaultRender = useDefaultRender(inProps, defaultComponent);
   const className = usePositionClassName(align);
   const hideItem = useHide({ hide, form });
@@ -73,6 +76,7 @@ const Index: React.FC<HFormItemProps> = (props) => {
           )
         }
         {...oProps}
+          style={style||formItemStyle}
         colon={false}
         required={false}
       >

package/src/components/Form/index.tsx

@@ -24,6 +24,7 @@ export default ({
   gutter,
   submitLoading,
   labelAlign: formLabelAlign,
+                  formItemStyle,
   ...props
 }: HFormProps) => {
   const hForm = useCurrentForm(form);
@@ -80,13 +81,15 @@ export default ({
                 labelWidth: itemLabelWidth,
                 hideLabel = formHideLabel,
                 labelAlign = formLabelAlign,
-                name
+                name,
+                  style=formItemStyle,
               } = itemData;
               return (
                 <Item
                   {...itemData}
                   labelAlign={labelAlign}
                   key={name||index}
+                  style={style}
                   hideLabel={hideLabel}
                   itemSpan={itemSpan}
                   labelWidth={itemLabelWidth || labelWidth}

package/src/components/Form/modal.ts

@@ -109,6 +109,7 @@ export interface HFormProps<T = any, R = any>
   gutter?: Gutter | [Gutter, Gutter];
   submitLoading?: boolean;
   labelAlign?: LabelAlignModal;
+  formItemStyle?:React.CSSProperties;
 }
 export interface HFormItemProps extends HItemProps {
   required?: boolean;
@@ -150,6 +151,7 @@ export interface IFormConfigContextProps {
   dateRanges?: RangePickerProps["ranges"];
   uploadProps?: ConfigUploadProps;
   defaultComponent?: DefaultComponentModal;
+  formItemStyle?:React.CSSProperties
 }
 interface ActionModal {
   key: string;

package/src/components/config.ts

@@ -38,6 +38,7 @@ export const baseConfig: IFormConfigContextProps = {
     maxSize: 1024 * 1024 * 1.8,
   },
   defaultComponent: {},
+  formItemStyle:{}
 };
 
 export default {

package/src/pages/Form/index.tsx

@@ -26,6 +26,9 @@ const formData = (options) => {
       ],
       direction: "vertical",
       labelAlign: "topLeft",
+      style:{
+        marginBottom:200
+      }
     },
     {
       label: "开关",
@@ -110,6 +113,9 @@ export default () => {
         defaultComponent={{
           test: Test,
         }}
+        formItemStyle={{
+          marginBottom:100
+        }}
         fieldNames={{
           label: "value",
           value: "key",
@@ -119,6 +125,9 @@ export default () => {
           configData={formData(options)}
           labelWidth={200}
           form={form}
+          formItemStyle={{
+            marginBottom:10
+          }}
           labelAlign={"right"}
           submitLoading={true}
           onFinish={(value) => {