amis 2.0.0-rc.9 → 2.0.0

package/esm/renderers/Property.js

@@ -0,0 +1,95 @@
+/**
+ * amis v2.0.0
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __decorate } from 'tslib';
+import React from 'react';
+import { resolveVariableAndFilter, visibilityFilter, buildStyle, Renderer } from 'amis-core';
+
+/**
+ * @file 表格的方式显示只读信息，比如产品详情
+ */
+var Property = /** @class */ (function (_super) {
+    __extends(Property, _super);
+    function Property(props) {
+        return _super.call(this, props) || this;
+    }
+    /**
+     * 算好每行的分布情况，方便后续渲染
+     */
+    Property.prototype.prepareRows = function () {
+        var _a = this.props, _b = _a.column, column = _b === void 0 ? 3 : _b, items = _a.items, source = _a.source, data = _a.data;
+        var propertyItems = (items
+            ? items
+            : resolveVariableAndFilter(source, data, '| raw')) || [];
+        var rows = [];
+        var row = [];
+        var columnLeft = column;
+        var index = 0;
+        var filteredItems = visibilityFilter(propertyItems, data);
+        for (var _i = 0, filteredItems_1 = filteredItems; _i < filteredItems_1.length; _i++) {
+            var item = filteredItems_1[_i];
+            index = index + 1;
+            var span = Math.min(item.span || 1, column);
+            columnLeft = columnLeft - span;
+            var rowItem = {
+                label: item.label,
+                content: item.content,
+                span: span
+            };
+            // 如果还能放得下就放这一行
+            if (columnLeft >= 0) {
+                row.push(rowItem);
+            }
+            else {
+                rows.push(row);
+                columnLeft = column - span;
+                row = [rowItem];
+            }
+            // 最后一行将最后的数据 push
+            if (index === filteredItems.length) {
+                rows.push(row);
+            }
+        }
+        return rows;
+    };
+    Property.prototype.renderRow = function (rows) {
+        var _a = this.props, render = _a.render, contentStyle = _a.contentStyle, labelStyle = _a.labelStyle, _b = _a.separator, separator = _b === void 0 ? ': ' : _b, _c = _a.mode, mode = _c === void 0 ? 'table' : _c, data = _a.data;
+        return rows.map(function (row, key) {
+            return (React.createElement("tr", { key: key }, row.map(function (property, index) {
+                return mode === 'table' ? (React.createElement(React.Fragment, { key: "item-".concat(index) },
+                    React.createElement("th", { style: buildStyle(labelStyle, data) }, render('label', property.label)),
+                    React.createElement("td", { colSpan: property.span + property.span - 1, style: buildStyle(contentStyle, data) }, render('content', property.content)))) : (React.createElement("td", { colSpan: property.span, style: buildStyle(contentStyle, data), key: "item-".concat(index) },
+                    React.createElement("span", { style: buildStyle(labelStyle, data) }, render('label', property.label)),
+                    separator,
+                    render('content', property.content)));
+            })));
+        });
+    };
+    Property.prototype.render = function () {
+        var _a = this.props, style = _a.style, title = _a.title, _b = _a.column, column = _b === void 0 ? 3 : _b, cx = _a.classnames, className = _a.className, titleStyle = _a.titleStyle, data = _a.data, _c = _a.mode, mode = _c === void 0 ? 'table' : _c;
+        var rows = this.prepareRows();
+        return (React.createElement("div", { className: cx('Property', "Property--".concat(mode), className), style: buildStyle(style, data) },
+            React.createElement("table", null,
+                title ? (React.createElement("thead", null,
+                    React.createElement("tr", null,
+                        React.createElement("th", { colSpan: mode === 'table' ? column + column : column, style: buildStyle(titleStyle, data) }, title)))) : null,
+                React.createElement("tbody", null, this.renderRow(rows)))));
+    };
+    return Property;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(PropertyRenderer, _super);
+    function PropertyRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    PropertyRenderer = __decorate([
+        Renderer({
+            type: 'property'
+        })
+    ], PropertyRenderer);
+    return PropertyRenderer;
+})(Property));
+
+export { Property as default };

package/esm/renderers/QRCode.d.ts

@@ -0,0 +1,63 @@
+import React from 'react';
+import { FormControlProps } from 'amis-core';
+import { BaseSchema, SchemaClassName } from '../Schema';
+export interface QRCodeImageSettings {
+    src: string;
+    height: number;
+    width: number;
+    excavate: boolean;
+    x?: number;
+    y?: number;
+}
+/**
+ * 二维码展示控件。
+ * 文档：https://baidu.gitee.io/amis/docs/components/qrcode
+ */
+export interface QRCodeSchema extends BaseSchema {
+    type: 'qrcode' | 'qr-code';
+    /**
+     * 关联字段名。
+     */
+    name?: string;
+    /**
+     * css 类名
+     */
+    qrcodeClassName?: SchemaClassName;
+    /**
+     * 二维码的宽高大小，默认 128
+     * @default 128
+     */
+    codeSize?: number;
+    /**
+     * 背景色
+     */
+    backgroundColor?: string;
+    /**
+     * 前景色
+     */
+    foregroundColor?: string;
+    /**
+     * 二维码复杂级别
+     */
+    level?: 'L' | 'M' | 'Q' | 'H';
+    /**
+     * 占位符
+     */
+    placeholder?: string;
+    /**
+     * 图片配置
+     */
+    imageSettings?: QRCodeImageSettings;
+}
+export interface QRCodeProps extends FormControlProps, Omit<QRCodeSchema, 'type' | 'className'> {
+}
+export default class QRCode extends React.Component<QRCodeProps, any> {
+    static defaultProps: Partial<QRCodeProps>;
+    /**
+     * 获取图片配置
+     */
+    getImageSettings(): QRCodeImageSettings | undefined;
+    render(): JSX.Element;
+}
+export declare class QRCodeRenderer extends QRCode {
+}

package/esm/renderers/QRCode.js

@@ -0,0 +1,75 @@
+/**
+ * amis v2.0.0
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __decorate } from 'tslib';
+import React from 'react';
+import cx from 'classnames';
+import { isObject, isPureVariable, resolveVariableAndFilter, isNumeric, getPropValue, filter, Renderer } from 'amis-core';
+import { QRCodeSVG } from 'qrcode.react';
+import mapValues from 'lodash/mapValues';
+
+var QRCode = /** @class */ (function (_super) {
+    __extends(QRCode, _super);
+    function QRCode() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    /**
+     * 获取图片配置
+     */
+    QRCode.prototype.getImageSettings = function () {
+        var _a = this.props, imageSettings = _a.imageSettings, data = _a.data;
+        if (!imageSettings ||
+            !isObject(imageSettings) ||
+            !imageSettings.src ||
+            typeof imageSettings.src !== 'string') {
+            return undefined;
+        }
+        if (isPureVariable(imageSettings.src)) {
+            imageSettings.src = resolveVariableAndFilter(imageSettings.src, data, '| raw');
+        }
+        return mapValues(imageSettings, function (value, key) {
+            if (!!~['width', 'height', 'x', 'y'].indexOf(key)) {
+                /** 处理非数字格式的输入，QRCodeSVG内部会对空值进行默认赋值 */
+                return isNumeric(value) ? Number(value) : null;
+            }
+            return value;
+        });
+    };
+    QRCode.prototype.render = function () {
+        var _a = this.props, className = _a.className, qrcodeClassName = _a.qrcodeClassName, codeSize = _a.codeSize, backgroundColor = _a.backgroundColor, foregroundColor = _a.foregroundColor, placeholder = _a.placeholder, level = _a.level, defaultValue = _a.defaultValue, data = _a.data, ns = _a.classPrefix;
+        var finalValue = getPropValue(this.props, function () { return filter(defaultValue, data, '| raw') || undefined; });
+        return (React.createElement("div", { className: cx("".concat(ns, "QrCode"), className) }, !finalValue ? (React.createElement("span", { className: "".concat(ns, "QrCode--placeholder") }, placeholder)) : finalValue.length > 2953 ? (
+        // https://github.com/zpao/qrcode.react/issues/69
+        React.createElement("span", { className: "text-danger" }, "\u4E8C\u7EF4\u7801\u503C\u8FC7\u957F\uFF0C\u8BF7\u8BBE\u7F6E2953\u4E2A\u5B57\u7B26\u4EE5\u4E0B\u7684\u6587\u672C")) : (React.createElement(QRCodeSVG
+        // @ts-ignore 其实是支持的
+        , { 
+            // @ts-ignore 其实是支持的
+            className: qrcodeClassName, value: finalValue, size: codeSize, bgColor: backgroundColor, fgColor: foregroundColor, level: level || 'L', imageSettings: this.getImageSettings() }))));
+    };
+    QRCode.defaultProps = {
+        codeSize: 128,
+        qrcodeClassName: '',
+        backgroundColor: '#fff',
+        foregroundColor: '#000',
+        level: 'L',
+        placeholder: '-'
+    };
+    return QRCode;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(QRCodeRenderer, _super);
+    function QRCodeRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    QRCodeRenderer = __decorate([
+        Renderer({
+            test: /(^|\/)qr\-?code$/,
+            name: 'qrcode'
+        })
+    ], QRCodeRenderer);
+    return QRCodeRenderer;
+})(QRCode));
+
+export { QRCode as default };

package/esm/renderers/QuickEdit.d.ts

@@ -0,0 +1,65 @@
+/**
+ * @file scoped.jsx.
+ * @author fex
+ */
+import React from 'react';
+import { RendererProps } from 'amis-core';
+import { SchemaCollection, SchemaObject } from '../Schema';
+export declare type SchemaQuickEditObject = 
+/**
+ * 直接就是个表单项
+ */
+({
+    /**
+     * 是否立即保存
+     */
+    saveImmediately?: boolean;
+    /**
+     * 接口保存失败后，是否重置组件编辑状态
+     */
+    resetOnFailed?: boolean;
+    /**
+     * 是否直接内嵌
+     */
+    mode?: 'inline';
+} & SchemaObject)
+/**
+ * 表单项集合
+ */
+ | {
+    /**
+     * 是否立即保存
+     */
+    saveImmediately?: boolean;
+    /**
+     * 接口保存失败后，是否重置组件编辑状态
+     */
+    resetOnFailed?: boolean;
+    /**
+     * 是否直接内嵌
+     */
+    mode?: 'inline';
+    body: SchemaCollection;
+};
+export declare type SchemaQuickEdit = boolean | SchemaQuickEditObject;
+export interface QuickEditConfig {
+    saveImmediately?: boolean;
+    resetOnFailed?: boolean;
+    mode?: 'inline' | 'dialog' | 'popOver' | 'append';
+    type?: string;
+    body?: any;
+    focusable?: boolean;
+    popOverClassName?: string;
+    [propName: string]: any;
+}
+export interface QuickEditProps extends RendererProps {
+    name?: string;
+    label?: string;
+    quickEdit: boolean | QuickEditConfig;
+    quickEditEnabled?: boolean;
+}
+export interface QuickEditState {
+    isOpened: boolean;
+}
+export declare const HocQuickEdit: (config?: Partial<QuickEditConfig>) => (Component: React.ComponentType<any>) => any;
+export default HocQuickEdit;

package/esm/renderers/QuickEdit.js

@@ -0,0 +1,337 @@
+/**
+ * amis v2.0.0
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __assign } from 'tslib';
+import React from 'react';
+import { findDOMNode } from 'react-dom';
+import hoistNonReactStatic from 'hoist-non-react-statics';
+import keycode from 'keycode';
+import { Overlay, PopOver } from 'amis-core';
+import { Icon } from 'amis-ui';
+
+/**
+ * @file scoped.jsx.
+ * @author fex
+ */
+var inited = false;
+var currentOpened;
+var HocQuickEdit = function (config) {
+    return function (Component) {
+        var QuickEditComponent = /** @class */ (function (_super) {
+            __extends(QuickEditComponent, _super);
+            function QuickEditComponent(props) {
+                var _this = _super.call(this, props) || this;
+                _this.openQuickEdit = _this.openQuickEdit.bind(_this);
+                _this.closeQuickEdit = _this.closeQuickEdit.bind(_this);
+                _this.handleAction = _this.handleAction.bind(_this);
+                _this.handleSubmit = _this.handleSubmit.bind(_this);
+                _this.handleKeyUp = _this.handleKeyUp.bind(_this);
+                _this.overlayRef = _this.overlayRef.bind(_this);
+                _this.handleWindowKeyPress = _this.handleWindowKeyPress.bind(_this);
+                _this.handleWindowKeyDown = _this.handleWindowKeyDown.bind(_this);
+                _this.formRef = _this.formRef.bind(_this);
+                _this.handleInit = _this.handleInit.bind(_this);
+                _this.handleChange = _this.handleChange.bind(_this);
+                _this.state = {
+                    isOpened: false
+                };
+                return _this;
+            }
+            QuickEditComponent.prototype.componentDidMount = function () {
+                this.target = findDOMNode(this);
+                if (inited) {
+                    return;
+                }
+                inited = true;
+                document.body.addEventListener('keypress', this.handleWindowKeyPress);
+                document.body.addEventListener('keydown', this.handleWindowKeyDown);
+            };
+            QuickEditComponent.prototype.formRef = function (ref) {
+                var _a = this.props, quickEditFormRef = _a.quickEditFormRef, rowIndex = _a.rowIndex, colIndex = _a.colIndex;
+                if (quickEditFormRef) {
+                    while (ref && ref.getWrappedInstance) {
+                        ref = ref.getWrappedInstance();
+                    }
+                    quickEditFormRef(ref, colIndex, rowIndex);
+                }
+            };
+            QuickEditComponent.prototype.handleWindowKeyPress = function (e) {
+                var ns = this.props.classPrefix;
+                var el = e.target.closest(".".concat(ns, "Field--quickEditable"));
+                if (!el) {
+                    return;
+                }
+                var table = el.closest('table');
+                if (!table) {
+                    return;
+                }
+                if (keycode(e) === 'space' &&
+                    !~['INPUT', 'TEXTAREA'].indexOf(el.tagName)) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                }
+            };
+            QuickEditComponent.prototype.handleWindowKeyDown = function (e) {
+                var code = keycode(e);
+                if (code === 'esc' && currentOpened) {
+                    currentOpened.closeQuickEdit();
+                }
+                else if (~['INPUT', 'TEXTAREA'].indexOf(e.target.tagName) ||
+                    e.target.contentEditable === 'true' ||
+                    !~['up', 'down', 'left', 'right'].indexOf(code)) {
+                    return;
+                }
+                e.preventDefault();
+                var ns = this.props.classPrefix;
+                var el = e.target.closest(".".concat(ns, "Field--quickEditable")) ||
+                    document.querySelector(".".concat(ns, "Field--quickEditable"));
+                if (!el) {
+                    return;
+                }
+                var table = el.closest('table');
+                if (!table) {
+                    return;
+                }
+                var current = table.querySelector(".".concat(ns, "Field--quickEditable:focus"));
+                if (!current) {
+                    var dom = table.querySelector(".".concat(ns, "Field--quickEditable[tabindex]"));
+                    dom && dom.focus();
+                }
+                else {
+                    var prevTr = void 0, nextTr = void 0, prevTd = void 0, nextTd = void 0;
+                    switch (code) {
+                        case 'up':
+                            prevTr = current.parentNode
+                                .previousSibling;
+                            if (prevTr) {
+                                var index = current.cellIndex;
+                                prevTr.children[index].focus();
+                            }
+                            break;
+                        case 'down':
+                            nextTr = current.parentNode
+                                .nextSibling;
+                            if (nextTr) {
+                                var index = current.cellIndex;
+                                nextTr.children[index].focus();
+                            }
+                            break;
+                        case 'left':
+                            prevTd = current.previousElementSibling;
+                            while (prevTd) {
+                                if (prevTd.matches(".".concat(ns, "Field--quickEditable[tabindex]"))) {
+                                    break;
+                                }
+                                prevTd = prevTd.previousElementSibling;
+                            }
+                            if (prevTd) {
+                                prevTd.focus();
+                            }
+                            else if (current.parentNode.previousSibling) {
+                                var tds = current.parentNode
+                                    .previousSibling.querySelectorAll(".".concat(ns, "Field--quickEditable[tabindex]"));
+                                if (tds.length) {
+                                    tds[tds.length - 1].focus();
+                                }
+                            }
+                            break;
+                        case 'right':
+                            nextTd = current.nextSibling;
+                            while (nextTd) {
+                                if (nextTd.matches(".".concat(ns, "Field--quickEditable[tabindex]"))) {
+                                    break;
+                                }
+                                nextTd = nextTd.nextSibling;
+                            }
+                            if (nextTd) {
+                                nextTd.focus();
+                            }
+                            else if (current.parentNode.nextSibling) {
+                                nextTd = current.parentNode.nextSibling.querySelector(".".concat(ns, "Field--quickEditable[tabindex]"));
+                                if (nextTd) {
+                                    nextTd.focus();
+                                }
+                            }
+                            break;
+                    }
+                }
+            };
+            // handleClickOutside() {
+            //     this.closeQuickEdit();
+            // }
+            QuickEditComponent.prototype.overlayRef = function (ref) {
+                this.overlay = ref;
+            };
+            QuickEditComponent.prototype.handleAction = function (e, action, ctx) {
+                var onAction = this.props.onAction;
+                if (action.actionType === 'cancel' || action.actionType === 'close') {
+                    this.closeQuickEdit();
+                    return;
+                }
+                onAction && onAction(e, action, ctx);
+            };
+            QuickEditComponent.prototype.handleSubmit = function (values) {
+                var _a = this.props, onQuickChange = _a.onQuickChange, quickEdit = _a.quickEdit;
+                this.closeQuickEdit();
+                onQuickChange(values, quickEdit.saveImmediately, false, quickEdit.resetOnFailed);
+                return false;
+            };
+            QuickEditComponent.prototype.handleInit = function (values) {
+                var onQuickChange = this.props.onQuickChange;
+                onQuickChange(values, false, true);
+            };
+            QuickEditComponent.prototype.handleChange = function (values) {
+                var _a = this.props, onQuickChange = _a.onQuickChange, quickEdit = _a.quickEdit;
+                onQuickChange(values, quickEdit.saveImmediately, false, quickEdit.resetOnFailed);
+            };
+            QuickEditComponent.prototype.openQuickEdit = function () {
+                currentOpened = this;
+                this.setState({
+                    isOpened: true
+                });
+            };
+            QuickEditComponent.prototype.closeQuickEdit = function () {
+                var _this = this;
+                if (!this.state.isOpened) {
+                    return;
+                }
+                currentOpened = null;
+                var ns = this.props.classPrefix;
+                this.setState({
+                    isOpened: false
+                }, function () {
+                    var el = findDOMNode(_this);
+                    var table = el.closest('table');
+                    ((table &&
+                        table.querySelectorAll("td.".concat(ns, "Field--quickEditable:focus"))
+                            .length) ||
+                        el) &&
+                        el.focus();
+                });
+            };
+            QuickEditComponent.prototype.buildSchema = function () {
+                var _a = this.props, quickEdit = _a.quickEdit, name = _a.name, label = _a.label, __ = _a.translate;
+                var schema;
+                if (quickEdit === true) {
+                    schema = {
+                        type: 'form',
+                        title: '',
+                        autoFocus: true,
+                        body: [
+                            {
+                                type: 'input-text',
+                                name: name,
+                                placeholder: label,
+                                label: false
+                            }
+                        ]
+                    };
+                }
+                else if (quickEdit) {
+                    if (quickEdit.body &&
+                        !~['combo', 'group', 'panel', 'fieldSet', 'fieldset'].indexOf(quickEdit.type)) {
+                        schema = __assign(__assign({ title: '', autoFocus: quickEdit.mode !== 'inline' }, quickEdit), { mode: 'normal', type: 'form' });
+                    }
+                    else {
+                        schema = {
+                            title: '',
+                            className: quickEdit.formClassName,
+                            type: 'form',
+                            autoFocus: quickEdit.mode !== 'inline',
+                            mode: 'normal',
+                            body: [
+                                __assign(__assign({ type: quickEdit.type || 'input-text', name: quickEdit.name || name }, quickEdit), { mode: undefined })
+                            ]
+                        };
+                    }
+                }
+                if (schema) {
+                    schema = __assign(__assign({}, schema), { wrapWithPanel: quickEdit.mode !== 'inline', actions: quickEdit.mode === 'inline'
+                            ? []
+                            : [
+                                {
+                                    type: 'button',
+                                    label: __('cancel'),
+                                    actionType: 'cancel'
+                                },
+                                {
+                                    label: __('confirm'),
+                                    type: 'submit',
+                                    primary: true
+                                }
+                            ] });
+                }
+                return schema || 'error';
+            };
+            QuickEditComponent.prototype.handleKeyUp = function (e) {
+                var code = keycode(e);
+                if (code === 'space' &&
+                    !~['INPUT', 'TEXTAREA'].indexOf(e.target.tagName)) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this.openQuickEdit();
+                }
+            };
+            QuickEditComponent.prototype.renderPopOver = function () {
+                var _this = this;
+                var _a = this.props, quickEdit = _a.quickEdit, render = _a.render, popOverContainer = _a.popOverContainer, ns = _a.classPrefix, cx = _a.classnames, canAccessSuperData = _a.canAccessSuperData;
+                var content = (React.createElement("div", { ref: this.overlayRef, className: cx(quickEdit.className) }, render('quick-edit-form', this.buildSchema(), {
+                    value: undefined,
+                    onSubmit: this.handleSubmit,
+                    onAction: this.handleAction,
+                    onChange: null,
+                    formLazyChange: false,
+                    ref: this.formRef,
+                    popOverContainer: function () { return _this.overlay; },
+                    canAccessSuperData: canAccessSuperData,
+                    formStore: undefined
+                })));
+                popOverContainer = popOverContainer || (function () { return findDOMNode(_this); });
+                return (React.createElement(Overlay, { container: popOverContainer, target: function () { return _this.target; }, onHide: this.closeQuickEdit, placement: "left-top right-top left-bottom right-bottom left-top", show: true },
+                    React.createElement(PopOver, { classPrefix: ns, className: cx("".concat(ns, "QuickEdit-popover"), quickEdit.popOverClassName), onHide: this.closeQuickEdit, overlay: true }, content)));
+            };
+            QuickEditComponent.prototype.render = function () {
+                var _a = this.props, onQuickChange = _a.onQuickChange, quickEdit = _a.quickEdit, quickEditEnabled = _a.quickEditEnabled, className = _a.className, cx = _a.classnames, render = _a.render, noHoc = _a.noHoc, canAccessSuperData = _a.canAccessSuperData, disabled = _a.disabled;
+                if (!quickEdit ||
+                    !onQuickChange ||
+                    quickEditEnabled === false ||
+                    noHoc ||
+                    disabled) {
+                    return React.createElement(Component, __assign({}, this.props));
+                }
+                if (quickEdit.mode === 'inline') {
+                    return (React.createElement(Component, __assign({}, this.props), render('inline-form', this.buildSchema(), {
+                        value: undefined,
+                        wrapperComponent: 'div',
+                        className: cx('Form--quickEdit'),
+                        ref: this.formRef,
+                        simpleMode: true,
+                        onInit: this.handleInit,
+                        onChange: this.handleChange,
+                        formLazyChange: false,
+                        canAccessSuperData: canAccessSuperData
+                    })));
+                }
+                else {
+                    return (React.createElement(Component, __assign({}, this.props, { className: cx("Field--quickEditable", className, {
+                            in: this.state.isOpened
+                        }), tabIndex: quickEdit.focusable === false
+                            ? undefined
+                            : '0', onKeyUp: this.handleKeyUp }),
+                        React.createElement(Component, __assign({}, this.props, { wrapperComponent: '', noHoc: true })),
+                        React.createElement("span", { key: "edit-btn", className: cx('Field-quickEditBtn'), onClick: this.openQuickEdit },
+                            React.createElement(Icon, { icon: "edit", className: "icon" })),
+                        this.state.isOpened ? this.renderPopOver() : null));
+                }
+            };
+            QuickEditComponent.ComposedComponent = Component;
+            return QuickEditComponent;
+        }(React.PureComponent));
+        hoistNonReactStatic(QuickEditComponent, Component);
+        return QuickEditComponent;
+    };
+};
+
+export { HocQuickEdit, HocQuickEdit as default };