Merge pull request #10 from iron-tech-space/editable_table

iron-tech-space · web-flow · commit f54f4db0c2b5 · 2021-09-06T10:14:59.000+03:00
Add export `FormItems` and `FormItem`
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 0.0.78
+
+- Add export `FormItems` and `FormItem`
+
 ## 0.0.77
 
 - Fix Ant Table two load configs
diff --git a/dist/components/Form/FormItems.d.ts b/dist/components/Form/FormItems.d.ts
@@ -1,8 +1,2 @@
 export default FormItems;
 declare function FormItems(props: any): any;
-declare namespace FormItems {
-    namespace propTypes {
-        const items: PropTypes.Validator<(object | null | undefined)[]>;
-    }
-}
-import PropTypes from "prop-types";
diff --git a/dist/components/Form/FormProps.d.ts b/dist/components/Form/FormProps.d.ts
@@ -9,6 +9,12 @@ export declare type FormBodyProps = React.HTMLAttributes<HTMLDivElement> & {
     scrollable?: boolean;
 };
 export declare type FormFooterProps = React.HTMLAttributes<HTMLDivElement>;
+export declare type FormItemsProps = {
+    items: object[];
+};
+export declare type FormItemProps = {
+    child: object;
+};
 export interface FormProps extends AntFormProps {
     /** Не делать отступы у формы от краев блока. **Only config Form** */
     noPadding?: boolean;
diff --git a/dist/components/Form/index.d.ts b/dist/components/Form/index.d.ts
@@ -1,6 +1,8 @@
 import Form from "./Form";
-export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps } from "./FormProps";
+export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps, FormItemsProps, FormItemProps } from "./FormProps";
 export { FormHeader as RtFormHeader } from "./Form";
 export { FormBody as RtFormBody } from "./Form";
 export { FormFooter as RtFormFooter } from "./Form";
+export { default as RtFormItems } from "./FormItems";
+export { default as RtFormItem } from "./FormItem";
 export default Form;
diff --git a/dist/components/index.d.ts b/dist/components/index.d.ts
@@ -15,6 +15,8 @@ import { FormProps } from "./Form";
 import { FormHeaderProps } from "./Form";
 import { FormBodyProps } from "./Form";
 import { FormFooterProps } from "./Form";
+import { FormItemsProps } from "./Form";
+import { FormItemProps } from "./Form";
 import { FormListProps } from "antd/lib/form";
 import { InputNumberProps } from "antd/lib/input-number";
 import { InputProps } from "antd/lib/input/Input";
@@ -53,6 +55,8 @@ export declare const Form: FunctionComponent<FormProps>;
 export declare const FormHeader: FunctionComponent<FormHeaderProps>;
 export declare const FormBody: FunctionComponent<FormBodyProps>;
 export declare const FormFooter: FunctionComponent<FormFooterProps>;
+export declare const FormItems: FunctionComponent<FormItemsProps>;
+export declare const FormItem: FunctionComponent<FormItemProps>;
 export declare const FormList: FunctionComponent<FormListProps & StoreProps>;
 export declare const InputNumber: FunctionComponent<InputNumberProps & StoreProps>;
 export declare const Input: FunctionComponent<InputProps & StoreProps>;
diff --git a/dist/index.es.js b/dist/index.es.js
diff --git a/dist/index.es.js.map b/dist/index.es.js.map
diff --git a/dist/index.js b/dist/index.js
diff --git a/dist/index.js.map b/dist/index.js.map
diff --git a/lib/components/Form/FormItems.js b/lib/components/Form/FormItems.js
@@ -5,79 +5,74 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
 
+function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
+
 import React from "react";
-import PropTypes from "prop-types";
 import FormItem from "./FormItem";
 
-import { getObjectExcludedProps } from "../utils/baseUtils";
 import { renderDeclarativeByName } from "../core/renders";
 
-var excludeProps = ["children", "componentType"];
-
 var FormItems = function FormItems(props) {
     var items = props.items;
-
     // console.log('FormItems props => ', props);
 
-    var getItems = function getItems(data, antFormListParams) {
-
+    var getItems = function getItems(data, formListProps) {
         return data && data.map(function (item, index) {
-            var itemProps = getObjectExcludedProps(item, excludeProps);
+            var componentType = item.componentType,
+                children = item.children,
+                itemProps = _objectWithoutProperties(item, ["componentType", "children"]);
             // console.log('FormItems index => ', index);
 
-            switch (item.componentType) {
+
+            switch (componentType) {
                 case "Item":
                     var _item = _extends({}, item);
                     var _key = index;
-                    if (antFormListParams && antFormListParams.field) {
+                    if (formListProps && formListProps.field) {
                         if (_item.name) {
                             if (Array.isArray(_item.name)) {
-                                _item.name = [antFormListParams.field.name].concat(_toConsumableArray(_item.name));
-                                _item.fieldKey = [antFormListParams.field.name].concat(_toConsumableArray(_item.name));
+                                _item.name = [formListProps.field.name].concat(_toConsumableArray(_item.name));
+                                _item.fieldKey = [formListProps.field.name].concat(_toConsumableArray(_item.name));
                             } else {
-                                _item.name = [antFormListParams.field.name, _item.name];
-                                _item.fieldKey = [antFormListParams.field.name].concat(_toConsumableArray(_item.name));
+                                _item.name = [formListProps.field.name, _item.name];
+                                _item.fieldKey = [formListProps.field.name].concat(_toConsumableArray(_item.name));
                             }
                         }
                     }
                     // console.log('_item ', _item.name);
-                    return React.createElement(FormItem, _extends({ key: "" + _key }, _item, { field: _extends({}, antFormListParams) }));
+                    return React.createElement(FormItem, _extends({ key: "" + _key }, _item, { field: _extends({}, formListProps) }));
                 case "ListItems":
                     return React.createElement(
                         _Form.List,
                         _extends({ key: index }, itemProps),
                         function (fields, operation) {
                             var param = { fields: [].concat(_toConsumableArray(fields)), operation: _extends({}, operation) };
-                            return getItems(item.children, param);
+                            return getItems(children, param);
                         }
                     );
                 case "ListItem":
-                    // console.log('antFormListParams => ', antFormListParams);
+                    // console.log('formListProps => ', formListProps);
                     return React.createElement(
                         "div",
                         { key: index },
-                        antFormListParams && antFormListParams.fields && antFormListParams.fields.map(function (field, fIndex) {
+                        formListProps && formListProps.fields && formListProps.fields.map(function (field, fIndex) {
                             // console.log('index field.key', index, field);
-                            var param = _extends({ field: _extends({}, field) }, antFormListParams);
+                            var param = _extends({ field: _extends({}, field) }, formListProps);
                             return React.createElement(
                                 "div",
                                 { key: field.key },
-                                getItems(item.children, param),
+                                getItems(children, param),
                                 " "
                             );
                         })
                     );
                 default:
-                    return renderDeclarativeByName(item.componentType)(_extends({ key: index }, itemProps))(getItems(item.children, antFormListParams));
+                    return renderDeclarativeByName(componentType)(_extends({ key: index }, itemProps))(getItems(children, formListProps));
             }
         }) || null;
     };
 
     return getItems(items);
 };
 
-FormItems.propTypes = {
-    items: PropTypes.arrayOf(PropTypes.object).isRequired
-};
-
 export default FormItems;
diff --git a/lib/components/Form/FormProps.ts b/lib/components/Form/FormProps.ts
@@ -11,6 +11,13 @@ export type FormBodyProps = React.HTMLAttributes<HTMLDivElement> & {
 }
 export type FormFooterProps = React.HTMLAttributes<HTMLDivElement>
 
+export type FormItemsProps = {
+    items: object[];
+}
+export type FormItemProps = {
+    child: object;
+}
+
 export interface FormProps extends AntFormProps{
     /** Не делать отступы у формы от краев блока. **Only config Form** */
     noPadding?: boolean;
diff --git a/lib/components/Form/index.ts b/lib/components/Form/index.ts
@@ -1,10 +1,13 @@
 import Form from "./Form";
 
 
-export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps } from "./FormProps";
+export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps, FormItemsProps, FormItemProps } from "./FormProps";
 
 export { FormHeader as RtFormHeader } from "./Form";
 export { FormBody as RtFormBody } from "./Form";
 export { FormFooter as RtFormFooter } from "./Form";
 
+export { default as RtFormItems } from "./FormItems";
+export { default as RtFormItem } from "./FormItem";
+
 export default Form;
diff --git a/lib/components/core/renders.tsx b/lib/components/core/renders.tsx
@@ -1,6 +1,6 @@
 import React, { ReactNode } from "react";
 import { LabelProps } from "./wrappers";
-import * as classic from "../index";
+import * as rtComponents from "../index";
 
 
 export const render = (Component: React.ComponentType) => (props: any) =>
@@ -14,21 +14,21 @@ export const renderComponentType = (Component: React.ComponentType, componentTyp
 
 export const renderClassicByName = (componentName: string) => (props: any) => {
     // @ts-ignore
-    if(classic[componentName]) {
+    if(rtComponents[componentName]) {
         // console.log("renderClassicByName => ", props);
         // @ts-ignore
-        return render(classic[componentName])(props)
+        return render(rtComponents[componentName])(props)
     } else {
         console.log("NO renderClassicByName => ", componentName);
         return null;
     }
 }
 export const renderDeclarativeByName = (componentName: string) => (props: any) => (children: ReactNode) => {
     // @ts-ignore
-    if(classic[componentName]) {
+    if(rtComponents[componentName]) {
         // console.log("renderDeclarativeByName => ", props);
         // @ts-ignore
-        return render(classic[componentName])({...props, children})
+        return render(rtComponents[componentName])({...props, children})
     } else {
         console.log("NO renderDeclarativeByName => ", componentName);
         return null;
diff --git a/lib/components/index.ts b/lib/components/index.ts
@@ -33,6 +33,8 @@ import RtForm, {FormProps} from "./Form";
 import { RtFormHeader, FormHeaderProps } from "./Form";
 import { RtFormBody, FormBodyProps } from "./Form";
 import { RtFormFooter, FormFooterProps } from "./Form";
+import { RtFormItems, FormItemsProps } from "./Form";
+import { RtFormItem, FormItemProps } from "./Form";
 import AntForm, { FormListProps } from "antd/lib/form";
 import AntInputNumber, { InputNumberProps } from "antd/lib/input-number";
 import AntInput, { InputProps } from "antd/lib/input/Input";
@@ -87,6 +89,8 @@ export const Form:       FunctionComponent<FormProps> =          RtForm;
 export const FormHeader: FunctionComponent<FormHeaderProps> =    RtFormHeader;
 export const FormBody:   FunctionComponent<FormBodyProps> =      RtFormBody;
 export const FormFooter: FunctionComponent<FormFooterProps> =    RtFormFooter;
+export const FormItems:  FunctionComponent<FormItemsProps> =     RtFormItems;
+export const FormItem:   FunctionComponent<FormItemProps> =      RtFormItem;
 export const FormList:   FunctionComponent<FormListProps & StoreProps> =    withStore(AntForm.List);
 export const InputNumber:FunctionComponent<InputNumberProps & StoreProps> = withPlaceholder(AntInputNumber, 'Введите значение');
 export const Input:      FunctionComponent<InputProps & StoreProps> =       withPlaceholder(AntInput, 'Введите значение');
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "rt-design",
-	"version": "0.0.77",
+	"version": "0.0.78",
 	"description": "React technical design library",
 	"author": "Iron tech space",
 	"license": "MIT",
@@ -23,7 +23,7 @@
 		"clean": "rm -rf node_modules package-lock.json && npm run clean:lib && npm run clean:dist",
 		"reinstall": "npm run clean && npm install",
 		"rebuild": "npm run clean && npm install && npm run build",
-		"start:dist": "rollup -c -w",
+		"start": "rollup -c -w",
 		"prepare": "npm run build",
 		"predeploy": "cd website && npm install && npm run build",
 		"prettier:lib": "prettier --write 'src/**/*'",
diff --git a/src/components/Form/FormItems.js b/src/components/Form/FormItems.js
@@ -1,71 +1,59 @@
 import React from "react";
-import PropTypes from "prop-types";
 import FormItem from "./FormItem";
 import { Form as AntForm } from "antd";
-import { getObjectExcludedProps } from "../utils/baseUtils";
 import { renderDeclarativeByName } from "../core/renders";
 
-const excludeProps = ["children", "componentType"];
-
 const FormItems = (props) => {
     const { items } = props;
-
     // console.log('FormItems props => ', props);
-
-    const getItems = (data, antFormListParams) => {
-
+    const getItems = (data, formListProps) => {
         return (data && data.map((item, index) => {
-            let itemProps = getObjectExcludedProps(item, excludeProps);
+            const {componentType, children, ...itemProps} = item;
             // console.log('FormItems index => ', index);
-
-            switch (item.componentType) {
+            switch (componentType) {
                 case "Item":
                     let _item = { ...item };
                     let _key = index;
-                    if (antFormListParams && antFormListParams.field) {
+                    if (formListProps && formListProps.field) {
                         if (_item.name) {
                             if (Array.isArray(_item.name)) {
-                                _item.name = [antFormListParams.field.name, ..._item.name];
-                                _item.fieldKey = [antFormListParams.field.name, ..._item.name];
+                                _item.name = [formListProps.field.name, ..._item.name];
+                                _item.fieldKey = [formListProps.field.name, ..._item.name];
                             } else {
-                                _item.name = [antFormListParams.field.name, _item.name];
-                                _item.fieldKey = [antFormListParams.field.name, ..._item.name];
+                                _item.name = [formListProps.field.name, _item.name];
+                                _item.fieldKey = [formListProps.field.name, ..._item.name];
                             }
                         }
                     }
                     // console.log('_item ', _item.name);
-                    return <FormItem key={`${_key}`} {..._item} field={{ ...antFormListParams }}/>;
+                    return <FormItem key={`${_key}`} {..._item} field={{ ...formListProps }}/>;
                 case "ListItems":
                     return (
                         <AntForm.List key={index} {...itemProps}>
                             {(fields, operation) => {
                                 const param = { fields: [...fields], operation: { ...operation } };
-                                return getItems(item.children, param);
+                                return getItems(children, param);
                             }}
                         </AntForm.List>
                     );
                 case "ListItem":
-                    // console.log('antFormListParams => ', antFormListParams);
+                    // console.log('formListProps => ', formListProps);
                     return (
                         <div key={index}>
-                            {antFormListParams && antFormListParams.fields && antFormListParams.fields.map((field, fIndex) => {
+                            {formListProps && formListProps.fields && formListProps.fields.map((field, fIndex) => {
                                 // console.log('index field.key', index, field);
-                                const param = { field: { ...field }, ...antFormListParams };
-                                return <div key={field.key}>{getItems(item.children, param)} </div>;
+                                const param = { field: { ...field }, ...formListProps };
+                                return <div key={field.key}>{getItems(children, param)} </div>;
                             })}
                         </div>
                     );
                 default:
-                    return renderDeclarativeByName(item.componentType)({ key: index, ...itemProps })(getItems(item.children, antFormListParams))
+                    return renderDeclarativeByName(componentType)({ key: index, ...itemProps })(getItems(children, formListProps))
             }
         })) || null;
     };
 
     return getItems(items);
 };
 
-FormItems.propTypes = {
-    items: PropTypes.arrayOf(PropTypes.object).isRequired
-};
-
 export default FormItems;
diff --git a/src/components/Form/FormProps.ts b/src/components/Form/FormProps.ts
@@ -11,6 +11,13 @@ export type FormBodyProps = React.HTMLAttributes<HTMLDivElement> & {
 }
 export type FormFooterProps = React.HTMLAttributes<HTMLDivElement>
 
+export type FormItemsProps = {
+    items: object[];
+}
+export type FormItemProps = {
+    child: object;
+}
+
 export interface FormProps extends AntFormProps{
     /** Не делать отступы у формы от краев блока. **Only config Form** */
     noPadding?: boolean;
diff --git a/src/components/Form/index.ts b/src/components/Form/index.ts
@@ -1,10 +1,13 @@
 import Form from "./Form";
 
 
-export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps } from "./FormProps";
+export type { FormProps, FormHeaderProps, FormBodyProps, FormFooterProps, FormItemsProps, FormItemProps } from "./FormProps";
 
 export { FormHeader as RtFormHeader } from "./Form";
 export { FormBody as RtFormBody } from "./Form";
 export { FormFooter as RtFormFooter } from "./Form";
 
+export { default as RtFormItems } from "./FormItems";
+export { default as RtFormItem } from "./FormItem";
+
 export default Form;
diff --git a/src/components/core/renders.tsx b/src/components/core/renders.tsx
diff --git a/src/components/index.ts b/src/components/index.ts
