@lemon-fe/components 1.1.3 → 1.1.5-alpha.1

package/es/data-grid/components/custom-panel/field-modal.js

@@ -13,12 +13,12 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { Checkbox, Form, Input, Modal, Select } from 'antd';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import FormLayout from "../../../form-layout";
 import Icons from "../../../icons";
 import TipMark from "../../../tip-mark";
 import { isCustomField, prefix } from "../../utils";
-import { Checkbox, Form, Input, Modal, Select } from 'antd';
 export default function FieldModal(props) {
   var openProp = props.open,
     _onCancel = props.onCancel,
@@ -32,11 +32,6 @@ export default function FieldModal(props) {
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     form = _Form$useForm2[0];
   var ref = useRef(null);
-  var map = useMemo(function () {
-    return Object.fromEntries(nodes.map(function (item) {
-      return [item.title || '', item.id];
-    }));
-  }, [nodes]);
   var handleAddExp = function handleAddExp(data) {
     var _ref$current;
     var area = (_ref$current = ref.current) === null || _ref$current === void 0 || (_ref$current = _ref$current.resizableTextArea) === null || _ref$current === void 0 ? void 0 : _ref$current.textArea;
@@ -50,33 +45,40 @@ export default function FieldModal(props) {
       expression: prev.slice(0, pos) + "${".concat(data.title, "}") + prev.slice(pos)
     });
   };
-  var leaves = useMemo(function () {
-    var items = [];
-    nodes.forEach(function (item) {
-      if (item.column) {
-        items.push(item);
-      } else {
-        item.leaf.forEach(function (leaf) {
-          items.push(_objectSpread(_objectSpread({}, leaf), {}, {
-            title: "".concat(item.title, "-").concat(leaf.title)
-          }));
-        });
-      }
-    });
-    return items.filter(function (item) {
-      if (!item.column) {
-        return false;
-      }
-      if (isCustomField(item.id)) {
-        return false;
-      }
-      return true;
-    });
-  }, [nodes]);
+  var _useMemo = useMemo(function () {
+      var items = [];
+      nodes.forEach(function (item) {
+        if (item.column) {
+          items.push(item);
+        } else {
+          item.leaf.forEach(function (leaf) {
+            items.push(_objectSpread(_objectSpread({}, leaf), {}, {
+              title: "".concat(item.title, "-").concat(leaf.title)
+            }));
+          });
+        }
+      });
+      var showLeaves = items.filter(function (item) {
+        if (!item.column) {
+          return false;
+        }
+        if (isCustomField(item.id)) {
+          return false;
+        }
+        return true;
+      });
+      var nodeMap = Object.fromEntries(showLeaves.map(function (item) {
+        return [item.title || '', item.id];
+      }));
+      return [showLeaves, nodeMap];
+    }, [nodes]),
+    _useMemo2 = _slicedToArray(_useMemo, 2),
+    leaves = _useMemo2[0],
+    map = _useMemo2[1];
   var formatExpression = function formatExpression(expression) {
     return expression.replace(/\$\{([^{}]+)\}/g, function (match, p1) {
       if (p1) {
-        var node = nodes.find(function (item) {
+        var node = leaves.find(function (item) {
           return item.id === p1;
         });
         if (node !== undefined) {

package/es/data-grid/components/custom-panel/index.js

@@ -10,6 +10,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Button, Space, Tooltip, message } from 'antd';
 import React, { useEffect, useMemo, useState } from 'react';
+import { createPortal } from 'react-dom';
 import Icons from "../../../icons";
 import { useGridStore } from "../../hooks";
 import { prefix } from "../../utils";
@@ -18,6 +19,7 @@ import FieldModal from "./field-modal";
 import ItemWrapper from "./item";
 import { DndContext, DragOverlay, closestCenter } from '@dnd-kit/core';
 import { useDebounce, useRequest } from '@lemon-fe/hooks';
+import classNames from 'classnames';
 export default function CustomColumnPanel(params) {
   var columnApi = params.columnApi,
     api = params.api,
@@ -291,11 +293,11 @@ export default function CustomColumnPanel(params) {
       level: 0,
       key: node.key
     });
-  }))), /*#__PURE__*/React.createElement(DragOverlay, {
+  }))), /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(DragOverlay, {
     dropAnimation: null
   }, overlay ? /*#__PURE__*/React.createElement("div", {
-    className: prefix('column-panel-drag-overlay')
-  }, overlay) : null)), /*#__PURE__*/React.createElement("div", {
+    className: classNames('ag-theme-lemon', prefix('column-panel-drag-overlay'))
+  }, overlay) : null), document.body)), /*#__PURE__*/React.createElement("div", {
     className: prefix('column-panel-footer')
   }, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
     size: "small",

package/es/data-grid/index.less

@@ -486,7 +486,7 @@
 
   &-cell-detail {
     height: 100%;
-    padding: 10px;
+    padding: 10px 26px 10px 10px;
 
     &-auto-height {
       height: auto;

package/es/filter/index.js

@@ -18,6 +18,7 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty } from 'antd';
 import React, { useEffect, useMemo, useState, useContext } from 'react';
 import { ComponentConfigureContext } from "../component-configure";
 import Dropdown from "../dropdown";
@@ -26,9 +27,8 @@ import FormLayout from "../form-layout";
 import Icons from "../icons";
 import InputNumber from "../input-number";
 import TabBar from "../tab-bar";
-import { prefixClassName } from "../utils";
+import { mergeProp, prefixClassName } from "../utils";
 import { useDebounce, useRequest, useUpdateEffect } from '@lemon-fe/hooks';
-import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty } from 'antd';
 import classNames from 'classnames';
 import ResizeObserver from 'rc-resize-observer';
 var components = [{
@@ -109,7 +109,8 @@ function Filter(props) {
     legacyReset = props.legacyReset,
     componentOptions = props.componentOptions,
     _props$filterDependen = props.filterDependencies,
-    filterDependencies = _props$filterDependen === void 0 ? [] : _props$filterDependen;
+    filterDependencies = _props$filterDependen === void 0 ? [] : _props$filterDependen,
+    formProp = props.form;
   var prefix = prefixClassName('filter');
   var emptyValue = useMemo(function () {
     return Object.fromEntries(data.map(function (item) {
@@ -162,9 +163,7 @@ function Filter(props) {
   var _Form$useForm = Form.useForm(),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     modalForm = _Form$useForm2[0];
-  var _Form$useForm3 = Form.useForm(),
-    _Form$useForm4 = _slicedToArray(_Form$useForm3, 1),
-    form = _Form$useForm4[0];
+  var form = mergeProp(Form.useForm()[0], formProp);
   var _useState11 = useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
     width = _useState12[0],

package/es/filter/typings.d.ts

@@ -1,5 +1,5 @@
-import type { CSSProperties, ReactElement, ReactNode, DependencyList } from 'react';
 import type { FormInstance } from 'antd';
+import type { CSSProperties, ReactElement, ReactNode, DependencyList } from 'react';
 
 export interface FilterItemType<T = any> {
   key: string;
@@ -65,6 +65,10 @@ export interface FilterProps<T extends Record<string, any> = Record<string, any>
    * @description 自动触发过滤的依赖
    */
   filterDependencies?: DependencyList;
+  /**
+   * @description Form表单的实例，默认会由内部生成，一般情况不需要处理
+   */
+  form?: FormInstance<T>;
 }
 
 export interface ComponentOption {

package/es/select-view/index.js

@@ -15,11 +15,11 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { Spin, Tabs } from 'antd';
+import { Form, Spin, Tabs } from 'antd';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import DataGrid from "../data-grid";
 import Filter from "../filter";
-import { prefixClassName } from "../utils";
+import { mergeProp, prefixClassName } from "../utils";
 import { get } from 'lodash';
 export default function SelectView(props) {
   var emptyValue = useMemo(function () {
@@ -70,6 +70,7 @@ export default function SelectView(props) {
     _useState10 = _slicedToArray(_useState9, 2),
     loading = _useState10[0],
     setLoading = _useState10[1];
+  var filterForm = mergeProp(Form.useForm()[0], filter === null || filter === void 0 ? void 0 : filter.form);
   var cParams = (filter === null || filter === void 0 ? void 0 : filter.value) || params;
   var getRowKey = function getRowKey(item) {
     var _get;
@@ -145,7 +146,8 @@ export default function SelectView(props) {
     if (filter.data) {
       headerNode = /*#__PURE__*/React.createElement(Filter, _extends({
         simple: true,
-        autoPlaceholder: true
+        autoPlaceholder: true,
+        form: filterForm
       }, filter, {
         value: cParams,
         onChange: function onChange(val) {
@@ -155,9 +157,12 @@ export default function SelectView(props) {
     }
     if (filter.sider) {
       siderNode = filter.sider({
+        /**
+         * 原则上这里使用cParams也会有问题，不排除Filter中的条件可能会影响Sider的渲染，但此种情况先忽略，尽可能避免这个情况
+         */
         value: cParams,
         onChange: function onChange(val) {
-          return handleChangeParams(_objectSpread(_objectSpread({}, cParams), val));
+          handleChangeParams(_objectSpread(_objectSpread(_objectSpread({}, cParams), filterForm.getFieldsValue()), val));
         }
       });
     }
@@ -176,6 +181,7 @@ export default function SelectView(props) {
     return result;
   }, [selectedColumns, readOnly]);
   var content;
+  console.log(cParams);
   var renderList = function renderList() {
     return /*#__PURE__*/React.createElement("div", {
       className: prefix('layout')

package/es/utils.d.ts

@@ -1,3 +1,4 @@
 import type { ReactNode } from 'react';
 export declare function mapChildren<T>(children: ReactNode, cb: (node: ReactNode, index: number) => T): T[];
 export declare function prefixClassName(prefix: string): (val?: string) => string;
+export declare function mergeProp<T>(internal: T, prop: T | undefined): T;

package/es/utils.js

@@ -17,4 +17,7 @@ export function prefixClassName(prefix) {
   return function (val) {
     return "".concat(PREFIX_CLS, "-").concat(prefix) + (val ? "-".concat(val) : '');
   };
+}
+export function mergeProp(internal, prop) {
+  return prop || internal;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/components",
-  "version": "1.1.3",
+  "version": "1.1.5-alpha.1",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -62,5 +62,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "gitHead": "1d20795e81a4ee2bef8b7dd7e81ef53dcbfe2bed"
+  "gitHead": "e247a717369fe19915addf8721f387659a67ca00"
 }