@cloud-app-dev/vidc 2.3.0 → 3.0.0

package/es/Tree/index.css

@@ -1,38 +1,64 @@
-.bc-type-tree-layout {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  border: 1px solid var(--gray2);
-  margin-left: -1px;
+.cloudapp-c-base-tree-component {
+  padding: 10px 0;
+  user-select: none;
 }
-.bc-type-tree-layout .lm-c-tree-title-part {
-  border-bottom: 1px solid var(--gray2);
-  background-color: var(--gray5);
-}
-.bc-type-tree-layout > .cloudapp-c-base-tree-component {
-  flex: 1;
-  overflow: auto;
-}
-.bc-type-tree-layout .cloudapp-tree {
-  height: 100%;
-  overflow: auto;
+.cloudapp-c-base-tree-component .cloudapp-tree-switcher {
+  position: relative;
+  top: -2px;
+  left: 8px;
+  z-index: 2;
+  margin-right: 5px;
 }
-.bc-type-tree-layout .anticon {
-  font-size: var(--fs);
+.cloudapp-c-base-tree-component .cloudapp-tree-title {
+  font-size: var(--fs-small);
+  flex: 1 1;
 }
-.bc-type-tree-layout .cloudapp-tree-title {
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode {
+  width: 100%;
+  white-space: nowrap;
   font-size: var(--fs-small);
-  flex: 1;
+  min-width: max-content;
+  position: relative;
+  display: inline-flex;
+  width: calc(100% - 32px);
 }
-.bc-type-tree-layout .cloudapp-tree-title > span {
-  min-width: 100%;
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper {
+  font-size: var(--fs-small);
+  min-width: max-content;
+  position: relative;
   display: inline-flex;
-  justify-content: space-between;
+  width: calc(100% - 32px);
 }
-.bc-type-tree-layout .cloudapp-tree-title > span .anticon {
-  font-size: 16px;
-  color: var(--icon);
-  padding-right: 6px;
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected {
+  background: transparent;
+  color: var(--primary);
   position: relative;
-  top: 1px;
+}
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover:after,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected:after {
+  content: '';
+  width: 100%;
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  border-bottom: 1px solid var(--primary);
+}
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover .cloudapp-tree-switcher,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected .cloudapp-tree-switcher,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover .cloudapp-tree-iconEle,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected .cloudapp-tree-iconEle {
+  color: var(--primary);
+}
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover .cloudapp-tree-switcher .anticon,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected .cloudapp-tree-switcher .anticon,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper:hover .cloudapp-tree-iconEle .anticon,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode span.cloudapp-tree-node-content-wrapper.cloudapp-tree-node-selected .cloudapp-tree-iconEle .anticon {
+  color: var(--primary);
+}
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode-switcher-open .cloudapp-tree-switcher,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode-switcher-close .cloudapp-tree-switcher,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode-switcher-open .cloudapp-tree-iconEle,
+.cloudapp-c-base-tree-component .cloudapp-tree-treenode-switcher-close .cloudapp-tree-iconEle {
+  color: var(--icon);
 }

package/es/Tree/index.d.ts

@@ -1,23 +1,24 @@
+/**
+ * tree 基础组件支持各种自定义其他tree可用过它来拓展
+ */
 import React from 'react';
-import { BaseTreeProps } from './BaseTree';
+import type { DataNode, TreeProps } from 'antd/lib/tree';
 import './index.less';
-interface IBsTreeProps extends BaseTreeProps {
-    title?: React.ReactNode;
-    inputPlaceholder?: string;
-    renderHeader?: () => JSX.Element;
-    /**
-     * @description 需要默认选中时触发 事件
-     */
-    onDefailtSelect?: (id?: string) => void;
-    mode?: 'Bz' | 'Custom' | 'Place' | 'Org';
+export interface ITreeNodeProps {
+    prefix?: (node: DataNode) => JSX.Element;
+    suffix?: (node: DataNode) => JSX.Element;
+    keyword?: string;
+    key?: string;
+    nameKey?: string;
+    RenderTreeTitle?: (node: DataNode) => JSX.Element;
 }
-declare function TreeMode({ title, className, renderHeader, inputPlaceholder, treeNodeProps, onDefailtSelect, mode, showIcon, ...props }: IBsTreeProps): JSX.Element;
-declare namespace TreeMode {
-    var defaultProps: {
-        mode: string;
-        className: string;
-        treeNodeProps: {};
-        showIcon: boolean;
-    };
+export interface BaseTreeProps extends Omit<TreeProps, 'icon'> {
+    checkable?: boolean;
+    className?: string;
+    treeData?: DataNode[] | any[];
+    showIcon?: boolean;
+    treeNodeProps?: ITreeNodeProps;
+    icon?: (node: DataNode) => JSX.Element;
 }
-export default TreeMode;
+declare const BTree: React.ForwardRefExoticComponent<BaseTreeProps & React.RefAttributes<any>>;
+export default BTree;

package/es/Tree/index.js

@@ -1,198 +1,83 @@
-import _treeHelper from "@cloud-app-dev/utils/es/treeHelper";
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
+import "antd/lib/tree/style";
+import _Tree from "antd/lib/tree";
 import { __rest } from "tslib";
-import React, { useEffect, useMemo, useState } from 'react';
-import api from '../Api';
-import Title from '../Title';
-import { getParentListById, getPlaceCodesWithParent } from '../utils';
+/**
+ * tree 基础组件支持各种自定义其他tree可用过它来拓展
+ */
+
+import React, { useImperativeHandle, useMemo, useRef } from 'react';
 import IconFont from '../IconFont';
-import useHttp from '../useHttp';
-import Tree from './BaseTree';
+import HightLevel from '../HightLevel';
 import "./index.css";
-var defaultList = [];
 
-function TreeMode(_a) {
-  var title = _a.title,
+function BaseTree(_a, ref) {
+  var treeData = _a.treeData,
       className = _a.className,
-      renderHeader = _a.renderHeader,
-      inputPlaceholder = _a.inputPlaceholder,
-      treeNodeProps = _a.treeNodeProps,
-      onDefailtSelect = _a.onDefailtSelect,
-      mode = _a.mode,
       showIcon = _a.showIcon,
-      props = __rest(_a, ["title", "className", "renderHeader", "inputPlaceholder", "treeNodeProps", "onDefailtSelect", "mode", "showIcon"]);
-
-  var _useState = useState({
-    keyword: undefined,
-    expandedKeys: undefined,
-    focusKey: Date.now()
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-  /**
-   * @description 根据mode获取树的数据
-   */
-
-
-  var _useHttp = useHttp(['TreeMode', mode], function (_ref) {
-    var _ref2 = _slicedToArray(_ref, 2),
-        _ = _ref2[0],
-        mode = _ref2[1];
-
-    return mode === 'Bz' ? api.getDeviceBzTree() : mode === 'Custom' ? api.getCustomDeviceGroup() : mode === 'Org' ? api.getOrgs() : api.getPlacesByHasDevice();
-  }),
-      _useHttp$data = _useHttp.data,
-      list = _useHttp$data === void 0 ? defaultList : _useHttp$data;
-
-  var treeData = useMemo(function () {
-    return mode === 'Place' ? _treeHelper.computPlaceTree(list) : _treeHelper.computTreeList(list);
-  }, [list, mode]);
-  /**
-   * @description 实现关键字展开节点
-   */
-
-  useEffect(function () {
-    var _a, _b;
-
-    var keys = [];
-    var defaultKeys = mode === 'Place' ? [] : ((_a = treeData[0]) === null || _a === void 0 ? void 0 : _a.id) ? [(_b = treeData[0]) === null || _b === void 0 ? void 0 : _b.id] : [];
-
-    if (!state.keyword) {
-      setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          expandedKeys: defaultKeys,
-          focusKey: Date.now()
-        });
-      });
-      return;
-    }
-
-    switch (mode) {
-      case 'Place':
-        var places = list.filter(function (v) {
-          return v.areaName.includes(state.keyword);
-        });
-        places.forEach(function (v) {
-          var codes = getPlaceCodesWithParent(v.areaCode, list);
-          keys = [].concat(keys, codes);
-        });
-        break;
-
-      case 'Bz':
-      case 'Custom':
-        var trees = list.filter(function (v) {
-          return v.groupName.includes(state.keyword);
-        });
-        trees.forEach(function (v) {
-          var ids = getParentListById(v.id, list).map(function (v) {
-            return v.id;
-          });
-          keys = [].concat(keys, ids);
-        });
-
-      case 'Org':
-        var orgs = list.filter(function (v) {
-          return v.organizationName.includes(state.keyword);
-        });
-        orgs.forEach(function (v) {
-          var ids = getParentListById(v.id, list).map(function (v) {
-            return v.id;
-          });
-          keys = [].concat(keys, ids);
-        });
-        break;
-    }
-
-    var expandedKeys = _toConsumableArray(new Set(_toConsumableArray(keys)));
-
-    setState(function (old) {
-      var _a;
-
-      return Object.assign(Object.assign({}, old), {
-        expandedKeys: expandedKeys.length > 0 ? expandedKeys : [(_a = treeData[0]) === null || _a === void 0 ? void 0 : _a.id],
-        focusKey: Date.now()
-      });
-    });
-  }, [state.keyword, list, treeData, mode]);
-  var treeKey = useMemo(function () {
-    return mode === 'Place' ? 'areaCode' : 'id';
-  }, [mode]);
-  var treeName = useMemo(function () {
-    return mode === 'Place' ? 'areaName' : mode === 'Org' ? 'organizationName' : 'groupName';
-  }, [mode]);
-  /**
-   * @description 触发默认选中节点事件
-   */
-
-  useEffect(function () {
-    var id = treeData[0] ? treeData[0][treeKey] : undefined;
-    id && onDefailtSelect && onDefailtSelect(id);
-  }, [treeData, treeKey]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "bc-type-tree-layout ".concat(className)
-  }, /*#__PURE__*/React.createElement(Title, {
-    title: title,
-    value: state.keyword,
-    inputPlaceholder: inputPlaceholder,
-    onChange: function onChange(val) {
-      return setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          keyword: val
-        });
-      });
-    }
-  }), renderHeader && renderHeader(), list.length > 0 && /*#__PURE__*/React.createElement(Tree, Object.assign({}, props, {
-    treeData: treeData,
-    key: state.focusKey,
+      treeNodeProps = _a.treeNodeProps,
+      icon = _a.icon,
+      props = __rest(_a, ["treeData", "className", "showIcon", "treeNodeProps", "icon"]);
+
+  var _useMemo = useMemo(function () {
+    return treeNodeProps;
+  }, []),
+      prefix = _useMemo.prefix,
+      suffix = _useMemo.suffix,
+      keyword = _useMemo.keyword,
+      _useMemo$key = _useMemo.key,
+      key = _useMemo$key === void 0 ? 'id' : _useMemo$key,
+      _useMemo$nameKey = _useMemo.nameKey,
+      nameKey = _useMemo$nameKey === void 0 ? 'name' : _useMemo$nameKey,
+      RenderTreeTitle = _useMemo.RenderTreeTitle;
+
+  var treeRef = useRef(null);
+  useImperativeHandle(ref, function () {
+    return {
+      getCheckedKeys: function getCheckedKeys() {
+        if (!props.checkable || !treeRef.current) {
+          return [];
+        }
+
+        return treeRef.current.tree.state.checkedKeys;
+      }
+    };
+  }, [props.checkable]);
+  return /*#__PURE__*/React.createElement(_Tree, Object.assign({
+    className: "cloudapp-c-base-tree-component ".concat(className),
+    ref: treeRef,
     showIcon: showIcon,
-    onExpand: function onExpand(keys) {
-      return setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          expandedKeys: keys
-        });
-      });
-    },
-    expandedKeys: state.expandedKeys,
-    defaultExpandedKeys: treeData[0] ? [treeData[0].id] : undefined,
-    treeNodeProps: {
-      keyword: state.keyword,
-      suffix: treeNodeProps === null || treeNodeProps === void 0 ? void 0 : treeNodeProps.suffix,
-      nameKey: treeName,
-      key: treeKey
+    switcherIcon: /*#__PURE__*/React.createElement(IconFont, {
+      style: {
+        fontSize: 20,
+        verticalAlign: '-0.4em'
+      },
+      type: "icon-S_Arrow_SmallDown"
+    }),
+    treeData: treeData,
+    fieldNames: {
+      key: key,
+      title: nameKey
     },
-    icon: function icon(node) {
-      return /*#__PURE__*/React.createElement(IconFont, {
-        type: "".concat(treeData.length === 1 && node.id === treeData[0].id ? 'icon-S_Bar_Home' : mode === 'Place' ? node.level > 4 ? 'icon-S_Place_Place' : 'icon-S_Bar_Add' : 'icon-S_Photo_ListTree')
-      });
+    key: keyword,
+    titleRender: RenderTreeTitle ? RenderTreeTitle : function (node) {
+      return /*#__PURE__*/React.createElement("span", {
+        title: node[nameKey],
+        className: "tree-item-title"
+      }, /*#__PURE__*/React.createElement("span", null, showIcon && icon && icon(node), prefix && prefix(node), /*#__PURE__*/React.createElement(HightLevel, {
+        keyword: keyword,
+        name: node[nameKey]
+      })), suffix && suffix(node));
     }
-  })));
+  }, props));
 }
 
-TreeMode.defaultProps = {
-  mode: 'Bz',
+var BTree = /*#__PURE__*/React.forwardRef(BaseTree);
+BTree.defaultProps = {
+  treeData: [],
   className: '',
-  treeNodeProps: {},
-  showIcon: true
+  treeNodeProps: {
+    nameKey: 'name',
+    key: 'id'
+  }
 };
-export default TreeMode;
+export default BTree;

package/es/index.d.ts

@@ -6,36 +6,34 @@ export { default as Box } from './Box';
 export { default as CheckGroupFixed } from './CheckGroupFixed';
 export { default as Config } from './Config';
 export { default as ConfigContext } from './ConfigContext';
-export { default as DeviceIcon } from './DeviceIcon';
-export { default as DeviceSelect } from './DeviceSelect';
-export { default as Dict } from './Dict';
+export { default as DomMove } from './DomMove';
 export { default as Drag } from './Drag';
 export { default as Drawer } from './Drawer';
+export { default as ErrorBoundary } from './ErrorBoundary';
 export { default as FrontendPlayer } from './FrontendPlayer';
 export { default as FullScreen } from './FullScreen';
 export { default as HightLevel } from './HightLevel';
 export { default as IconFont } from './IconFont';
 export { default as ImageView } from './ImageView';
-export { default as InitialConfig } from './InitialConfig';
-export { default as InitialRequest } from './InitialRequest';
 export { default as Input } from './Input';
 export { default as InstanceHistory } from './InstanceHistory';
 export { default as LabelValue } from './LabelValue';
 export { default as List } from './List';
 export { default as LoaderApp } from './LoaderApp';
 export { default as LoaderScript } from './LoaderScript';
+export { default as Map } from './Map';
 export { default as Modal } from './Modal';
 export { default as Picture } from './Picture';
 export { default as Player } from './Player';
 export { default as PlayerExt } from './PlayerExt';
 export { default as Progress } from './Progress';
+export { default as ScreenPlayer } from './ScreenPlayer';
 export { default as SegmentPlayer } from './SegmentPlayer';
 export { default as Service } from './Service';
 export { default as TableLayout } from './TableLayout';
 export { default as ThemeAntd } from './ThemeAntd';
-export { default as Title } from './Title';
 export { default as Tree } from './Tree';
-export { default as UserSelect } from './UserSelect';
-export { default as WorkerFlow } from './WorkerFlow';
 export { default as useHistory } from './useHistory';
-export { default as useHttp } from './useHttp';
+export { default as useInfiniteScroll } from './useInfiniteScroll';
+export { default as useVirtualList } from './useVirtualList';
+export { default as withErrorBoundary } from './withErrorBoundary';

package/es/index.js

@@ -6,36 +6,34 @@ export { default as Box } from './Box';
 export { default as CheckGroupFixed } from './CheckGroupFixed';
 export { default as Config } from './Config';
 export { default as ConfigContext } from './ConfigContext';
-export { default as DeviceIcon } from './DeviceIcon';
-export { default as DeviceSelect } from './DeviceSelect';
-export { default as Dict } from './Dict';
+export { default as DomMove } from './DomMove';
 export { default as Drag } from './Drag';
 export { default as Drawer } from './Drawer';
+export { default as ErrorBoundary } from './ErrorBoundary';
 export { default as FrontendPlayer } from './FrontendPlayer';
 export { default as FullScreen } from './FullScreen';
 export { default as HightLevel } from './HightLevel';
 export { default as IconFont } from './IconFont';
 export { default as ImageView } from './ImageView';
-export { default as InitialConfig } from './InitialConfig';
-export { default as InitialRequest } from './InitialRequest';
 export { default as Input } from './Input';
 export { default as InstanceHistory } from './InstanceHistory';
 export { default as LabelValue } from './LabelValue';
 export { default as List } from './List';
 export { default as LoaderApp } from './LoaderApp';
 export { default as LoaderScript } from './LoaderScript';
+export { default as Map } from './Map';
 export { default as Modal } from './Modal';
 export { default as Picture } from './Picture';
 export { default as Player } from './Player';
 export { default as PlayerExt } from './PlayerExt';
 export { default as Progress } from './Progress';
+export { default as ScreenPlayer } from './ScreenPlayer';
 export { default as SegmentPlayer } from './SegmentPlayer';
 export { default as Service } from './Service';
 export { default as TableLayout } from './TableLayout';
 export { default as ThemeAntd } from './ThemeAntd';
-export { default as Title } from './Title';
 export { default as Tree } from './Tree';
-export { default as UserSelect } from './UserSelect';
-export { default as WorkerFlow } from './WorkerFlow';
 export { default as useHistory } from './useHistory';
-export { default as useHttp } from './useHttp';
+export { default as useInfiniteScroll } from './useInfiniteScroll';
+export { default as useVirtualList } from './useVirtualList';
+export { default as withErrorBoundary } from './withErrorBoundary';

package/es/useInfiniteScroll/index.d.ts

@@ -0,0 +1,16 @@
+import type { BasicTarget } from 'ahooks/lib/utils/domTarget';
+export declare type TData<T> = {
+    list: T[];
+    [key: string]: any;
+};
+declare function useInfiniteScroll<T>(fetcher: (currentData?: TData<T>) => Promise<TData<T>>, options: {
+    target?: BasicTarget;
+    isNoMore?: (data?: TData<T>) => boolean;
+    threshold?: number;
+    reloadDeps?: any[];
+}): {
+    noMore: boolean;
+    data: TData<T>;
+    loading: boolean;
+};
+export default useInfiniteScroll;