amis 2.0.0-rc.14 → 2.0.0-rc.15

package/esm/renderers/Chart.js

@@ -0,0 +1,352 @@
+/**
+ * amis v2.0.0-rc.15
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __awaiter, __generator, __decorate, __metadata } from 'tslib';
+import React from 'react';
+import { isPureVariable, resolveVariableAndFilter, isApiOutdated, filter, createObject, resizeSensor, isEffectiveApi, normalizeApiResponseData, dataMapping, LazyComponent, ScopedContext, Renderer, ServiceStore, findObjectsWithKey } from 'amis-core';
+import cx from 'classnames';
+import { isAlive } from 'mobx-state-tree';
+import debouce from 'lodash/debounce';
+
+var EVAL_CACHE = {};
+/**
+ * ECharts 中有些配置项可以写函数，但 JSON 中无法支持，为了实现这个功能，需要将看起来像函数的字符串转成函数类型
+ * 目前 ECharts 中可能有函数的配置项有如下：interval、formatter、color、min、max、labelFormatter、pageFormatter、optionToContent、contentToOption、animationDelay、animationDurationUpdate、animationDelayUpdate、animationDuration、position、sort
+ * @param config ECharts 配置
+ */
+function recoverFunctionType(config) {
+    [
+        'interval',
+        'formatter',
+        'color',
+        'min',
+        'max',
+        'labelFormatter',
+        'pageFormatter',
+        'optionToContent',
+        'contentToOption',
+        'animationDelay',
+        'animationDurationUpdate',
+        'animationDelayUpdate',
+        'animationDuration',
+        'position',
+        'sort',
+        'renderItem'
+    ].forEach(function (key) {
+        var objects = findObjectsWithKey(config, key);
+        for (var _i = 0, objects_1 = objects; _i < objects_1.length; _i++) {
+            var object = objects_1[_i];
+            var code = object[key];
+            if (typeof code === 'string' && code.trim().startsWith('function')) {
+                try {
+                    if (!(code in EVAL_CACHE)) {
+                        EVAL_CACHE[code] = eval('(' + code + ')');
+                    }
+                    object[key] = EVAL_CACHE[code];
+                }
+                catch (e) {
+                    console.warn(code, e);
+                }
+            }
+        }
+    });
+}
+var Chart = /** @class */ (function (_super) {
+    __extends(Chart, _super);
+    function Chart(props) {
+        var _this = _super.call(this, props) || this;
+        _this.refFn = _this.refFn.bind(_this);
+        _this.reload = _this.reload.bind(_this);
+        _this.reloadEcharts = debouce(_this.reloadEcharts.bind(_this), 300); //过于频繁更新 ECharts 会报错
+        _this.handleClick = _this.handleClick.bind(_this);
+        _this.mounted = true;
+        props.config && _this.renderChart(props.config);
+        return _this;
+    }
+    Chart.prototype.componentDidMount = function () {
+        var _a = this.props, api = _a.api, data = _a.data, initFetch = _a.initFetch, source = _a.source;
+        if (source && isPureVariable(source)) {
+            var ret = resolveVariableAndFilter(source, data, '| raw');
+            ret && this.renderChart(ret);
+        }
+        else if (api && initFetch !== false) {
+            this.reload();
+        }
+    };
+    Chart.prototype.componentDidUpdate = function (prevProps) {
+        var props = this.props;
+        if (isApiOutdated(prevProps.api, props.api, prevProps.data, props.data)) {
+            this.reload();
+        }
+        else if (props.source && isPureVariable(props.source)) {
+            var prevRet = prevProps.source
+                ? resolveVariableAndFilter(prevProps.source, prevProps.data, '| raw')
+                : null;
+            var ret = resolveVariableAndFilter(props.source, props.data, '| raw');
+            if (prevRet !== ret) {
+                this.renderChart(ret || {});
+            }
+        }
+        else if (props.config !== prevProps.config) {
+            this.renderChart(props.config || {});
+        }
+        else if (props.config &&
+            props.trackExpression &&
+            filter(props.trackExpression, props.data) !==
+                filter(prevProps.trackExpression, prevProps.data)) {
+            this.renderChart(props.config || {});
+        }
+    };
+    Chart.prototype.componentWillUnmount = function () {
+        this.mounted = false;
+        this.reloadEcharts.cancel();
+        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, createObject(data, ctx));
+    };
+    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 onChartMount = this.props.onChartMount;
+        if (ref) {
+            Promise.all([
+                import('echarts'),
+                import('echarts-stat'),
+                // @ts-ignore 官方没提供 type
+                import('echarts/extension/dataTool'),
+                // @ts-ignore 官方没提供 type
+                import('echarts/extension/bmap/bmap')
+            ]).then(function (_a) {
+                var echarts = _a[0], ecStat = _a[1];
+                return __awaiter(_this, void 0, void 0, function () {
+                    var theme;
+                    var _this = this;
+                    return __generator(this, function (_b) {
+                        switch (_b.label) {
+                            case 0:
+                                window.echarts = echarts;
+                                window.ecStat = ecStat;
+                                theme = 'default';
+                                if (chartTheme) {
+                                    echarts.registerTheme('custom', chartTheme);
+                                    theme = 'custom';
+                                }
+                                if (!onChartWillMount) return [3 /*break*/, 2];
+                                return [4 /*yield*/, onChartWillMount(echarts)];
+                            case 1:
+                                _b.sent();
+                                _b.label = 2;
+                            case 2:
+                                echarts.registerTransform(ecStat.transform.regression);
+                                echarts.registerTransform(ecStat.transform.histogram);
+                                echarts.registerTransform(ecStat.transform.clustering);
+                                if (!env.loadChartExtends) return [3 /*break*/, 4];
+                                return [4 /*yield*/, env.loadChartExtends()];
+                            case 3:
+                                _b.sent();
+                                _b.label = 4;
+                            case 4:
+                                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.unSensor = resizeSensor(ref, function () {
+                                    var _a;
+                                    var width = ref.offsetWidth;
+                                    var height = ref.offsetHeight;
+                                    (_a = _this.echarts) === null || _a === void 0 ? void 0 : _a.resize({
+                                        width: width,
+                                        height: height
+                                    });
+                                });
+                                chartRef && chartRef(this.echarts);
+                                this.renderChart();
+                                return [2 /*return*/];
+                        }
+                    });
+                });
+            });
+        }
+        else {
+            chartRef && chartRef(null);
+            this.unSensor && this.unSensor();
+            if (this.echarts) {
+                onChartUnMount === null || onChartUnMount === void 0 ? void 0 : onChartUnMount(this.echarts, window.echarts);
+                this.echarts.dispose();
+                delete this.echarts;
+            }
+        }
+        this.ref = ref;
+    };
+    Chart.prototype.reload = function (subpath, query) {
+        var _this = this;
+        var _a, _b;
+        var _c = this.props, api = _c.api, env = _c.env, store = _c.store, interval = _c.interval, __ = _c.translate;
+        if (query) {
+            return this.receive(query);
+        }
+        else if (!env || !env.fetcher || !isEffectiveApi(api, store.data)) {
+            return;
+        }
+        clearTimeout(this.timer);
+        if (this.reloadCancel) {
+            this.reloadCancel();
+            delete this.reloadCancel;
+            (_a = this.echarts) === null || _a === void 0 ? void 0 : _a.hideLoading();
+        }
+        (_b = this.echarts) === null || _b === void 0 ? void 0 : _b.showLoading();
+        store.markFetching(true);
+        env
+            .fetcher(api, store.data, {
+            cancelExecutor: function (executor) { return (_this.reloadCancel = executor); }
+        })
+            .then(function (result) {
+            var _a;
+            isAlive(store) && store.markFetching(false);
+            if (!result.ok) {
+                return env.notify('error', result.msg || __('fetchFailed'), result.msgTimeout !== undefined
+                    ? {
+                        closeButton: true,
+                        timeout: result.msgTimeout
+                    }
+                    : undefined);
+            }
+            delete _this.reloadCancel;
+            var data = normalizeApiResponseData(result.data);
+            // 说明返回的是数据接口。
+            if (!data.series && _this.props.config) {
+                var ctx = createObject(_this.props.data, data);
+                _this.renderChart(_this.props.config, ctx);
+            }
+            else {
+                _this.renderChart(result.data || {});
+            }
+            (_a = _this.echarts) === null || _a === void 0 ? void 0 : _a.hideLoading();
+            interval &&
+                _this.mounted &&
+                (_this.timer = setTimeout(_this.reload, Math.max(interval, 1000)));
+        })
+            .catch(function (reason) {
+            var _a;
+            if (env.isCancel(reason)) {
+                return;
+            }
+            isAlive(store) && store.markFetching(false);
+            env.notify('error', reason);
+            (_a = _this.echarts) === null || _a === void 0 ? void 0 : _a.hideLoading();
+        });
+    };
+    Chart.prototype.receive = function (data) {
+        var store = this.props.store;
+        store.updateData(data);
+        this.reload();
+    };
+    Chart.prototype.renderChart = function (config, data) {
+        var _a, _b;
+        config && (this.pending = config);
+        data && (this.pendingCtx = data);
+        if (!this.echarts) {
+            return;
+        }
+        var store = this.props.store;
+        var onDataFilter = this.props.onDataFilter;
+        var dataFilter = this.props.dataFilter;
+        if (!onDataFilter && typeof dataFilter === 'string') {
+            onDataFilter = new Function('config', 'echarts', 'data', dataFilter);
+        }
+        config = config || this.pending;
+        data = data || this.pendingCtx || this.props.data;
+        if (typeof config === 'string') {
+            config = new Function('return ' + config)();
+        }
+        try {
+            onDataFilter &&
+                (config =
+                    onDataFilter(config, window.echarts, data) || config);
+        }
+        catch (e) {
+            console.warn(e);
+        }
+        if (config) {
+            try {
+                if (!this.props.disableDataMapping) {
+                    config = dataMapping(config, data, function (key, value) {
+                        return typeof value === 'function' ||
+                            (typeof value === 'string' && value.startsWith('function'));
+                    });
+                }
+                recoverFunctionType(config);
+                if (isAlive(store) && store.loading) {
+                    (_a = this.echarts) === null || _a === void 0 ? void 0 : _a.showLoading();
+                }
+                else {
+                    (_b = this.echarts) === null || _b === void 0 ? void 0 : _b.hideLoading();
+                }
+                this.reloadEcharts(config);
+            }
+            catch (e) {
+                console.warn(e);
+            }
+        }
+    };
+    Chart.prototype.reloadEcharts = function (config) {
+        var _a;
+        (_a = this.echarts) === null || _a === void 0 ? void 0 : _a.setOption(config, this.props.replaceChartOption);
+    };
+    Chart.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, className = _a.className, width = _a.width, height = _a.height, ns = _a.classPrefix, unMountOnHidden = _a.unMountOnHidden;
+        var style = this.props.style || {};
+        width && (style.width = width);
+        height && (style.height = height);
+        return (React.createElement("div", { className: cx("".concat(ns, "Chart"), className), style: style },
+            React.createElement(LazyComponent, { unMountOnHidden: unMountOnHidden, placeholder: "..." // 之前那个 spinner 会导致 sensor 失效
+                , component: function () { return (React.createElement("div", { className: "".concat(ns, "Chart-content"), ref: _this.refFn })); } })));
+    };
+    Chart.defaultProps = {
+        replaceChartOption: false,
+        unMountOnHidden: false
+    };
+    Chart.propsList = [];
+    return Chart;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(ChartRenderer, _super);
+    function ChartRenderer(props, context) {
+        var _this = _super.call(this, props) || this;
+        var scoped = context;
+        scoped.registerComponent(_this);
+        return _this;
+    }
+    ChartRenderer.prototype.componentWillUnmount = function () {
+        _super.prototype.componentWillUnmount.call(this);
+        var scoped = this.context;
+        scoped.unRegisterComponent(this);
+    };
+    ChartRenderer.prototype.setData = function (values) {
+        var store = this.props.store;
+        store.updateData(values);
+        // 重新渲染
+        this.renderChart(this.props.config, values);
+    };
+    ChartRenderer.contextType = ScopedContext;
+    ChartRenderer = __decorate([
+        Renderer({
+            type: 'chart',
+            storeType: ServiceStore.name
+        }),
+        __metadata("design:paramtypes", [Object, Object])
+    ], ChartRenderer);
+    return ChartRenderer;
+})(Chart));
+
+export { Chart };

package/esm/renderers/Code.d.ts

@@ -0,0 +1,84 @@
+/**
+ * @file 代码高亮
+ */
+import React from 'react';
+import { BaseSchema } from '../Schema';
+import { RendererProps } from 'amis-core';
+export interface Token {
+    /**
+     * token 的正则
+     */
+    regex: string;
+    /**
+     * 正则的 flag
+     */
+    regexFlags?: string;
+    /**
+     * token 名称
+     */
+    name: string;
+    /**
+     * 文字颜色
+     */
+    color?: string;
+    /**
+     * 背景色，不过不知道为何没效果
+     */
+    background?: string;
+    /**
+     * 文字样式
+     */
+    fontStyle?: string;
+}
+export interface CustomLang {
+    /**
+     * 语言名字
+     */
+    name: string;
+    /**
+     * token
+     */
+    tokens: Token[];
+}
+/**
+ * 代码高亮组件
+ * 文档：https://baidu.gitee.io/amis/docs/components/code
+ */
+export interface CodeSchema extends BaseSchema {
+    type: 'code';
+    /**
+     * 语言类型
+     */
+    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;
+    /**
+     * tab 大小
+     */
+    tabSize?: number;
+    /**
+     * 是否折行
+     */
+    wordWrap?: boolean;
+    /**
+     * 自定义语言
+     */
+    customLang?: CustomLang;
+}
+export interface CodeProps extends RendererProps, Omit<CodeSchema, 'type' | 'className'> {
+}
+export default class Code extends React.Component<CodeProps> {
+    static defaultProps: Partial<CodeProps>;
+    monaco: any;
+    toDispose: Array<Function>;
+    codeRef: React.RefObject<HTMLElement>;
+    customLang: CustomLang;
+    sourceCode: string;
+    constructor(props: CodeProps);
+    componentDidMount(): void;
+    componentDidUpdate(preProps: CodeProps): void;
+    handleMonaco(monaco: any): void;
+    registTheme(): string | null;
+    render(): JSX.Element;
+}
+export declare class CodeRenderer extends Code {
+}

package/esm/renderers/Code.js

@@ -0,0 +1,130 @@
+/**
+ * amis v2.0.0-rc.15
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __decorate } from 'tslib';
+import React from 'react';
+import isEqual from 'lodash/isEqual';
+import { getPropValue, isPureVariable, resolveVariableAndFilter, Renderer } from 'amis-core';
+
+var Code = /** @class */ (function (_super) {
+    __extends(Code, _super);
+    function Code(props) {
+        var _this = _super.call(this, props) || this;
+        _this.toDispose = [];
+        _this.codeRef = React.createRef();
+        return _this;
+    }
+    Code.prototype.componentDidMount = function () {
+        var _this = this;
+        import('monaco-editor').then(function (monaco) { return _this.handleMonaco(monaco); });
+    };
+    Code.prototype.componentDidUpdate = function (preProps) {
+        var _this = this;
+        var props = this.props;
+        var sourceCode = getPropValue(this.props);
+        var preSourceCode = getPropValue(this.props);
+        if (sourceCode !== preSourceCode ||
+            (props.customLang && !isEqual(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);
+        }
+    };
+    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);
+        }
+    };
+    Code.prototype.registTheme = function () {
+        var monaco = this.monaco;
+        if (!monaco) {
+            return null;
+        }
+        if (this.customLang &&
+            this.customLang.name &&
+            this.customLang.tokens &&
+            this.customLang.tokens.length) {
+            var langName = this.customLang.name;
+            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];
+                var regex = new RegExp(token.regex, token.regexFlags || undefined);
+                tokenizers.push([regex, token.name]);
+                rules.push({
+                    token: token.name,
+                    foreground: token.color,
+                    background: token.background,
+                    fontStyle: token.fontStyle
+                });
+            }
+            monaco.languages.setMonarchTokensProvider(langName, {
+                tokenizer: {
+                    root: tokenizers
+                }
+            });
+            monaco.editor.defineTheme(langName, {
+                base: 'vs',
+                inherit: false,
+                rules: rules
+            });
+            return langName;
+        }
+        return null;
+    };
+    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 = getPropValue(this.props);
+        if (isPureVariable(language)) {
+            language = resolveVariableAndFilter(language, data);
+        }
+        if (customLang) {
+            if (customLang.name) {
+                language = customLang.name;
+            }
+            this.customLang = customLang;
+        }
+        return (React.createElement("code", { ref: this.codeRef, className: cx("Code", { 'word-break': wordWrap }, className), "data-lang": language }, sourceCode));
+    };
+    Code.defaultProps = {
+        language: 'plaintext',
+        editorTheme: 'vs',
+        tabSize: 4,
+        wordWrap: true
+    };
+    return Code;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(CodeRenderer, _super);
+    function CodeRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    CodeRenderer = __decorate([
+        Renderer({
+            type: 'code'
+        })
+    ], CodeRenderer);
+    return CodeRenderer;
+})(Code));
+
+export { Code as default };

package/esm/renderers/Collapse.d.ts

@@ -0,0 +1,83 @@
+import React from 'react';
+import { RendererProps } from 'amis-core';
+import { BaseSchema, SchemaCollection, SchemaTpl, SchemaObject } from '../Schema';
+/**
+ * Collapse 折叠渲染器，格式说明。
+ * 文档：https://baidu.gitee.io/amis/docs/components/collapse
+ */
+export interface CollapseSchema extends BaseSchema {
+    /**
+     * 指定为折叠器类型
+     */
+    type: 'collapse';
+    /**
+     * 标识
+     */
+    key?: string;
+    /**
+     * 标题展示位置
+     */
+    headerPosition?: 'top' | 'bottom';
+    /**
+     * 标题
+     */
+    header?: string | SchemaCollection;
+    /**
+     * 内容区域
+     */
+    body: SchemaCollection;
+    /**
+     * 配置 Body 容器 className
+     */
+    bodyClassName?: string;
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 是否可折叠
+     */
+    collapsable?: boolean;
+    /**
+     * 默认是否折叠
+     */
+    collapsed?: boolean;
+    /**
+     * 图标是否展示
+     */
+    showArrow?: boolean;
+    /**
+     * 自定义切换图标
+     */
+    expandIcon?: SchemaObject;
+    /**
+     * 标题 CSS 类名
+     */
+    headingClassName?: string;
+    /**
+     * 收起的标题
+     */
+    collapseHeader?: SchemaTpl;
+    /**
+     * 控件大小
+     */
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'base';
+    /**
+     * 点开时才加载内容
+     */
+    mountOnEnter?: boolean;
+    /**
+     * 卡片隐藏就销毁内容。
+     */
+    unmountOnExit?: boolean;
+}
+export interface CollapseProps extends RendererProps, Omit<CollapseSchema, 'type' | 'className'> {
+    wrapperComponent?: any;
+    headingComponent?: any;
+    children?: JSX.Element | ((props?: any) => JSX.Element);
+}
+export default class Collapse extends React.Component<CollapseProps, {}> {
+    render(): JSX.Element;
+}
+export declare class CollapseRenderer extends Collapse {
+}

package/esm/renderers/Collapse.js

@@ -0,0 +1,47 @@
+/**
+ * amis v2.0.0-rc.15
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __decorate } from 'tslib';
+import React from 'react';
+import { Renderer } from 'amis-core';
+import { Collapse as Collapse$1 } from 'amis-ui';
+
+var Collapse = /** @class */ (function (_super) {
+    __extends(Collapse, _super);
+    function Collapse() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    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.createElement(Collapse$1, { 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')
+                })
+                : null, collapseHeader: collapseTitle || collapseHeader
+                ? render('heading', collapseTitle || collapseHeader)
+                : null, header: render('heading', title || header || ''), body: children
+                ? typeof children === 'function'
+                    ? children(this.props)
+                    : children
+                : body
+                    ? render('body', body)
+                    : null, onCollapse: onCollapse }));
+    };
+    return Collapse;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(CollapseRenderer, _super);
+    function CollapseRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    CollapseRenderer = __decorate([
+        Renderer({
+            type: 'collapse'
+        })
+    ], CollapseRenderer);
+    return CollapseRenderer;
+})(Collapse));
+
+export { Collapse as default };