amis-rev-ui 6.13.0

package/lib/components/PdfViewer.js

@@ -0,0 +1,83 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+'use strict';
+
+/**
+ * @file PdfViewer.tsx PDF 预览
+ *
+ * @created: 2024/02/26
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var amis_rev_core_1 = require("amis-rev-core");
+var react_pdf_1 = require("react-pdf");
+var icons_1 = require("./icons");
+var Input_1 = tslib_1.__importDefault(require("./Input"));
+var Spinner_1 = tslib_1.__importDefault(require("./Spinner"));
+react_pdf_1.pdfjs.GlobalWorkerOptions.workerSrc = (0, amis_rev_core_1.getGlobalOptions)().pdfjsWorkerSrc;
+var PdfViewer = function (props) {
+    var cx = props.classnames, className = props.className, loading = props.loading, _a = props.width, width = _a === void 0 ? 300 : _a;
+    var _b = tslib_1.__read(react_1.default.useState(props.file), 2), file = _b[0], setFile = _b[1];
+    var _c = tslib_1.__read(react_1.default.useState(false), 2), loaded = _c[0], setLoaded = _c[1];
+    var _d = tslib_1.__read(react_1.default.useState(1), 2), page = _d[0], setPage = _d[1];
+    var _e = tslib_1.__read(react_1.default.useState(1), 2), scale = _e[0], setScale = _e[1];
+    var _f = tslib_1.__read(react_1.default.useState(1), 2), total = _f[0], setTotal = _f[1];
+    var inputRef = react_1.default.useRef();
+    react_1.default.useEffect(function () {
+        if (props.file instanceof ArrayBuffer && props.file.byteLength > 0) {
+            setFile(props.file);
+        }
+        else {
+            setFile(undefined);
+        }
+    }, [props.file]);
+    function handleLoadSuccess(_a) {
+        var numPages = _a.numPages;
+        setLoaded(true);
+        setTotal(numPages);
+    }
+    function handleChangePage(idx) {
+        var newPage = page + idx;
+        if (newPage <= 0 || newPage > total) {
+            return;
+        }
+        setPage(newPage);
+    }
+    function handlePageBlur(event) {
+        var newPage = +event.target.value;
+        if (isNaN(newPage) || newPage <= 0 || newPage > total) {
+            if (inputRef.current) {
+                inputRef.current.value = page + '';
+            }
+            return;
+        }
+        setPage(newPage);
+    }
+    function handleChangeScale(t) {
+        setScale(scale * t);
+    }
+    function renderLoading() {
+        return (react_1.default.createElement("div", { className: cx('PdfViewer-Loading') },
+            react_1.default.createElement(Spinner_1.default, null)));
+    }
+    function renderTool() {
+        return (react_1.default.createElement("div", { className: cx('PdfViewer-Tool') },
+            react_1.default.createElement(icons_1.Icon, { className: "icon", icon: "prev", onClick: function () { return handleChangePage(-1); } }),
+            react_1.default.createElement(Input_1.default, { className: "page-input", value: page, onBlur: handlePageBlur, ref: inputRef }),
+            react_1.default.createElement("span", { className: "gap" }, "/"),
+            react_1.default.createElement("span", null, total),
+            react_1.default.createElement(icons_1.Icon, { className: "icon", icon: "next", onClick: function () { return handleChangePage(1); } }),
+            react_1.default.createElement(icons_1.Icon, { className: "icon", icon: "zoom-in", onClick: function () { return handleChangeScale(1.2); } }),
+            react_1.default.createElement(icons_1.Icon, { className: "icon", icon: "zoom-out", onClick: function () { return handleChangeScale(0.8); } })));
+    }
+    return (react_1.default.createElement("div", { className: cx(className, 'PdfViewer') }, !file || loading ? (renderLoading()) : (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: cx('PdfViewer-Content', { 'is-loaded': loaded }) },
+            react_1.default.createElement(react_pdf_1.Document, { file: file, onLoadSuccess: handleLoadSuccess, onLoadError: function (err) { return console.log(err); }, loading: renderLoading() },
+                react_1.default.createElement(react_pdf_1.Page, { className: cx('PdfViewer-Content-Page'), pageNumber: page, width: width, height: props.height, loading: renderLoading(), noData: react_1.default.createElement("div", null, "No PDF data"), scale: scale, renderTextLayer: false, renderAnnotationLayer: false }))),
+        loaded ? renderTool() : null))));
+};
+exports.default = (0, amis_rev_core_1.themeable)(PdfViewer);

package/lib/components/PopOverContainer.d.ts

@@ -0,0 +1,59 @@
+import React from 'react';
+export type OverlayAlignType = 'left' | 'center' | 'right';
+export interface PopOverOverlay {
+    width?: string | number;
+    align?: OverlayAlignType;
+}
+export interface PopOverContainerProps {
+    show?: boolean;
+    children: (props: {
+        disabled?: boolean;
+        onClick: (e: React.MouseEvent) => void;
+        isOpened: boolean;
+        ref: any;
+    }) => JSX.Element;
+    disabled?: boolean;
+    /** 弹出层打开时触发的事件 */
+    onOpen?: () => void;
+    popOverRender: (props: {
+        onClose: () => void;
+    }) => JSX.Element;
+    popOverContainer?: any;
+    popOverClassName?: string;
+    mobileUI?: boolean;
+    placement?: string;
+    overlayWidth?: number | string;
+    overlayWidthField?: 'minWidth' | 'width';
+    showConfirm?: boolean;
+    align?: OverlayAlignType;
+    /** Popover层隐藏前触发的事件 */
+    onBeforeHide?: () => void;
+    /** Popover层隐藏后触发的事件 */
+    onAfterHide?: () => void;
+    onConfirm?: () => void;
+}
+export interface PopOverContainerState {
+    isOpened: boolean;
+}
+export declare class PopOverContainer extends React.Component<PopOverContainerProps, PopOverContainerState> {
+    static alignPlacementMap: {
+        left: string;
+        right: string;
+        center: string;
+    };
+    state: PopOverContainerState;
+    target: any;
+    targetRef(target: any): void;
+    handleClick(e?: React.MouseEvent): void;
+    close(): void;
+    getTarget(): any;
+    getParent(): any;
+    onConfirm(): void;
+    static calcOverlayWidth(overlay: PopOverOverlay, targetWidth: number): string | number | undefined;
+    static alignToPlacement(overlay?: PopOverOverlay): string;
+    getOverlayStyle(): {
+        [x: string]: string | number;
+    };
+    render(): React.JSX.Element;
+}
+export default PopOverContainer;

package/lib/components/RichText.d.ts

@@ -0,0 +1,48 @@
+/**
+ * @file RichText
+ * @description
+ * @author fex
+ */
+import React from 'react';
+import FroalaEditor from 'froala-editor';
+import 'froala-editor/js/plugins/align.min';
+import 'froala-editor/js/plugins/colors.min';
+import 'froala-editor/js/plugins/char_counter.min';
+import 'froala-editor/js/plugins/code_view.min';
+import 'froala-editor/js/plugins/draggable.min';
+import 'froala-editor/js/plugins/entities.min';
+import 'froala-editor/js/plugins/font_family.min';
+import 'froala-editor/js/plugins/font_size.min';
+import 'froala-editor/js/plugins/forms.min';
+import 'froala-editor/js/plugins/fullscreen.min';
+import 'froala-editor/js/plugins/help.min';
+import 'froala-editor/js/plugins/image.min';
+import 'froala-editor/js/plugins/inline_class.min';
+import 'froala-editor/js/plugins/inline_style.min';
+import 'froala-editor/js/plugins/line_breaker.min';
+import 'froala-editor/js/plugins/line_height.min';
+import 'froala-editor/js/plugins/link.min';
+import 'froala-editor/js/plugins/lists.min';
+import 'froala-editor/js/plugins/paragraph_format.min';
+import 'froala-editor/js/plugins/paragraph_style.min';
+import 'froala-editor/js/plugins/print.min';
+import 'froala-editor/js/plugins/quick_insert.min';
+import 'froala-editor/js/plugins/quote.min';
+import 'froala-editor/js/plugins/save.min';
+import 'froala-editor/js/plugins/special_characters.min';
+import 'froala-editor/js/plugins/table.min';
+import 'froala-editor/js/plugins/url.min';
+import 'froala-editor/js/plugins/video.min';
+import 'froala-editor/js/plugins/word_paste.min';
+import 'froala-editor/js/languages/zh_cn.js';
+export interface FroalaEditorComponentProps {
+    config: any;
+    model: string;
+    onModelChange: (value: string) => void;
+    children?: React.ReactNode;
+}
+export default class extends React.Component<any, any> {
+    constructor(props: any);
+    render(): React.JSX.Element;
+}
+export { FroalaEditor };

package/lib/components/RichText.js

@@ -0,0 +1,275 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+'use strict';
+
+/**
+ * @file RichText
+ * @description
+ * @author fex
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FroalaEditor = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
+// @ts-ignore
+var froala_editor_1 = tslib_1.__importDefault(require("froala-editor"));
+exports.FroalaEditor = froala_editor_1.default;
+// @ts-ignore
+var froala_editor_min_js_1 = tslib_1.__importDefault(require("froala-editor/js/froala_editor.min.js"));
+require("froala-editor/js/plugins/align.min");
+require("froala-editor/js/plugins/colors.min");
+require("froala-editor/js/plugins/char_counter.min");
+require("froala-editor/js/plugins/code_view.min");
+require("froala-editor/js/plugins/draggable.min");
+require("froala-editor/js/plugins/entities.min");
+require("froala-editor/js/plugins/font_family.min");
+require("froala-editor/js/plugins/font_size.min");
+require("froala-editor/js/plugins/forms.min");
+require("froala-editor/js/plugins/fullscreen.min");
+require("froala-editor/js/plugins/help.min");
+require("froala-editor/js/plugins/image.min");
+require("froala-editor/js/plugins/inline_class.min");
+require("froala-editor/js/plugins/inline_style.min");
+require("froala-editor/js/plugins/line_breaker.min");
+require("froala-editor/js/plugins/line_height.min");
+require("froala-editor/js/plugins/link.min");
+require("froala-editor/js/plugins/lists.min");
+require("froala-editor/js/plugins/paragraph_format.min");
+require("froala-editor/js/plugins/paragraph_style.min");
+require("froala-editor/js/plugins/print.min");
+require("froala-editor/js/plugins/quick_insert.min");
+require("froala-editor/js/plugins/quote.min");
+require("froala-editor/js/plugins/save.min");
+require("froala-editor/js/plugins/special_characters.min");
+require("froala-editor/js/plugins/table.min");
+require("froala-editor/js/plugins/url.min");
+require("froala-editor/js/plugins/video.min");
+require("froala-editor/js/plugins/word_paste.min");
+require("froala-editor/js/languages/zh_cn.js");
+// 代码来源于：https://github.com/froala/react-froala-wysiwyg/blob/master/lib/FroalaEditorFunctionality.jsx
+// 改动原因是model 同步有些问题，有时候不更新，所以基于官方代码改造一下。
+// 目前发现的问题是，如果 model 数据修改，如果此时 editor 还没有初始化完成则不会同步成功
+var FroalaEditorComponent = /** @class */ (function (_super) {
+    tslib_1.__extends(FroalaEditorComponent, _super);
+    function FroalaEditorComponent(props) {
+        var _this = _super.call(this, props) || this;
+        _this.listeningEvents = [];
+        _this.element = null;
+        _this.editor = null;
+        _this.config = {
+            immediateReactModelUpdate: false,
+            reactIgnoreAttrs: null
+        };
+        _this.editorInitialized = false;
+        _this.INNER_HTML_ATTR = 'innerHTML';
+        _this.oldModel = null;
+        return _this;
+    }
+    // After first time render.
+    FroalaEditorComponent.prototype.componentDidMount = function () {
+        this.createEditor();
+    };
+    FroalaEditorComponent.prototype.componentWillUnmount = function () {
+        this.destroyEditor();
+    };
+    FroalaEditorComponent.prototype.componentDidUpdate = function (prevProps) {
+        if (!(0, isEqual_1.default)(this.props.config, prevProps.config)) {
+            this.destroyEditor();
+            this.createEditor();
+            return;
+        }
+        if (JSON.stringify(this.oldModel) == JSON.stringify(this.props.model)) {
+            return;
+        }
+        this.setContent();
+    };
+    // Return cloned object
+    FroalaEditorComponent.prototype.clone = function (item) {
+        var me = this;
+        if (!item) {
+            return item;
+        } // null, undefined values check
+        var types = [Number, String, Boolean], result;
+        // normalizing primitives if someone did new String('aaa'), or new Number('444');
+        types.forEach(function (type) {
+            if (item instanceof type) {
+                result = type(item);
+            }
+        });
+        if (typeof result == 'undefined') {
+            if (Object.prototype.toString.call(item) === '[object Array]') {
+                result = [];
+                item.forEach(function (child, index, array) {
+                    result[index] = me.clone(child);
+                });
+            }
+            else if (typeof item == 'object') {
+                // testing that this is DOM
+                if (item.nodeType && typeof item.cloneNode == 'function') {
+                    result = item.cloneNode(true);
+                }
+                else if (!item.prototype) {
+                    // check that this is a literal
+                    if (item instanceof Date) {
+                        result = new Date(item);
+                    }
+                    else {
+                        // it is an object literal
+                        result = {};
+                        for (var i in item) {
+                            result[i] = me.clone(item[i]);
+                        }
+                    }
+                }
+                else {
+                    {
+                        result = item;
+                    }
+                }
+            }
+            else {
+                result = item;
+            }
+        }
+        return result;
+    };
+    FroalaEditorComponent.prototype.createEditor = function () {
+        var _this = this;
+        if (this.editorInitialized) {
+            return;
+        }
+        this.config = this.clone(this.props.config || this.config);
+        this.config = tslib_1.__assign({}, this.config);
+        this.element = this.el;
+        if (this.props.model) {
+            this.element.innerHTML = this.props.model;
+        }
+        this.setContent();
+        // Default initialized.
+        this.registerEvent('initialized', this.config.events && this.config.events.initialized);
+        // Check if events are set.
+        if (!this.config.events)
+            this.config.events = {};
+        this.config.events.initialized = function () {
+            _this.editorInitialized = true;
+            _this.initListeners();
+        };
+        this.editor = new froala_editor_1.default(this.element, this.config);
+    };
+    FroalaEditorComponent.prototype.setContent = function () {
+        var _this = this;
+        if (this.props.model || this.props.model == '') {
+            this.oldModel = this.props.model;
+            if (this.editorInitialized) {
+                this.setNormalTagContent();
+            }
+            else {
+                if (!this._initEvents)
+                    this._initEvents = [];
+                this._initEvents.push(function () { return _this.setNormalTagContent(); });
+            }
+        }
+    };
+    FroalaEditorComponent.prototype.setNormalTagContent = function () {
+        var self = this;
+        self.editor.html && self.editor.html.set(self.props.model || '');
+        if (self.editorInitialized && self.editor.undo) {
+            //This will reset the undo stack everytime the model changes externally. Can we fix this?
+            self.editor.undo.reset();
+            self.editor.undo.saveStep();
+        }
+    };
+    FroalaEditorComponent.prototype.destroyEditor = function () {
+        if (this.element) {
+            this.editor.destroy && this.editor.destroy();
+            this.listeningEvents.length = 0;
+            this.element = null;
+            this.editorInitialized = false;
+            this._initEvents = [];
+        }
+    };
+    FroalaEditorComponent.prototype.getEditor = function () {
+        if (this.element) {
+            return this.editor;
+        }
+        return null;
+    };
+    FroalaEditorComponent.prototype.updateModel = function () {
+        if (!this.props.onModelChange) {
+            return;
+        }
+        var modelContent = '';
+        var returnedHtml = this.editor.html.get();
+        if (typeof returnedHtml === 'string') {
+            modelContent = returnedHtml;
+        }
+        if (this.oldModel !== modelContent) {
+            this.oldModel = modelContent;
+            this.props.onModelChange(modelContent);
+        }
+    };
+    FroalaEditorComponent.prototype.initListeners = function () {
+        var self = this;
+        // bind contentChange and keyup event to froalaModel
+        this.editor.events.on('contentChanged', function () {
+            self.updateModel();
+        });
+        if (this.config.immediateReactModelUpdate) {
+            this.editor.events.on('keyup', function () {
+                self.updateModel();
+            });
+        }
+        // Call init events.
+        if (this._initEvents) {
+            for (var i = 0; i < this._initEvents.length; i++) {
+                this._initEvents[i].call(this.editor);
+            }
+        }
+    };
+    // register event on jquery editor element
+    FroalaEditorComponent.prototype.registerEvent = function (eventName, callback) {
+        if (!eventName || !callback) {
+            return;
+        }
+        if (eventName == 'initialized') {
+            if (!this._initEvents)
+                this._initEvents = [];
+            this._initEvents.push(callback);
+        }
+        else {
+            if (!this.config.events) {
+                this.config.events = {};
+            }
+            this.config.events[eventName] = callback;
+        }
+    };
+    FroalaEditorComponent.prototype.render = function () {
+        var _this = this;
+        return (react_1.default.createElement("textarea", { ref: function (el) { return (_this.el = el); } }, this.props.children));
+    };
+    return FroalaEditorComponent;
+}(react_1.default.Component));
+var default_1 = /** @class */ (function (_super) {
+    tslib_1.__extends(default_1, _super);
+    function default_1(props) {
+        var _this = _super.call(this, props) || this;
+        froala_editor_min_js_1.default.VIDEO_PROVIDERS = [
+            {
+                test_regex: /.*/,
+                url_regex: '',
+                url_text: '',
+                html: '<span class="fr-video fr-dvb fr-draggable" contenteditable="false" draggable="true"><video class="fr-draggable" controls="" data-msg="ok" data-status="0" src="{url}" style="width: 600px;"></video></span>'
+            }
+        ];
+        return _this;
+    }
+    default_1.prototype.render = function () {
+        return (react_1.default.createElement(FroalaEditorComponent, { config: this.props.config, model: this.props.model, onModelChange: this.props.onModelChange }));
+    };
+    return default_1;
+}(react_1.default.Component));
+exports.default = default_1;

package/lib/components/SelectMobile.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { Option, SelectProps } from './Select';
+interface SelectState {
+    isFocused: boolean;
+    inputValue: string;
+    itemHeight: number;
+    selection: Array<Option>;
+}
+interface Props extends SelectProps {
+    isOpen: boolean;
+    highlightedIndex: any;
+    selectedItem: any;
+    visibleItemCount?: number;
+    getInputProps: (...params: any) => any;
+    getItemProps: (...params: any) => any;
+    onClose: () => void;
+}
+export default class SelectMobile extends React.Component<Props, SelectState> {
+    input: HTMLInputElement;
+    target: HTMLElement;
+    constructor(props: Props);
+    handleChange([item]: any): void;
+    handleInputChange(evt: React.ChangeEvent<HTMLInputElement>): void;
+    getTarget(): HTMLElement;
+    inputRef(ref: HTMLInputElement): void;
+    toggleCheckAll(): void;
+    handleAddClick(): void;
+    handleEditClick(e: Event, item: any): void;
+    handleDeleteClick(e: Event, item: any): void;
+    onFocus(e: any): void;
+    onBlur(e: any): void;
+    focus(): void;
+    blur(): void;
+    clearSearchValue(): void;
+    onConfirm(): void;
+    render(): React.JSX.Element;
+}
+export {};

package/lib/components/Tab.d.ts

@@ -0,0 +1,2 @@
+import { Tab } from './Tabs';
+export default Tab;

package/lib/components/Table.d.ts

@@ -0,0 +1,2 @@
+import Table from './table/index';
+export default Table;

package/lib/components/Tinymce.d.ts

@@ -0,0 +1,66 @@
+import React from 'react';
+import tinymce, { Editor } from 'tinymce/tinymce';
+import 'tinymce/icons/default/index';
+import 'tinymce/themes/silver';
+import 'tinymce/models/dom/model';
+import 'tinymce/plugins/advlist';
+import 'tinymce/plugins/autolink';
+import 'tinymce/plugins/autoresize';
+import 'tinymce/plugins/lists';
+import 'tinymce/plugins/link';
+import 'tinymce/plugins/image';
+import 'tinymce/plugins/charmap';
+import 'tinymce/plugins/preview';
+import 'tinymce/plugins/anchor';
+import 'tinymce/plugins/searchreplace';
+import 'tinymce/plugins/visualblocks';
+import 'tinymce/plugins/code';
+import 'tinymce/plugins/fullscreen';
+import 'tinymce/plugins/insertdatetime';
+import 'tinymce/plugins/media';
+import 'tinymce/plugins/table';
+import 'tinymce/plugins/help';
+import 'tinymce/plugins/wordcount';
+import 'tinymce/plugins/pagebreak';
+import 'tinymce/plugins/visualchars';
+import 'tinymce/plugins/template';
+import 'tinymce/plugins/nonbreaking';
+import 'tinymce/plugins/emoticons';
+import 'tinymce/plugins/emoticons/js/emojis';
+import 'tinymce/plugins/quickbars/plugin';
+import 'tinymce/plugins/help/js/i18n/keynav/zh_CN';
+import 'tinymce/plugins/help/js/i18n/keynav/en';
+import 'tinymce/plugins/help/js/i18n/keynav/de';
+import { LocaleProps } from 'amis-rev-core';
+interface TinymceEditorProps extends LocaleProps {
+    model: string;
+    onModelChange?: (value: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    disabled?: boolean;
+    config?: {
+        onLoaded?: (tinymce: any) => void | Promise<void>;
+        [propName: string]: any;
+    };
+    outputFormat?: 'html' | 'text';
+    receiver?: string;
+}
+export default class TinymceEditor extends React.Component<TinymceEditorProps> {
+    static defaultProps: {
+        outputFormat: string;
+    };
+    config?: any;
+    editor?: Editor;
+    unmounted: boolean;
+    editorInitialized?: boolean;
+    currentContent?: string;
+    elementRef: React.RefObject<HTMLTextAreaElement>;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: TinymceEditorProps): void;
+    componentWillUnmount(): void;
+    initTiny(): Promise<void>;
+    handleIframeUnload(): void;
+    initEditor(e: any, editor: Editor): void;
+    render(): React.JSX.Element;
+}
+export { tinymce };