@luck-design-biz/luckda 1.0.1 → 1.0.2-2

package/es/lowcode/view/lc-components/Tree/index.js

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["id", "wrapperRef", "className", "dataset", "width", "height", "showLine", "defaultExpandDeep", "actions", "editable", "showRootAdd", "onlyRoot", "rootAddSetting", "doubleClickExpand", "onDoubleClick", "treeNodeCheckable", "treeNodeDisableCheckbox", "treeNodeDisable", "onTreeNodeRender", "treeNodeIcon", "advance", "cancelSelect", "defaultSelect"];
-import React, { useRef, useImperativeHandle, useState, useEffect } from 'react';
+var _excluded = ["id", "className", "dataset", "width", "height", "showLine", "defaultExpandDeep", "actions", "editable", "showRootAdd", "onlyRoot", "rootAddSetting", "doubleClickExpand", "onDoubleClick", "treeNodeCheckable", "treeNodeDisableCheckbox", "treeNodeDisable", "onTreeNodeRender", "treeNodeIcon", "advance", "cancelSelect", "defaultSelect"];
+import React, { useRef, useImperativeHandle, useState, forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import { useMemoizedFn, useCreation } from 'ahooks';
 import classNames from 'classnames';
@@ -13,13 +13,14 @@ import { suid } from '@luck-design-biz/base/utils';
 import { useContext } from "../../../engine/provider/ContextProvider";
 import Wrapper from "../Wrapper";
 import { LdTree } from "../../../../index";
+import useCombinedRefs from "../../../engine/tools/useCombinedRefs";
 import { omitBadProps, executeCode } from "../../../engine/tools/helper";
 import defaultMeta from "../../../engine/meta/tree.props.default.json";
+import { LC_COMPONENT_UNIT_KEY, LC_COMPONENT_UNIT } from "../../../constants";
 import styles from "./index.less";
 var PRIMARY = window.appConfig.constraintKeys.PRIMARY;
-var LCTree = function LCTree(_ref) {
+var LCTree = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var id = _ref.id,
-    wrapperRef = _ref.wrapperRef,
     className = _ref.className,
     dataset = _ref.dataset,
     width = _ref.width,
@@ -43,20 +44,20 @@ var LCTree = function LCTree(_ref) {
     defaultSelect = _ref.defaultSelect,
     props = _objectWithoutProperties(_ref, _excluded);
   var ctx = useContext();
-  var boxRef = useRef();
   var apiRef = useRef();
-  var treeRef = useRef();
+  var wrapperRef = useRef();
+  var instanceRef = useCombinedRefs(ref);
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     selectedKeys = _useState2[0],
     setSelectedKeys = _useState2[1];
   var getTargetDom = useMemoizedFn(function () {
-    return boxRef.current;
+    return wrapperRef.current;
   });
   useImperativeHandle(apiRef, function () {
     return {
       getInstance: function getInstance() {
-        return treeRef.current;
+        return instanceRef.current;
       }
     };
   });
@@ -141,23 +142,24 @@ var LCTree = function LCTree(_ref) {
       doAction();
     }
   };
+  var _wrapperProps = useCreation(function () {
+    return _defineProperty({
+      id: id
+    }, LC_COMPONENT_UNIT_KEY, LC_COMPONENT_UNIT);
+  }, []);
   return /*#__PURE__*/React.createElement(Wrapper, {
     id: id,
     displayName: "Tree",
     getTargetDom: getTargetDom,
     api: apiRef
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: boxRef,
-    style: {
-      width: width,
-      height: height
-    }
   }, /*#__PURE__*/React.createElement(LdTree, _extends({
-    width: "100%",
-    height: "100%",
+    width: width,
+    height: height,
     id: id,
     ldId: id,
-    ref: treeRef,
+    ref: instanceRef,
+    wrapper: wrapperRef,
+    wrapperProps: _wrapperProps,
     className: classNames(styles['lc-component-tree'], _defineProperty({}, className, !!className)),
     dataSetKey: dataset === null || dataset === void 0 ? void 0 : dataset.code,
     showLine: showLine,
@@ -222,166 +224,166 @@ var LCTree = function LCTree(_ref) {
     selectedKeys: selectedKeys,
     onSelect: handleSelect,
     afterInit: afterInit
-  }, events, props))));
-};
+  }, events, props)));
+});
 LCTree.propTypes = {
-  /**
-   * @name 唯一标识
-   * @type string
-   * @disabled true
+  /**
+   * @name 唯一标识
+   * @type string
+   * @disabled true
    */
   id: PropTypes.string.isRequired,
-  /**
-   * @name 数据集
-   * @type _DataSetSelector
+  /**
+   * @name 数据集
+   * @type _DataSetSelector
    */
   dataset: PropTypes.shape({
     code: PropTypes.string.isRequired,
     uid: PropTypes.string.isRequired
   }),
-  /**
-   * @name 标题
-   * @type string
-   * @disabled true
+  /**
+   * @name 标题
+   * @type string
+   * @disabled true
    */
   title: PropTypes.string,
-  /**
-   * @name 是否只读
-   * @type boolean
+  /**
+   * @name 是否只读
+   * @type boolean
    */
   readOnly: PropTypes.bool,
-  /**
-   * @name 支持拖拽
-   * @type boolean
+  /**
+   * @name 支持拖拽
+   * @type boolean
    */
   draggable: PropTypes.bool,
-  /**
-   * @name 异步加载
-   * @type boolean
+  /**
+   * @name 异步加载
+   * @type boolean
    */
   asyncLoad: PropTypes.bool,
-  /**
-   * @name 异步加载Key
-   * @type string
+  /**
+   * @name 异步加载Key
+   * @type string
    */
   iparentid: PropTypes.string,
-  /**
-   * @name 宽度
-   * @type string
+  /**
+   * @name 宽度
+   * @type string
    */
   width: PropTypes.string,
-  /**
-   * @name 高度
-   * @type string
+  /**
+   * @name 高度
+   * @type string
    */
   height: PropTypes.string,
-  /**
-   * @name 显示线
-   * @type bool
+  /**
+   * @name 显示线
+   * @type bool
    */
   showLine: PropTypes.bool,
-  /**
-   * @name 展示字段
-   * @type string
+  /**
+   * @name 展示字段
+   * @type string
    */
   treeNodeTitle: PropTypes.string,
-  /**
-   * @name 展示字段
-   * @type string
+  /**
+   * @name 展示字段
+   * @type string
    */
   defaultExpandDeep: PropTypes.string,
-  /**
-   * @name 显示图标
-   * @type bool
+  /**
+   * @name 显示图标
+   * @type bool
    */
   showIcon: PropTypes.bool,
-  /**
-   * @name 节点图标设置
-   * @type array
+  /**
+   * @name 节点图标设置
+   * @type array
    */
   treeNodeIcon: PropTypes.array,
-  /**
-   * @name 是否显示根节点
-   * @type bool
+  /**
+   * @name 是否显示根节点
+   * @type bool
    */
   showRootAdd: PropTypes.bool,
-  /**
-   * @name 是否只有唯一一个根节点
-   * @type bool
+  /**
+   * @name 是否只有唯一一个根节点
+   * @type bool
    */
   onlyRoot: PropTypes.bool,
-  /**
-   * @name 根节点配置
-   * @type object
+  /**
+   * @name 根节点配置
+   * @type object
    */
   rootAddSetting: PropTypes.object,
-  /**
-   * @name 节点操作项
-   * @type object
+  /**
+   * @name 节点操作项
+   * @type object
    */
   actions: PropTypes.object,
-  /**
-   * @name 双击收缩节点
-   * @type bool
+  /**
+   * @name 双击收缩节点
+   * @type bool
    */
   doubleClickExpand: PropTypes.bool,
-  /**
-   * @name 复选框
-   * @type bool
+  /**
+   * @name 复选框
+   * @type bool
    */
   checkable: PropTypes.bool,
-  /**
-   * @name 节点是否有复选框
-   * @type _JSEditor
-   * @default "function treeNodeCheckable(item) { \n return true; \n}"
+  /**
+   * @name 节点是否有复选框
+   * @type _JSEditor
+   * @default "function treeNodeCheckable(item) { \n return true; \n}"
    */
   treeNodeCheckable: PropTypes.string,
-  /**
-   * @name 节点复选框是否禁用
-   * @type _JSEditor
-   * @default "function treeNodeDisableCheckbox(item) { \n return false; \n}"
+  /**
+   * @name 节点复选框是否禁用
+   * @type _JSEditor
+   * @default "function treeNodeDisableCheckbox(item) { \n return false; \n}"
    */
   treeNodeDisableCheckbox: PropTypes.string,
-  /**
-   * @name 节点是否禁用
-   * @type _JSEditor
-   * @default "function treeNodeDisable(item) { \n return false; \n}"
+  /**
+   * @name 节点是否禁用
+   * @type _JSEditor
+   * @default "function treeNodeDisable(item) { \n return false; \n}"
    */
   treeNodeDisable: PropTypes.string,
-  /**
-   * @name 节点定制渲染
-   * @type _JSEditor
-   * @default "function onTreeNodeRender(title, item) { \n return title; \n}"
+  /**
+   * @name 节点定制渲染
+   * @type _JSEditor
+   * @default "function onTreeNodeRender(title, item) { \n return title; \n}"
    */
   onTreeNodeRender: PropTypes.string,
-  /**
-   * @name 组件首次渲染时
-   * @type _JSEditor
+  /**
+   * @name 组件首次渲染时
+   * @type _JSEditor
    */
   onMount: PropTypes.string,
-  /**
-   * @name 组件卸载时
-   * @type _JSEditor
+  /**
+   * @name 组件卸载时
+   * @type _JSEditor
    */
   onUnmount: PropTypes.string,
-  /**
-   * @name 数据预处理
-   * @type _JSEditor
+  /**
+   * @name 数据预处理
+   * @type _JSEditor
    */
   processDataSource: PropTypes.string,
-  /**
-   * @name 双击事件
-   * @type _JSEditor
+  /**
+   * @name 双击事件
+   * @type _JSEditor
    */
   onDoubleClick: PropTypes.string,
-  /**
-   * @name 复选框选择事件
-   * @type _JSEditor
+  /**
+   * @name 复选框选择事件
+   * @type _JSEditor
    */
   onCheck: PropTypes.string,
-  /**
-   * @name 选中事件
-   * @type _JSEditor
+  /**
+   * @name 选中事件
+   * @type _JSEditor
    */
   onSelect: PropTypes.string
 };

package/es/lowcode/view/lc-components/Tree/index.less

@@ -1,5 +1,5 @@
-.lc-component-tree{
-}
-.lc-component-tree.runtime-tree {
-  
+.lc-component-tree{
+}
+.lc-component-tree.runtime-tree {
+  
 }