amis 2.3.2-beta.1 → 2.4.1-beta.0

package/lib/renderers/Chart.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -13,13 +13,27 @@ var amisCore = require('amis-core');
 var cx = require('classnames');
 var mobxStateTree = require('mobx-state-tree');
 var debouce = require('lodash/debounce');
+var pick = require('lodash/pick');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var debouce__default = /*#__PURE__*/_interopDefaultLegacy(debouce);
+var pick__default = /*#__PURE__*/_interopDefaultLegacy(pick);
 
+var DEFAULT_EVENT_PARAMS = [
+    'componentType',
+    'seriesType',
+    'seriesIndex',
+    'seriesName',
+    'name',
+    'dataIndex',
+    'data',
+    'dataType',
+    'value',
+    'color'
+];
 var EVAL_CACHE = {};
 /**
  * ECharts 中有些配置项可以写函数，但 JSON 中无法支持，为了实现这个功能，需要将看起来像函数的字符串转成函数类型
@@ -72,6 +86,7 @@ var Chart = /** @class */ (function (_super) {
         _this.reload = _this.reload.bind(_this);
         _this.reloadEcharts = debouce__default["default"](_this.reloadEcharts.bind(_this), 300); //过于频繁更新 ECharts 会报错
         _this.handleClick = _this.handleClick.bind(_this);
+        _this.dispatchEvent = _this.dispatchEvent.bind(_this);
         _this.mounted = true;
         props.config && _this.renderChart(props.config);
         return _this;
@@ -116,15 +131,37 @@ var Chart = /** @class */ (function (_super) {
         clearTimeout(this.timer);
     };
     Chart.prototype.handleClick = function (ctx) {
-        var _a = this.props, onAction = _a.onAction, clickAction = _a.clickAction, data = _a.data;
-        clickAction &&
-            onAction &&
-            onAction(null, clickAction, amisCore.createObject(data, ctx));
+        return tslib.__awaiter(this, void 0, void 0, function () {
+            var _a, onAction, clickAction, data, dispatchEvent, rendererEvent;
+            return tslib.__generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, onAction = _a.onAction, clickAction = _a.clickAction, data = _a.data, dispatchEvent = _a.dispatchEvent;
+                        return [4 /*yield*/, dispatchEvent(ctx.event, amisCore.createObject(data, tslib.__assign({}, pick__default["default"](ctx, DEFAULT_EVENT_PARAMS))))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/];
+                        }
+                        clickAction &&
+                            onAction &&
+                            onAction(null, clickAction, amisCore.createObject(data, ctx));
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    Chart.prototype.dispatchEvent = function (ctx) {
+        var _a = this.props, data = _a.data, dispatchEvent = _a.dispatchEvent;
+        dispatchEvent(ctx.event, amisCore.createObject(data, tslib.__assign({}, pick__default["default"](ctx, ctx.type === 'legendselectchanged'
+            ? ['name', 'selected']
+            : DEFAULT_EVENT_PARAMS))));
     };
     Chart.prototype.refFn = function (ref) {
         var _this = this;
         var chartRef = this.props.chartRef;
-        var _a = this.props, chartTheme = _a.chartTheme, onChartWillMount = _a.onChartWillMount, onChartUnMount = _a.onChartUnMount, env = _a.env;
+        var _a = this.props, chartTheme = _a.chartTheme, onChartWillMount = _a.onChartWillMount, onChartUnMount = _a.onChartUnMount, env = _a.env, loadBaiduMap = _a.loadBaiduMap, data = _a.data;
+        var _b = this.props, mapURL = _b.mapURL, mapName = _b.mapName;
         var onChartMount = this.props.onChartMount;
         if (ref) {
             Promise.all([
@@ -137,39 +174,63 @@ var Chart = /** @class */ (function (_super) {
             ]).then(function (_a) {
                 var echarts = _a[0], ecStat = _a[1];
                 return tslib.__awaiter(_this, void 0, void 0, function () {
-                    var theme;
+                    var mapGeoResult, theme;
                     var _this = this;
                     return tslib.__generator(this, function (_b) {
                         switch (_b.label) {
                             case 0:
                                 window.echarts = echarts;
-                                window.ecStat = ecStat;
+                                window.ecStat = (ecStat === null || ecStat === void 0 ? void 0 : ecStat.default) || ecStat;
+                                if (!(mapURL && mapName)) return [3 /*break*/, 2];
+                                if (amisCore.isPureVariable(mapURL)) {
+                                    mapURL = amisCore.resolveVariableAndFilter(mapURL, data);
+                                }
+                                if (amisCore.isPureVariable(mapName)) {
+                                    mapName = amisCore.resolveVariableAndFilter(mapName, data);
+                                }
+                                return [4 /*yield*/, env.fetcher(mapURL, data)];
+                            case 1:
+                                mapGeoResult = _b.sent();
+                                if (!mapGeoResult.ok) {
+                                    console.warn('fetch map geo error ' + mapURL);
+                                }
+                                echarts.registerMap(mapName, mapGeoResult.data);
+                                _b.label = 2;
+                            case 2:
+                                if (!loadBaiduMap) return [3 /*break*/, 4];
+                                return [4 /*yield*/, amisCore.loadScript("//api.map.baidu.com/api?v=3.0&ak=".concat(this.props.ak, "&callback={{callback}}"))];
+                            case 3:
+                                _b.sent();
+                                _b.label = 4;
+                            case 4:
                                 theme = 'default';
                                 if (chartTheme) {
                                     echarts.registerTheme('custom', chartTheme);
                                     theme = 'custom';
                                 }
-                                if (!onChartWillMount) return [3 /*break*/, 2];
+                                if (!onChartWillMount) return [3 /*break*/, 6];
                                 return [4 /*yield*/, onChartWillMount(echarts)];
-                            case 1:
+                            case 5:
                                 _b.sent();
-                                _b.label = 2;
-                            case 2:
+                                _b.label = 6;
+                            case 6:
                                 echarts.registerTransform(ecStat.transform.regression);
                                 echarts.registerTransform(ecStat.transform.histogram);
                                 echarts.registerTransform(ecStat.transform.clustering);
-                                if (!env.loadChartExtends) return [3 /*break*/, 4];
+                                if (!env.loadChartExtends) return [3 /*break*/, 8];
                                 return [4 /*yield*/, env.loadChartExtends()];
-                            case 3:
+                            case 7:
                                 _b.sent();
-                                _b.label = 4;
-                            case 4:
+                                _b.label = 8;
+                            case 8:
                                 this.echarts = echarts.init(ref, theme);
                                 if (typeof onChartMount === 'string') {
                                     onChartMount = new Function('chart', 'echarts');
                                 }
                                 onChartMount === null || onChartMount === void 0 ? void 0 : onChartMount(this.echarts, echarts);
                                 this.echarts.on('click', this.handleClick);
+                                this.echarts.on('mouseover', this.dispatchEvent);
+                                this.echarts.on('legendselectchanged', this.dispatchEvent);
                                 this.unSensor = amisCore.resizeSensor(ref, function () {
                                     var _a;
                                     var width = ref.offsetWidth;
@@ -198,6 +259,10 @@ var Chart = /** @class */ (function (_super) {
         }
         this.ref = ref;
     };
+    Chart.prototype.doAction = function (action, data, throwErrors) {
+        var _a, _b;
+        return (_b = (_a = this.echarts) === null || _a === void 0 ? void 0 : _a.dispatchAction) === null || _b === void 0 ? void 0 : _b.call(_a, tslib.__assign({ type: action.actionType }, data));
+    };
     Chart.prototype.reload = function (subpath, query, ctx, silent, replace) {
         var _this = this;
         var _a, _b;

package/lib/renderers/Code.d.ts

@@ -4,6 +4,13 @@
 import React from 'react';
 import { BaseSchema } from '../Schema';
 import { RendererProps } from 'amis-core';
+import type { editor as EditorNamespace } from 'monaco-editor';
+export declare type MonacoEditor = typeof EditorNamespace;
+export declare type CodeBuiltinTheme = EditorNamespace.BuiltinTheme;
+export declare type IMonaco = {
+    editor: MonacoEditor;
+    [propName: string]: any;
+};
 export interface Token {
     /**
      * token 的正则
@@ -39,6 +46,10 @@ export interface CustomLang {
      * token
      */
     tokens: Token[];
+    /**
+     * 编辑器颜色相关配置，不传使用内置默认值
+     */
+    colors?: EditorNamespace.IColors;
 }
 /**
  * 代码高亮组件
@@ -50,7 +61,7 @@ export interface CodeSchema extends BaseSchema {
      * 语言类型
      */
     language?: 'bat' | 'c' | 'coffeescript' | 'cpp' | 'csharp' | 'css' | 'dockerfile' | 'fsharp' | 'go' | 'handlebars' | 'html' | 'ini' | 'java' | 'javascript' | 'json' | 'less' | 'lua' | 'markdown' | 'msdax' | 'objective-c' | 'php' | 'plaintext' | 'postiats' | 'powershell' | 'pug' | 'python' | 'r' | 'razor' | 'ruby' | 'sb' | 'scss' | 'shell' | 'sol' | 'sql' | 'swift' | 'typescript' | 'vb' | 'xml' | 'yaml' | string;
-    editorTheme?: string;
+    editorTheme?: CodeBuiltinTheme;
     /**
      * tab 大小
      */
@@ -63,21 +74,30 @@ export interface CodeSchema extends BaseSchema {
      * 自定义语言
      */
     customLang?: CustomLang;
+    /**
+     * 使用的标签，默认多行使用pre，单行使用code
+     */
+    wrapperComponent?: string;
 }
-export interface CodeProps extends RendererProps, Omit<CodeSchema, 'type' | 'className'> {
+export interface CodeProps extends RendererProps, Omit<CodeSchema, 'type' | 'className' | 'wrapperComponent'> {
+    wrapperComponent?: any;
 }
 export default class Code extends React.Component<CodeProps> {
+    static propsList: string[];
     static defaultProps: Partial<CodeProps>;
-    monaco: any;
+    monaco: IMonaco;
     toDispose: Array<Function>;
     codeRef: React.RefObject<HTMLElement>;
     customLang: CustomLang;
     sourceCode: string;
     constructor(props: CodeProps);
+    shouldComponentUpdate(nextProps: CodeProps): boolean;
     componentDidMount(): void;
-    componentDidUpdate(preProps: CodeProps): void;
-    handleMonaco(monaco: any): void;
-    registTheme(): string | null;
+    componentDidUpdate(preProps: CodeProps): Promise<void>;
+    handleMonaco(monaco: any): Promise<void>;
+    resolveLanguage(props?: CodeProps): string;
+    /** 注册并返回当前主题名称，如果未自定义主题，则范围editorTheme值，默认为'vs' */
+    registerAndGetTheme(): string;
     render(): JSX.Element;
 }
 export declare class CodeRenderer extends Code {

package/lib/renderers/Code.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -9,13 +9,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
 var React = require('react');
-var isEqual = require('lodash/isEqual');
+var isPlainObject = require('lodash/isPlainObject');
 var amisCore = require('amis-core');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
+var isPlainObject__default = /*#__PURE__*/_interopDefaultLegacy(isPlainObject);
 
 var Code = /** @class */ (function (_super) {
     tslib.__extends(Code, _super);
@@ -25,58 +25,113 @@ var Code = /** @class */ (function (_super) {
         _this.codeRef = React__default["default"].createRef();
         return _this;
     }
+    Code.prototype.shouldComponentUpdate = function (nextProps) {
+        return (amisCore.anyChanged(Code.propsList, this.props, nextProps) ||
+            this.resolveLanguage(this.props) !== this.resolveLanguage(nextProps) ||
+            amisCore.getPropValue(this.props) !== amisCore.getPropValue(nextProps));
+    };
     Code.prototype.componentDidMount = function () {
         var _this = this;
         Promise.resolve().then(function() {return new Promise(function(fullfill) {require(['monaco-editor'], function(mod) {fullfill(tslib.__importStar(mod))})})}).then(function (monaco) { return _this.handleMonaco(monaco); });
     };
     Code.prototype.componentDidUpdate = function (preProps) {
-        var _this = this;
-        var props = this.props;
-        var sourceCode = amisCore.getPropValue(this.props);
-        var preSourceCode = amisCore.getPropValue(this.props);
-        if (sourceCode !== preSourceCode ||
-            (props.customLang && !isEqual__default["default"](props.customLang, preProps.customLang))) {
-            var dom_1 = this.codeRef.current;
-            dom_1.innerHTML = sourceCode;
-            var theme_1 = this.registTheme() || this.props.editorTheme || 'vs';
-            setTimeout(function () {
-                _this.monaco.editor.colorizeElement(dom_1, {
-                    tabSize: _this.props.tabSize,
-                    theme: theme_1
-                });
-            }, 16);
-        }
+        var _a;
+        return tslib.__awaiter(this, void 0, void 0, function () {
+            var props, dom, tabSize, sourceCode, language, theme, colorizedHtml;
+            return tslib.__generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        props = this.props;
+                        dom = this.codeRef.current;
+                        if (!(((_a = this === null || this === void 0 ? void 0 : this.monaco) === null || _a === void 0 ? void 0 : _a.editor) && dom)) return [3 /*break*/, 2];
+                        tabSize = props.tabSize;
+                        sourceCode = amisCore.getPropValue(this.props);
+                        language = this.resolveLanguage();
+                        theme = this.registerAndGetTheme();
+                        /**
+                         * FIXME: https://github.com/microsoft/monaco-editor/issues/338
+                         * 已知问题：变量的样式存储在顶层，所以同页面中存在多个editor时，切换主题对所有editor生效
+                         * 每个组件单独实例化一个editor可以处理，但是成本较高，目前官方的处理方式是iframe嵌套隔离
+                         */
+                        this.monaco.editor.setTheme(theme);
+                        return [4 /*yield*/, this.monaco.editor.colorize(sourceCode, language, {
+                                tabSize: tabSize
+                            })];
+                    case 1:
+                        colorizedHtml = _b.sent();
+                        dom.innerHTML = colorizedHtml;
+                        _b.label = 2;
+                    case 2: return [2 /*return*/];
+                }
+            });
+        });
     };
     Code.prototype.handleMonaco = function (monaco) {
-        var _this = this;
-        this.monaco = monaco;
-        if (this.codeRef.current) {
-            var dom_2 = this.codeRef.current;
-            var theme_2 = this.registTheme() || this.props.editorTheme || 'vs';
-            // 这里必须是异步才能准确，可能是因为 monaco 里注册主题是异步的
-            setTimeout(function () {
-                monaco.editor.colorizeElement(dom_2, {
-                    tabSize: _this.props.tabSize,
-                    theme: theme_2
-                });
-            }, 16);
+        var _a;
+        return tslib.__awaiter(this, void 0, void 0, function () {
+            var tabSize, sourceCode, language, dom, theme, colorizedHtml;
+            return tslib.__generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!monaco) {
+                            return [2 /*return*/];
+                        }
+                        this.monaco = monaco;
+                        tabSize = this.props.tabSize;
+                        sourceCode = amisCore.getPropValue(this.props);
+                        language = this.resolveLanguage();
+                        dom = this.codeRef.current;
+                        if (!(dom && ((_a = this.monaco) === null || _a === void 0 ? void 0 : _a.editor))) return [3 /*break*/, 2];
+                        theme = this.registerAndGetTheme();
+                        // 这里必须是异步才能准确，可能是因为 monaco 里注册主题是异步的
+                        this.monaco.editor.setTheme(theme);
+                        return [4 /*yield*/, this.monaco.editor.colorize(sourceCode, language, {
+                                tabSize: tabSize
+                            })];
+                    case 1:
+                        colorizedHtml = _b.sent();
+                        dom.innerHTML = colorizedHtml;
+                        _b.label = 2;
+                    case 2: return [2 /*return*/];
+                }
+            });
+        });
+    };
+    Code.prototype.resolveLanguage = function (props) {
+        var currentProps = props !== null && props !== void 0 ? props : this.props;
+        var customLang = currentProps.customLang, data = currentProps.data;
+        var _a = currentProps.language, language = _a === void 0 ? 'plaintext' : _a;
+        if (amisCore.isPureVariable(language)) {
+            language = amisCore.resolveVariableAndFilter(language, data);
+        }
+        if (customLang) {
+            if (customLang.name) {
+                language = customLang.name;
+            }
         }
+        return language;
     };
-    Code.prototype.registTheme = function () {
+    /** 注册并返回当前主题名称，如果未自定义主题，则范围editorTheme值，默认为'vs' */
+    Code.prototype.registerAndGetTheme = function () {
+        var _a, _b;
         var monaco = this.monaco;
+        var _c = this.props.editorTheme, editorTheme = _c === void 0 ? 'vs' : _c;
         if (!monaco) {
-            return null;
+            return editorTheme;
         }
         if (this.customLang &&
             this.customLang.name &&
-            this.customLang.tokens &&
+            Array.isArray(this.customLang.tokens) &&
             this.customLang.tokens.length) {
             var langName = this.customLang.name;
+            var colors = ((_a = this.customLang) === null || _a === void 0 ? void 0 : _a.colors) && isPlainObject__default["default"]((_b = this.customLang) === null || _b === void 0 ? void 0 : _b.colors)
+                ? this.customLang.colors
+                : {};
             monaco.languages.register({ id: langName });
             var tokenizers = [];
             var rules = [];
-            for (var _i = 0, _a = this.customLang.tokens; _i < _a.length; _i++) {
-                var token = _a[_i];
+            for (var _i = 0, _d = this.customLang.tokens; _i < _d.length; _i++) {
+                var token = _d[_i];
                 var regex = new RegExp(token.regex, token.regexFlags || undefined);
                 tokenizers.push([regex, token.name]);
                 rules.push({
@@ -94,27 +149,36 @@ var Code = /** @class */ (function (_super) {
             monaco.editor.defineTheme(langName, {
                 base: 'vs',
                 inherit: false,
-                rules: rules
+                rules: rules,
+                colors: colors
             });
             return langName;
         }
-        return null;
+        return editorTheme;
     };
     Code.prototype.render = function () {
-        var _a = this.props, className = _a.className, cx = _a.classnames, data = _a.data, customLang = _a.customLang, wordWrap = _a.wordWrap;
-        var language = this.props.language;
         var sourceCode = amisCore.getPropValue(this.props);
-        if (amisCore.isPureVariable(language)) {
-            language = amisCore.resolveVariableAndFilter(language, data);
-        }
+        var _a = this.props, className = _a.className, cx = _a.classnames, editorTheme = _a.editorTheme, customLang = _a.customLang, wordWrap = _a.wordWrap, wrapperComponent = _a.wrapperComponent;
+        var language = this.resolveLanguage();
+        var isMultiLine = typeof sourceCode === 'string' && sourceCode.split(/\r?\n/).length > 1;
+        var Component = wrapperComponent || (isMultiLine ? 'pre' : 'code');
         if (customLang) {
-            if (customLang.name) {
-                language = customLang.name;
-            }
             this.customLang = customLang;
         }
-        return (React__default["default"].createElement("code", { ref: this.codeRef, className: cx("Code", { 'word-break': wordWrap }, className), "data-lang": language }, sourceCode));
+        return (React__default["default"].createElement(Component, { ref: this.codeRef, className: cx('Code', {
+                // 使用内置暗色主题时设置一下背景，避免看不清
+                'Code--dark': editorTheme && ['vs-dark', 'hc-black'].includes(editorTheme),
+                'Code-pre-wrap': Component === 'pre',
+                'word-break': wordWrap
+            }, className), "data-lang": language }, sourceCode));
     };
+    Code.propsList = [
+        'language',
+        'editorTheme',
+        'tabSize',
+        'wordWrap',
+        'customLang'
+    ];
     Code.defaultProps = {
         language: 'plaintext',
         editorTheme: 'vs',

package/lib/renderers/Collapse.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -24,9 +24,11 @@ var Collapse = /** @class */ (function (_super) {
     Collapse.prototype.render = function () {
         var _a = this.props, id = _a.id, ns = _a.classPrefix, cx = _a.classnames, size = _a.size, wrapperComponent = _a.wrapperComponent, headingComponent = _a.headingComponent, className = _a.className, headingClassName = _a.headingClassName, children = _a.children, titlePosition = _a.titlePosition, headerPosition = _a.headerPosition, title = _a.title, collapseTitle = _a.collapseTitle, collapseHeader = _a.collapseHeader, header = _a.header, body = _a.body, bodyClassName = _a.bodyClassName, render = _a.render, collapsable = _a.collapsable; _a.translate; var mountOnEnter = _a.mountOnEnter, unmountOnExit = _a.unmountOnExit, showArrow = _a.showArrow, expandIcon = _a.expandIcon, disabled = _a.disabled, collapsed = _a.collapsed, propsUpdate = _a.propsUpdate, onCollapse = _a.onCollapse;
         return (React__default["default"].createElement(amisUi.Collapse, { id: id, classnames: cx, classPrefix: ns, mountOnEnter: mountOnEnter, unmountOnExit: unmountOnExit, size: size, wrapperComponent: wrapperComponent, headingComponent: headingComponent, className: className, headingClassName: headingClassName, bodyClassName: bodyClassName, headerPosition: titlePosition || headerPosition, collapsable: collapsable, collapsed: collapsed, showArrow: showArrow, disabled: disabled, propsUpdate: propsUpdate, expandIcon: expandIcon
-                ? render('arrow-icon', expandIcon || '', {
-                    className: cx('Collapse-icon-tranform')
-                })
+                ? typeof expandIcon.icon === 'object'
+                    ? amisCore.generateIcon(cx, expandIcon.icon)
+                    : render('arrow-icon', expandIcon || '', {
+                        className: cx('Collapse-icon-tranform')
+                    })
                 : null, collapseHeader: collapseTitle || collapseHeader
                 ? render('heading', collapseTitle || collapseHeader)
                 : null, header: render('heading', title || header || ''), body: children

package/lib/renderers/CollapseGroup.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/lib/renderers/Color.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -25,7 +25,7 @@ var ColorField = /** @class */ (function (_super) {
         var color = amisCore.getPropValue(this.props);
         return (React__default["default"].createElement("div", { className: cx('ColorField', className) },
             React__default["default"].createElement("i", { className: cx('ColorField-previewIcon'), style: { backgroundColor: color || defaultColor } }),
-            showValue ? (React__default["default"].createElement("span", { className: cx('ColorField-value') }, color)) : null));
+            showValue ? (React__default["default"].createElement("span", { className: cx('ColorField-value') }, color || defaultColor)) : null));
     };
     ColorField.defaultProps = {
         className: '',

package/lib/renderers/Container.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/lib/renderers/Copyable.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/lib/renderers/Custom.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/lib/renderers/Date.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.3.2-beta.1
+ * amis v2.4.1-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/lib/renderers/DateRange.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+import { RendererProps } from 'amis-core';
+import { BaseSchema } from '../Schema';
+/**
+ * DateRange 展示渲染器。
+ */
+export interface DateRangeSchema extends BaseSchema {
+    /**
+     * 指定为日期展示类型
+     */
+    type: 'date-range';
+    /**
+     * 值的时间格式，参考 moment 中的格式说明。
+     */
+    valueFormat?: string;
+    /**
+     * 展示的时间格式，参考 moment 中的格式说明。
+     */
+    format?: string;
+    /**
+     * 分割符
+     */
+    delimiter?: string;
+    /**
+     * 连接符
+     */
+    connector?: string;
+}
+export interface DateRangeProps extends RendererProps, Omit<DateRangeSchema, 'type' | 'className'> {
+}
+export declare class DateRangeField extends React.Component<DateRangeProps, Object> {
+    refreshInterval: ReturnType<typeof setTimeout>;
+    static defaultProps: Pick<DateRangeProps, 'valueFormat' | 'format' | 'connector'>;
+    render(): JSX.Element | null;
+}
+export declare class DateRangeFieldRenderer extends DateRangeField {
+}

package/lib/renderers/DateRange.js

@@ -0,0 +1,66 @@
+/**
+ * amis v2.4.1-beta.0
+ * Copyright 2018-2022 baidu
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var amisCore = require('amis-core');
+var moment = require('moment');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
+
+var DateRangeField = /** @class */ (function (_super) {
+    tslib.__extends(DateRangeField, _super);
+    function DateRangeField() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    DateRangeField.prototype.render = function () {
+        var _a = this.props, _b = _a.delimiter, delimiter = _b === void 0 ? ',' : _b, _c = _a.connector, connector = _c === void 0 ? '~' : _c, value = _a.value, valueFormat = _a.valueFormat, _d = _a.format, format = _d === void 0 ? 'YYYY-MM-DD' : _d, cx = _a.classnames, className = _a.className;
+        if (!value) {
+            return null;
+        }
+        if (typeof value === 'string') {
+            value = value.split(delimiter);
+        }
+        var _e = value[0], startTime = _e === void 0 ? '' : _e, _f = value[1], endTime = _f === void 0 ? '' : _f;
+        if (valueFormat) {
+            startTime = moment__default["default"](startTime, valueFormat);
+            endTime = moment__default["default"](endTime, valueFormat);
+        }
+        else {
+            startTime = moment__default["default"](startTime * 1000);
+            endTime = moment__default["default"](endTime * 1000);
+        }
+        startTime = startTime.isValid() ? startTime.format(format) : '';
+        endTime = endTime.isValid() ? endTime.format(format) : '';
+        return (React__default["default"].createElement("span", { className: cx('DateRangeField', className) }, [startTime, endTime].join(" ".concat(connector, " "))));
+    };
+    DateRangeField.defaultProps = {
+        format: 'YYYY-MM-DD',
+        valueFormat: 'X',
+        connector: '~'
+    };
+    return DateRangeField;
+}(React__default["default"].Component));
+/** @class */ ((function (_super) {
+    tslib.__extends(DateRangeFieldRenderer, _super);
+    function DateRangeFieldRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    DateRangeFieldRenderer = tslib.__decorate([
+        amisCore.Renderer({
+            type: 'date-range'
+        })
+    ], DateRangeFieldRenderer);
+    return DateRangeFieldRenderer;
+})(DateRangeField));
+
+exports.DateRangeField = DateRangeField;