amis-ui 6.13.0-beta.8 → 6.13.0

package/esm/components/Alert.js

@@ -0,0 +1,266 @@
+/**
+ * amis-ui v6.13.0
+ * Copyright 2018-2025 fex
+ */
+
+import { __extends, __awaiter, __generator } from 'tslib';
+import React__default from 'react';
+import { render } from 'react-dom';
+import FinalModal from './Modal.js';
+import Button from './Button.js';
+import { themeable, localeable } from 'amis-core';
+import Html from './Html.js';
+
+/**
+ * @file Alert
+ * @author fex
+ */
+var Alert = /** @class */ (function (_super) {
+    __extends(Alert, _super);
+    function Alert(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
+            show: false,
+            title: '',
+            content: '',
+            confirm: false,
+            size: '',
+            confirmBtnLevel: 'danger',
+            cancelBtnLevel: 'default',
+            closeOnEsc: false,
+            confirmText: '确认',
+            cancelText: '取消'
+        };
+        _this.unmount = false;
+        _this.close = _this.close.bind(_this);
+        _this.handleConfirm = _this.handleConfirm.bind(_this);
+        _this.handleCancel = _this.handleCancel.bind(_this);
+        _this.modalRef = _this.modalRef.bind(_this);
+        _this.handleFormSubmit = _this.handleFormSubmit.bind(_this);
+        _this.scopeRef = _this.scopeRef.bind(_this);
+        if (!props.isolate) {
+            _this.originInstance = Alert.instance;
+            Alert.instance = _this;
+        }
+        return _this;
+    }
+    Alert.getInstance = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var container, div;
+            return __generator(this, function (_a) {
+                if (!Alert.instance || Alert.instance.unmount) {
+                    console.warn('Alert 组件应该没有被渲染，所以隐性的渲染到 body 了');
+                    container = document.body;
+                    div = document.createElement('div');
+                    container.appendChild(div);
+                    // if (parseInt(version.split('.')[0], 10) >= 18) {
+                    //   const root = createRoot(div);
+                    //   await new Promise<void>(resolve =>
+                    //     root.render(<FinnalAlert ref={() => resolve()} />)
+                    //   );
+                    // } else {
+                    render(React__default.createElement(FinnalAlert, null), div);
+                    // }
+                }
+                return [2 /*return*/, Alert.instance];
+            });
+        });
+    };
+    Alert.prototype.componentDidMount = function () {
+        this._body && (this._body.innerHTML = this.state.content);
+    };
+    Alert.prototype.componentDidUpdate = function (prevProps, prevState) {
+        if (prevState.content !== this.state.content) {
+            this._body && (this._body.innerHTML = this.state.content);
+        }
+    };
+    Alert.prototype.componentWillUnmount = function () {
+        this.unmount = true;
+        if (Alert.instance === this) {
+            Alert.instance = this.originInstance || null;
+            this.originInstance = null;
+        }
+    };
+    Alert.prototype.scopeRef = function (schemaSope) {
+        this.schemaSope = schemaSope;
+    };
+    Alert.prototype.handleConfirm = function () {
+        var _a;
+        var form = (_a = this.schemaSope) === null || _a === void 0 ? void 0 : _a.getComponentByName('form');
+        if (form) {
+            form.doAction({ type: 'submit' });
+        }
+        else {
+            this.close(true);
+        }
+    };
+    Alert.prototype.handleCancel = function () {
+        this.close(false);
+    };
+    Alert.prototype.close = function (confirmed) {
+        var _this = this;
+        var isConfirm = this.state.confirm || this.state.prompt;
+        this.setState({
+            show: false,
+            prompt: false,
+            confirm: false
+        }, isConfirm ? function () { return _this._resolve(confirmed); } /*this._reject()*/ : undefined);
+    };
+    Alert.prototype.alert = function (content, title, className) {
+        this.setState({
+            title: title,
+            content: content,
+            show: true,
+            confirm: false,
+            className: className
+        });
+    };
+    Alert.prototype.confirm = function (content, title, optionsOrCofnrimText, cancelText) {
+        var _this = this;
+        this.setState({
+            title: title,
+            content: content,
+            show: true,
+            confirm: true,
+            confirmText: typeof optionsOrCofnrimText === 'string'
+                ? optionsOrCofnrimText
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.confirmText,
+            cancelText: cancelText,
+            size: typeof optionsOrCofnrimText === 'string'
+                ? ''
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.size,
+            closeOnEsc: typeof optionsOrCofnrimText === 'string'
+                ? false
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.closeOnEsc,
+            className: typeof optionsOrCofnrimText === 'string'
+                ? ''
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.className,
+            confirmBtnLevel: typeof optionsOrCofnrimText === 'string'
+                ? 'danger'
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.confirmBtnLevel,
+            cancelBtnLevel: typeof optionsOrCofnrimText === 'string'
+                ? 'default'
+                : optionsOrCofnrimText === null || optionsOrCofnrimText === void 0 ? void 0 : optionsOrCofnrimText.cancelBtnLevel
+        });
+        return new Promise(function (resolve) {
+            _this._resolve = resolve;
+        });
+    };
+    Alert.prototype.prompt = function (controls, defaultValue, title, confirmText) {
+        var _this = this;
+        if (title === void 0) { title = 'placeholder.enter'; }
+        if (confirmText === void 0) { confirmText = 'confirm'; }
+        if (typeof controls === 'string') {
+            // 兼容浏览器标准用法。
+            controls = [
+                {
+                    name: 'text',
+                    label: controls,
+                    type: 'text'
+                }
+            ];
+            if (typeof defaultValue === 'string') {
+                defaultValue = {
+                    text: defaultValue
+                };
+            }
+        }
+        else if (!Array.isArray(controls)) {
+            controls = [controls];
+        }
+        this.setState({
+            title: title,
+            controls: controls,
+            show: true,
+            prompt: true,
+            value: defaultValue,
+            confirmText: confirmText
+        });
+        return new Promise(function (resolve) {
+            _this._resolve = resolve;
+        });
+    };
+    Alert.prototype.modalRef = function (ref) {
+        this._modal = ref;
+    };
+    Alert.prototype.handleFormSubmit = function (values) {
+        this.close(values);
+    };
+    Alert.prototype.render = function () {
+        var _a, _b, _c, _d, _e;
+        var _f = this.props, container = _f.container, cancelText = _f.cancelText, confirmText = _f.confirmText, title = _f.title, confirmBtnLevel = _f.confirmBtnLevel, alertBtnLevel = _f.alertBtnLevel, cancelBtnLevel = _f.cancelBtnLevel, cx = _f.classnames;
+        var theme = this.props.theme || 'cxd';
+        if (theme === 'default') {
+            theme = 'cxd';
+        }
+        var __ = this.props.translate;
+        var finalTitle = __((_a = this.state.title) !== null && _a !== void 0 ? _a : title);
+        var finalConfirmText = __((_b = this.state.confirmText) !== null && _b !== void 0 ? _b : confirmText);
+        var finalCancelText = __((_c = this.state.cancelText) !== null && _c !== void 0 ? _c : cancelText);
+        var finalConfirmBtnLevel = (_d = this.state.confirmBtnLevel) !== null && _d !== void 0 ? _d : confirmBtnLevel;
+        var finalCancelBtnLevel = (_e = this.state.cancelBtnLevel) !== null && _e !== void 0 ? _e : cancelBtnLevel;
+        return (React__default.createElement(FinalModal, { show: this.state.show, onHide: this.handleCancel, container: container, ref: this.modalRef, closeOnEsc: this.state.closeOnEsc, size: this.state.size, className: cx(this.state.className) },
+            finalTitle ? (React__default.createElement("div", { className: cx('Modal-header') },
+                React__default.createElement("div", { className: cx('Modal-title') }, finalTitle))) : null,
+            React__default.createElement("div", { className: cx('Modal-body') }, this.state.prompt ? (renderForm(this.state.controls, this.state.value, this.handleFormSubmit, this.scopeRef, theme)) : typeof this.state.content === 'string' ? (React__default.createElement(Html, { html: this.state.content })) : (React__default.createElement(React__default.Fragment, null, this.state.content))),
+            finalConfirmText ? (React__default.createElement("div", { className: cx('Modal-footer') },
+                this.state.confirm || this.state.prompt ? (React__default.createElement(Button, { level: finalCancelBtnLevel, onClick: this.handleCancel }, __(finalCancelText))) : null,
+                React__default.createElement(Button, { level: this.state.confirm || this.state.prompt
+                        ? finalConfirmBtnLevel
+                        : alertBtnLevel, onClick: this.handleConfirm }, finalConfirmText))) : null));
+    };
+    Alert.instance = null;
+    Alert.defaultProps = {
+        confirmText: 'confirm',
+        cancelText: 'cancel',
+        title: 'Alert.info',
+        alertBtnLevel: 'primary',
+        confirmBtnLevel: 'danger',
+        cancelBtnLevel: 'default'
+    };
+    return Alert;
+}(React__default.Component));
+var renderSchemaFn;
+function setRenderSchemaFn(fn) {
+    renderSchemaFn = fn;
+}
+function renderForm(controls, value, callback, scopeRef, theme) {
+    if (value === void 0) { value = {}; }
+    return renderSchemaFn === null || renderSchemaFn === void 0 ? void 0 : renderSchemaFn(controls, value, callback, scopeRef, theme);
+}
+var alert = function (content, title, className) { return __awaiter(void 0, void 0, void 0, function () {
+    var instance;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4 /*yield*/, Alert.getInstance()];
+            case 1:
+                instance = _a.sent();
+                return [2 /*return*/, instance.alert(content, title, className)];
+        }
+    });
+}); };
+var confirm = function (content, title, optionsOrCofnrimText, cancelText) { return __awaiter(void 0, void 0, void 0, function () {
+    var instance;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4 /*yield*/, Alert.getInstance()];
+            case 1:
+                instance = _a.sent();
+                return [2 /*return*/, instance.confirm(content, title, optionsOrCofnrimText, cancelText)];
+        }
+    });
+}); };
+var prompt = function (controls, defaultvalue, title, confirmText) { return __awaiter(void 0, void 0, void 0, function () {
+    var instance;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4 /*yield*/, Alert.getInstance()];
+            case 1:
+                instance = _a.sent();
+                return [2 /*return*/, instance.prompt(controls, defaultvalue, title, confirmText)];
+        }
+    });
+}); };
+var FinnalAlert = themeable(localeable(Alert));
+
+export { Alert, FinnalAlert, alert, confirm, FinnalAlert as default, prompt, setRenderSchemaFn };

package/esm/components/Alert2.d.ts

@@ -0,0 +1,117 @@
+/**
+ * @file Alert2
+ * @author fex
+ */
+/// <reference types="hoist-non-react-statics" />
+import React from 'react';
+import { ClassNamesFn } from 'amis-core';
+export interface AlertProps {
+    level: 'danger' | 'info' | 'success' | 'warning';
+    title?: string;
+    className?: string;
+    style?: any;
+    showCloseButton: boolean;
+    showIcon?: boolean;
+    icon?: string | React.ReactNode;
+    iconClassName?: string;
+    closeButtonClassName?: string;
+    onClose?: () => void;
+    classnames: ClassNamesFn;
+    classPrefix: string;
+    children?: React.ReactNode | Array<React.ReactNode>;
+    actions?: React.ReactNode | React.ReactNode[];
+}
+export interface AlertState {
+    show: boolean;
+}
+export declare class Alert extends React.Component<AlertProps, AlertState> {
+    static defaultProps: Pick<AlertProps, 'level' | 'className' | 'showCloseButton'>;
+    static propsList: Array<string>;
+    constructor(props: AlertProps);
+    handleClick(): void;
+    render(): React.JSX.Element | null;
+}
+declare const _default: {
+    new (props: Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+        showCloseButton?: boolean | undefined;
+        level?: "success" | "warning" | "info" | "danger" | undefined;
+    } & {
+        className?: string | undefined;
+    } & import("packages/amis-core/lib/theme").ThemeOuterProps): {
+        ref: any;
+        childRef(ref: any): void;
+        getWrappedInstance(): any;
+        render(): React.JSX.Element;
+        context: unknown;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        componentDidMount?(): void;
+        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, prevState: Readonly<{}>): any;
+        componentDidUpdate?(prevProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, prevState: Readonly<{}>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<AlertProps, keyof import("amis-core").ThemeProps>, "children" | "title" | "icon" | "onClose" | "showIcon" | "iconClassName" | "closeButtonClassName" | "actions"> & {
+            showCloseButton?: boolean | undefined;
+            level?: "success" | "warning" | "info" | "danger" | undefined;
+        } & {
+            className?: string | undefined;
+        } & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    displayName: string;
+    contextType: React.Context<string>;
+    ComposedComponent: React.ComponentType<typeof Alert>;
+} & import("hoist-non-react-statics").NonReactStatics<typeof Alert, {}> & {
+    ComposedComponent: typeof Alert;
+};
+export default _default;

package/esm/components/Alert2.js

@@ -0,0 +1,58 @@
+/**
+ * amis-ui v6.13.0
+ * Copyright 2018-2025 fex
+ */
+
+import { __extends } from 'tslib';
+import React__default from 'react';
+import { themeable } from 'amis-core';
+import { Icon } from './icons.js';
+
+/**
+ * @file Alert2
+ * @author fex
+ */
+var Alert = /** @class */ (function (_super) {
+    __extends(Alert, _super);
+    function Alert(props) {
+        var _this = _super.call(this, props) || this;
+        _this.handleClick = _this.handleClick.bind(_this);
+        _this.state = {
+            show: true
+        };
+        return _this;
+    }
+    Alert.prototype.handleClick = function () {
+        this.setState({
+            show: false
+        }, this.props.onClose);
+    };
+    Alert.prototype.render = function () {
+        var _a = this.props, cx = _a.classnames, className = _a.className, style = _a.style, level = _a.level, children = _a.children, actions = _a.actions, showCloseButton = _a.showCloseButton, title = _a.title, icon = _a.icon, showIcon = _a.showIcon, iconClassName = _a.iconClassName, closeButtonClassName = _a.closeButtonClassName;
+        // 优先使用内置svg，其次使用icon库
+        var iconNode = showIcon ? (React__default.createElement(Icon, { cx: cx, icon: icon || "alert-".concat(level), className: "icon" })) : null;
+        return this.state.show ? (React__default.createElement("div", { className: cx('Alert', level ? "Alert--".concat(level) : '', title ? 'Alert-has-title' : '', className), style: style },
+            showIcon && iconNode ? (React__default.createElement("div", { className: cx('Alert-icon', iconClassName) }, iconNode)) : null,
+            React__default.createElement("div", { className: cx('Alert-content') },
+                title ? React__default.createElement("div", { className: cx('Alert-title') }, title) : null,
+                React__default.createElement("div", { className: cx('Alert-desc') }, children)),
+            actions ? React__default.createElement("div", { className: cx('Alert-actions') }, actions) : null,
+            showCloseButton ? (React__default.createElement("button", { className: cx('Alert-close', closeButtonClassName), onClick: this.handleClick, type: "button" },
+                React__default.createElement(Icon, { icon: "close", className: "icon" }))) : null)) : null;
+    };
+    Alert.defaultProps = {
+        level: 'info',
+        className: '',
+        showCloseButton: false
+    };
+    Alert.propsList = [
+        'level',
+        'className',
+        'showCloseButton',
+        'onClose'
+    ];
+    return Alert;
+}(React__default.Component));
+var Alert2 = themeable(Alert);
+
+export { Alert, Alert2 as default };

package/esm/components/AlphabetIndexer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ClassNamesFn } from 'amis-core';
+interface AlphabetIndexerProps {
+    items: Array<any>;
+    getItemLetter: (item: any) => string;
+    onLetterClick: (letter: string) => void;
+    classnames: ClassNamesFn;
+    currentLetter?: string;
+}
+declare const AlphabetIndexer: React.FC<AlphabetIndexerProps>;
+export default AlphabetIndexer;

package/esm/components/AlphabetIndexer.js

@@ -0,0 +1,48 @@
+/**
+ * amis-ui v6.13.0
+ * Copyright 2018-2025 fex
+ */
+
+import React__default, { useRef, useEffect } from 'react';
+
+var AlphabetIndexer = function (_a) {
+    var items = _a.items, getItemLetter = _a.getItemLetter, onLetterClick = _a.onLetterClick, cx = _a.classnames, currentLetter = _a.currentLetter;
+    var containerRef = useRef(null);
+    var letters = React__default.useMemo(function () {
+        return Array.from(new Set(items
+            .map(function (item) {
+            var value = getItemLetter(item);
+            return typeof value === 'string'
+                ? value.charAt(0).toUpperCase()
+                : '';
+        })
+            .filter(Boolean)
+            .sort()));
+    }, [items, getItemLetter]);
+    var handleTouchMove = function (e) {
+        e.preventDefault();
+        var touch = e.touches[0];
+        var target = document.elementFromPoint(touch.clientX, touch.clientY);
+        var letter = target === null || target === void 0 ? void 0 : target.getAttribute('data-letter');
+        if (letter) {
+            onLetterClick(letter);
+        }
+    };
+    useEffect(function () {
+        var container = containerRef.current;
+        if (container) {
+            container.addEventListener('touchmove', handleTouchMove, {
+                passive: false
+            });
+            return function () {
+                container.removeEventListener('touchmove', handleTouchMove);
+            };
+        }
+        return function () { };
+    }, []);
+    return (React__default.createElement("div", { ref: containerRef, className: cx('AlphabetIndexer') }, letters.map(function (letter) { return (React__default.createElement("div", { key: letter, className: cx('AlphabetIndexer-letter', {
+            'is-active': letter === currentLetter
+        }), "data-letter": letter, onClick: function () { return onLetterClick(letter); } }, letter)); })));
+};
+
+export { AlphabetIndexer as default };