vap1 0.4.7 → 0.5.0

package/components/Box/Box.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { MutableRefObject, ReactNode, CSSProperties } from 'react';
 import type { SelectBarProps } from './SelectBar';
-import type { SearchBarProps } from '../SearchTool/SearchBar';
+import type { SearchBarProps } from '../SearchTool';
 import type { ActButton } from '../SearchTool/SearchBar/ActionButtons';
 import type { Key, PlainObject } from '../../basetype';
 import type { UPaginationProps } from '../_common/Upagination';
@@ -63,6 +63,9 @@ export type BoxMode = 'common' | 'inner' | 'fixed';
  *             return <Box><Child/></Box>
  * */
 export declare const useBox: () => BoxContext;
+type SearchTool = {
+    searchBar?: SearchBarProps;
+};
 /**
  * Box 排版用于普通的信息交互，统一与简化各种排版
  *
@@ -70,7 +73,7 @@ export declare const useBox: () => BoxContext;
  * 右边 上 ： 自定义条件输入区域
  * 右边 下 ： 自定义内容展示区
 */
-export type BoxProps = {
+export type BoxProps = SearchTool & {
     /**
      * 自定义 className
     */
@@ -88,9 +91,43 @@ export type BoxProps = {
    */
     selectBar?: SelectBarProps;
     /**
-     * 搜索区域
+     * 操作区域
     */
-    searchBar?: SearchBarProps;
+    actionBar?: (ActButton[]) | ReactNode;
+    /**
+     * 分页区域
+    */
+    pagination?: UPaginationProps;
+    /**
+     * 传此项时，会自动设置 内容区域为 overflow:auto, 否则 为  overflow:hidden
+    */
+    overflowAuto?: true;
+    /**
+     * 默认查询参数
+    */
+    default?: PlainObject;
+    /**
+     * 在部分皮肤下有效，强制不显示背景
+    */
+    nobg?: boolean;
+};
+export declare const Box: React.ForwardRefExoticComponent<SearchTool & {
+    /**
+     * 自定义 className
+    */
+    className?: string;
+    /**
+     * 自定义 className
+    */
+    style?: CSSProperties;
+    /**
+     * 展示模式
+    */
+    mode?: BoxMode;
+    /**
+    * 选择区域
+   */
+    selectBar?: SelectBarProps;
     /**
      * 操作区域
     */
@@ -111,8 +148,7 @@ export type BoxProps = {
      * 在部分皮肤下有效，强制不显示背景
     */
     nobg?: boolean;
-};
-export declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<{
+} & React.RefAttributes<{
     resize: Function;
 }>>;
 export {};

package/components/Box/Box.js

@@ -26,13 +26,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __read = (this && this.__read) || function (o, n) {
     var m = typeof Symbol === "function" && o[Symbol.iterator];
     if (!m) return o;
@@ -59,11 +69,13 @@ var lodash_1 = __importDefault(require("lodash"));
 var Layout_1 = require("../_adapt/Layout");
 var hooks_1 = require("../../hooks");
 var SelectBar_1 = require("./SelectBar");
+// import { SearchBand, SearchBar } from '../SearchTool';
 var SearchBar_1 = require("../SearchTool/SearchBar");
 var Upagination_1 = require("../_common/Upagination");
 var utils_1 = require("../../utils");
 var _register_1 = require("./_register");
 var HEIGHT_OMIT = 'ubox-omit';
+var LOOP = function () { };
 var BoxContext = (0, react_1.createContext)(null);
 /**
  * 说明：如果需要使用 useBox 获取BOX内部状态
@@ -164,7 +176,52 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
     (0, react_1.useLayoutEffect)(function () {
         setTimeout(resize, 5);
     }, []);
-    return react_1.default.createElement(Layout_1.Layout, { id: domId, className: className, style: style, ref: _layoutRef },
+    var SearchTool = (0, react_1.useMemo)(function () {
+        var hasBar = lodash_1.default.has(props, 'searchBar'), 
+        // hasBand = _.has(props, 'searchBand'),
+        hasAction = lodash_1.default.has(props, 'actionBar') && !lodash_1.default.isEmpty(props.actionBar);
+        if (!hasBar && !hasAction
+        // &&!hasBand 
+        )
+            return utils_1.Const.NONE;
+        var action = false;
+        if (hasAction) {
+            if (lodash_1.default.isArray(props.actionBar) && props.actionBar.length) {
+                action = react_1.default.createElement(SearchBar_1.SearchBar.ActionButtons, { buttons: props.actionBar });
+            }
+            else if ((0, react_1.isValidElement)(props.actionBar)) {
+                action = props.actionBar;
+            }
+        }
+        // if (hasBand) {
+        //     const isFix = _.isBoolean(props.searchBand.fixMode) ? props.searchBand.fixMode : CONFIG.SEARCHBAND.FIX_MODE;
+        //     return <SearchBand
+        //         {...props.searchBand}
+        //         default={props.default}
+        //         className={HEIGHT_OMIT}
+        //         extraAction={null}
+        //         onSearch={(data) => {
+        //             props.searchBand.onSearch(data);
+        //             if (!isFix) resize();
+        //         }}
+        //     >{action}</SearchBand>
+        // }
+        if (hasBar) {
+            return react_1.default.createElement(SearchBar_1.SearchBar, __assign({}, props.searchBar, { default: props.default, className: HEIGHT_OMIT, onExpand: function (isExpand) {
+                    resize();
+                    if (lodash_1.default.isFunction(props.searchBar.onExpand)) {
+                        props.searchBar.onExpand(isExpand);
+                    }
+                } }), action);
+        }
+        if (action) {
+            return react_1.default.createElement(SearchBar_1.SearchBar, { onSearch: LOOP, default: props.default, className: HEIGHT_OMIT, onExpand: LOOP }, action);
+        }
+        return utils_1.Const.NONE;
+    }, [props.actionBar, props.searchBar,
+        // props.searchBand
+    ]);
+    return react_1.default.createElement(Layout_1.Layout, { className: className, style: style, id: domId, ref: _layoutRef },
         props.selectBar && (0, _register_1.getSelectBar)(props.selectBar.type) != null && react_1.default.createElement(SelectBar_1.SelectBar, __assign({}, props.selectBar, { ref: props.selectBar.selectRef ? props.selectBar.selectRef : selectRef, onSelect: function () {
                 var args = [];
                 for (var _a = 0; _a < arguments.length; _a++) {
@@ -185,14 +242,7 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
                         rootRef.current = el;
                 }
             } },
-            (props.searchBar ||
-                (props.actionBar && ((lodash_1.default.isArray(props.actionBar) && props.actionBar.length > 0)
-                    || (!lodash_1.default.isArray(props.actionBar) && (0, react_1.isValidElement)(props.actionBar))))) && react_1.default.createElement(SearchBar_1.SearchBar, __assign({}, props.searchBar, { default: props.default, className: HEIGHT_OMIT, onExpand: function (isExpand) {
-                    resize();
-                    if (lodash_1.default.isFunction(props.searchBar.onExpand)) {
-                        props.searchBar.onExpand(isExpand);
-                    }
-                } }), props.actionBar ? (lodash_1.default.isArray(props.actionBar) ? react_1.default.createElement(SearchBar_1.SearchBar.ActionButtons, { buttons: props.actionBar }) : props.actionBar) : []),
+            SearchTool,
             react_1.default.createElement(BoxContext.Provider, { value: { state: state, resize: resize, root: contextRef, selectRef: (props.selectBar && props.selectBar.selectRef) ? props.selectBar.selectRef : selectRef } },
                 react_1.default.createElement("div", { className: 'ubox-content', ref: contextRef }, state != null && props.children)),
             props.pagination && react_1.default.createElement(Upagination_1.UPagination, __assign({}, props.pagination, { className: HEIGHT_OMIT }))));

package/components/Box/SelectBar.d.ts

@@ -28,7 +28,7 @@ type _BoxSelectBarProps = BaseItem & {
      * 标题,如传了 ik ，则由 ik 替代之
      * 传 fasle 时，不显示标题区域
     */
-    title: string | false;
+    title: string | ReactNode | false;
     /**
      * 宽度，默认为250
      */

package/components/Box/SelectBar.js

@@ -26,13 +26,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __read = (this && this.__read) || function (o, n) {
     var m = typeof Symbol === "function" && o[Symbol.iterator];
     if (!m) return o;
@@ -91,7 +101,7 @@ exports.SelectBar = (0, react_1.forwardRef)(function (props, ref) {
     };
     if (props.title === false)
         return react_1.default.createElement(antd_1.Layout.Sider, { collapsed: false, width: width }, renderContent());
-    var title = utils_1.i18n.getText(props.ik, props.title);
+    var title = lodash_1.default.isString(props.title) ? utils_1.i18n.getText(props.ik, props.title) : ((0, react_1.isValidElement)(props.title) ? props.title : utils_1.Const.NONE);
     var SearchAction = function (props) {
         if (props.roleCode && !utils_1.PageUtil.hasRole(props.roleCode))
             return utils_1.Const.NONE;
@@ -113,7 +123,7 @@ exports.SelectBar = (0, react_1.forwardRef)(function (props, ref) {
             react_1.default.createElement("div", { className: 'c-selectbar-head' },
                 react_1.default.createElement("div", { className: 'c-selectbar-title' },
                     react_1.default.createElement(Icon_1.Icon, { type: "left-circle", title: utils_1.i18n.txt(_i18n_1.V.TXT_COLLAPSE), onClick: setCollapsed }),
-                    props.filter && react_1.default.createElement("input", { onChange: function (evt) { return utils_1.PageUtil.stopEvent(evt, function () { return setKeyword(evt.target.value); }); }, value: keyword, placeholder: utils_1.i18n.getText(props.ik, props.title) }),
+                    props.filter && react_1.default.createElement("input", { onChange: function (evt) { return utils_1.PageUtil.stopEvent(evt, function () { return setKeyword(evt.target.value); }); }, value: keyword, placeholder: utils_1.i18n.getText(props.ik, lodash_1.default.isString(props.title) ? props.title : '') }),
                     !props.filter && react_1.default.createElement("span", null, title)),
                 react_1.default.createElement("div", { className: 'c-selectbar-action' }, (props.actions || []).map(function (item) { return react_1.default.createElement(SearchAction, __assign({}, item)); }))),
             react_1.default.createElement("div", { className: 'c-selectbar-body' }, renderContent())));

package/components/Lists/BaseList.d.ts

@@ -0,0 +1,5 @@
+import type { BaseListProps, ListLayoutType } from './index';
+import type { FC } from 'react';
+export declare const BaseList: FC<BaseListProps & {
+    layout?: ListLayoutType;
+}>;

package/components/Lists/BaseList.js

@@ -0,0 +1,111 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BaseList = void 0;
+var react_1 = __importStar(require("react"));
+var lodash_1 = __importDefault(require("lodash"));
+var Fields_1 = require("./Fields");
+var Timeline_1 = require("./Timeline");
+var STable_1 = require("../Tables/STable");
+var Row_1 = require("./Row");
+var Grid_1 = require("./Grid");
+var Global_1 = require("../../utils/Global");
+var utils_1 = require("../../utils");
+var BaseList = function (props) {
+    var layout = (0, react_1.useMemo)(function () {
+        var e_1, _a;
+        if (lodash_1.default.has(props, props.layout))
+            return props.layout;
+        if (lodash_1.default.has(props, 'defaultLayout') && lodash_1.default.has(props, props.defaultLayout))
+            return props.defaultLayout;
+        try {
+            for (var _b = __values(Global_1.CONFIG.LIST.LAYOUT_ORDER), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var item = _c.value;
+                if (lodash_1.default.has(props, item.value)) {
+                    return item.value;
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        return null;
+    }, [props.layout]);
+    if (layout == null)
+        return react_1.default.createElement("div", { className: 'c-list' });
+    switch (layout) {
+        case 'fields':
+            return react_1.default.createElement(Fields_1.FieldsList, __assign({}, props));
+        case 'timeline':
+            return react_1.default.createElement(Timeline_1.TimelineList, __assign({}, props));
+        case 'columns':
+            return react_1.default.createElement(STable_1.STable, { className: utils_1.StringUtil.className(['c-list', 'c-list-columns', props.className]), mode: "inner", list: props.dataSource, columns: props.columns, pagination: false });
+        case 'row':
+            return react_1.default.createElement(Row_1.RowList, __assign({}, props));
+        case 'grids':
+            return react_1.default.createElement(Grid_1.GridList, __assign({}, props));
+    }
+    return react_1.default.createElement("div", { className: 'c-list' });
+};
+exports.BaseList = BaseList;

package/components/Lists/Fields/IconRender.d.ts

@@ -0,0 +1,53 @@
+import type { FC } from 'react';
+import type { ListContentRender } from '../index';
+import type { PlainObject } from "../../../basetype";
+declare const ICON_STATE_STATUS: readonly ["success", "processing", "error", "default", "warning"];
+type IconStateStatus = typeof ICON_STATE_STATUS[number];
+declare const ICON_TASK_STATUS: readonly ["waiting", "prepare", "ready", "doing", "finish", "error"];
+type IconTaskStatus = typeof ICON_TASK_STATUS[number];
+type IconCustom = {
+    type: 'icon';
+    render: ListContentRender;
+};
+type IconDate = {
+    type: 'date';
+    /**
+     * 时间字段
+    */
+    render: string;
+};
+/**
+ * 状态模式
+ * 等待中, 准备阶段, 准备完成, 进行中, 已完成, 出错
+*/
+type IconStatus = {
+    type: 'status';
+    render: IconStateStatus | ((record: PlainObject, i: number) => IconStateStatus);
+};
+/**
+ * 任务进度模式
+ * 等待中, 准备阶段, 准备完成, 进行中, 已完成, 出错
+*/
+type IconTask = {
+    type: 'task';
+    render: IconTaskStatus | ((record: PlainObject, i: number) => IconTaskStatus);
+};
+/**
+ * 进度模式, status  为 1-100 的数字
+*/
+type IconProgress = {
+    type: 'progress';
+    render: number | ((record: PlainObject, i: number) => number);
+};
+export type IconRender = string | IconCustom | IconDate | IconStatus | IconTask | IconProgress;
+type IconRenderComponent<T> = FC<{
+    icon: T;
+    record: PlainObject;
+    i: number;
+}>;
+export declare const ListIconIcon: IconRenderComponent<string | IconCustom>;
+export declare const ListIconDate: IconRenderComponent<IconDate>;
+export declare const ListIconStatus: IconRenderComponent<IconStatus>;
+export declare const ListIconTask: IconRenderComponent<IconTask>;
+export declare const ListIconProgress: IconRenderComponent<IconProgress>;
+export {};

package/components/Lists/Fields/IconRender.js

@@ -0,0 +1,174 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListIconProgress = exports.ListIconTask = exports.ListIconStatus = exports.ListIconDate = exports.ListIconIcon = void 0;
+var react_1 = __importStar(require("react"));
+var dayjs_1 = __importDefault(require("dayjs"));
+var lodash_1 = __importDefault(require("lodash"));
+var antd_1 = require("antd");
+var Icon_1 = require("../../_adapt/Icon");
+var Format_1 = require("../../../utils/Format");
+var ICON_STATE_STATUS = ['success', 'processing', 'error', 'default', 'warning'];
+var ICON_TASK_STATUS = ['waiting', 'prepare', 'ready', 'doing', 'finish', 'error'];
+var STATUS_MAP = new Map([
+    ['success', 'check-circle'],
+    ['processing', 'loading'],
+    ['error', 'close-circle'],
+    ['default', 'info-circle'],
+    ['warning', 'warning'],
+]);
+var TASK_MAP = new Map([
+    ['waiting', 'audit-task-status-waiting'],
+    ['prepare', 'alarm-analysis'],
+    ['ready', 'alarm-monitor'],
+    ['doing', 'audit-task-status-doing'],
+    ['finish', 'audit-task-status-finish'],
+    ['error', 'audit-task-status-error'],
+]);
+var ItemIcon = function (_a) {
+    var icon = _a.icon, className = _a.className;
+    var clazz = 'c-list-item-icon c-list-item-icon-' + className;
+    if (typeof icon == 'string') {
+        return react_1.default.createElement(Icon_1.Icon, { type: icon, className: clazz });
+    }
+    if (!(0, react_1.isValidElement)(icon)) {
+        return react_1.default.createElement(react_1.Fragment, null);
+    }
+    return icon;
+};
+var ListIconIcon = function (_a) {
+    var icon = _a.icon, record = _a.record, i = _a.i;
+    var iconType = (0, react_1.useMemo)(function () {
+        if (typeof icon == 'string')
+            return icon;
+        if (typeof icon.render == 'string') {
+            if (lodash_1.default.has(record, icon.render))
+                return record[icon.render];
+            return icon.render;
+        }
+        if (typeof icon.render == 'function') {
+            var result = icon.render(record, i);
+            return result;
+        }
+        return '';
+    }, []);
+    return react_1.default.createElement(ItemIcon, { icon: lodash_1.default.toLower(iconType), className: "icon" });
+};
+exports.ListIconIcon = ListIconIcon;
+var ListIconDate = function (_a) {
+    var icon = _a.icon, record = _a.record, i = _a.i;
+    var result = (0, dayjs_1.default)(record[icon.render]);
+    if (!result.isValid())
+        return react_1.default.createElement("div", { className: "c-list-item-icon c-list-item-icon-date" });
+    return react_1.default.createElement("div", { className: "c-list-item-icon c-list-item-icon-date" },
+        react_1.default.createElement("time", null, result.format('HH:mm:ss')),
+        react_1.default.createElement("time", null, result.format('MM-DD')));
+};
+exports.ListIconDate = ListIconDate;
+var ListIconStatus = function (_a) {
+    var icon = _a.icon, record = _a.record, i = _a.i;
+    var status = (0, react_1.useMemo)(function () {
+        var status;
+        if (typeof icon.render == 'string') {
+            if (lodash_1.default.has(record, icon.render)) {
+                status = record[icon.render];
+            }
+            else {
+                status = icon.render;
+            }
+        }
+        else if (typeof icon.render == 'function') {
+            status = icon.render(record, i);
+        }
+        status = lodash_1.default.toLower(status);
+        if (STATUS_MAP.has(status))
+            return status;
+        return 'default';
+    }, []);
+    if (status == 'processing')
+        return react_1.default.createElement(antd_1.Spin, { size: "small", className: "c-list-item-icon c-list-item-icon-status" });
+    var iconType = STATUS_MAP.get(status);
+    return react_1.default.createElement(ItemIcon, { icon: iconType, className: "status" });
+};
+exports.ListIconStatus = ListIconStatus;
+var ListIconTask = function (_a) {
+    var icon = _a.icon, record = _a.record, i = _a.i;
+    var iconType = (0, react_1.useMemo)(function () {
+        var status;
+        if (typeof icon.render == 'string') {
+            if (lodash_1.default.has(record, icon.render)) {
+                status = record[icon.render];
+            }
+            else {
+                status = icon.render;
+            }
+        }
+        else if (typeof icon.render == 'function') {
+            status = icon.render(record, i);
+        }
+        status = lodash_1.default.toLower(status);
+        if (TASK_MAP.has(status))
+            return status;
+        return 'waiting';
+    }, []);
+    return react_1.default.createElement(ItemIcon, { icon: TASK_MAP.get(iconType), className: "task" });
+};
+exports.ListIconTask = ListIconTask;
+var ListIconProgress = function (_a) {
+    var icon = _a.icon, record = _a.record, i = _a.i;
+    var percent = (0, react_1.useMemo)(function () {
+        if (typeof icon.render == 'number')
+            return icon.render;
+        if (typeof icon.render == 'function')
+            return icon.render(record, i);
+        return 0;
+    }, []);
+    return react_1.default.createElement(antd_1.Progress, { type: "dashboard", className: "c-list-item-icon c-list-item-icon-progress", 
+        // size={64}
+        percent: percent, format: function (p) {
+            var str = (0, Format_1.formatPercent)(p / 100);
+            var ptn = str.split('.');
+            return react_1.default.createElement(react_1.Fragment, null,
+                react_1.default.createElement("div", { className: "c-list-item-icon-progress-value" },
+                    react_1.default.createElement("span", null, ptn[0]),
+                    ".",
+                    react_1.default.createElement("small", null, ptn[1].substring(0, 2))),
+                react_1.default.createElement("div", { className: "c-list-item-icon-progress-precent" }, "%"));
+        } });
+};
+exports.ListIconProgress = ListIconProgress;

package/components/Lists/Fields/ItemRender.d.ts

@@ -0,0 +1,2 @@
+import type { FieldListProps, ListItemRender } from '../index';
+export declare const itemRender: (props: FieldListProps) => ListItemRender;