amis-editor 4.0.1-beta.9 → 4.0.2-beta.4

package/dist/component/Control/OptionControl.d.ts

@@ -0,0 +1,163 @@
+/**
+ * @file 组件选项组件的可视化编辑控件
+ */
+import React from 'react';
+import Sortable from 'sortablejs';
+import type { Option } from 'amis';
+import type { FormControlProps } from 'amis/lib/renderers/Form/Item';
+import type { OptionValue } from 'amis/lib/components/Select';
+export declare type valueType = 'text' | 'boolean' | 'number';
+export interface PopoverForm {
+    optionLabel: string;
+    optionValue: any;
+    optionValueType: valueType;
+}
+export declare type OptionControlItem = Option & {
+    checked: boolean;
+};
+export interface OptionControlProps extends FormControlProps {
+    className?: string;
+}
+export interface OptionControlState {
+    options: Array<OptionControlItem>;
+    popOverData: any;
+    popOverCtx?: {
+        mode: 'add' | 'edit';
+        index?: number;
+    };
+    source: 'custom' | 'api' | 'form';
+    sourceOptions: Array<Option>;
+}
+export declare class OptionControl extends React.Component<OptionControlProps, OptionControlState> {
+    sortable?: Sortable;
+    drag?: HTMLElement | null;
+    target: HTMLElement | null;
+    internalProps: string[];
+    constructor(props: OptionControlProps);
+    componentDidUpdate(prevProps: OptionControlProps): void;
+    /**
+     * 获取当前选项值的类型
+     */
+    getOptionValueType(value: any): valueType;
+    /**
+     * 将当前选项值转换为选择的类型
+     */
+    normalizeOptionValue(value: any, valueType: valueType): string | number | boolean;
+    /**
+     * 处理填入输入框的值
+     */
+    transformOptionValue(value: any): string;
+    transformOptions(props: OptionControlProps): {
+        checked: boolean;
+        label?: string | undefined;
+        scopeLabel?: string | undefined;
+        value?: any;
+        disabled?: boolean | undefined;
+        children?: import("amis").Options | undefined;
+        visible?: boolean | undefined;
+        hidden?: boolean | undefined;
+        description?: string | undefined;
+        defer?: boolean | undefined;
+        deferApi?: import("amis").SchemaApi | undefined;
+        loading?: boolean | undefined;
+        loaded?: boolean | undefined;
+    }[];
+    /**
+     * 处理当前组件的默认值
+     */
+    normalizeValue(): OptionValue | OptionValue[];
+    /**
+     * 更新options字段的统一出口
+     */
+    onChangeOptions(): void;
+    targetRef(ref: any): void;
+    dragRef(ref: any): void;
+    initDragging(): void;
+    destroyDragging(): void;
+    scroll2Bottom(): void;
+    /**
+     * 切换选项类型
+     */
+    handleSourceChange(option: {
+        label: string;
+        value: 'custom' | 'api' | 'form';
+    }): void;
+    /**
+     * 删除选项
+     */
+    handleDelete(index: number, e: React.UIEvent<any>): void;
+    /**
+     * 设置默认选项
+     */
+    handleToggleDefaultValue(index: number, checked: any, shift?: boolean): void;
+    /**
+     * 编辑选项
+     */
+    handleEdit(index: number, e: React.UIEvent<any>): void;
+    handleEditLabel(index: number, e: React.FocusEvent<HTMLInputElement>): void;
+    handleAdd(): void;
+    handlePopoverSubmit(values: PopoverForm, action: any): void;
+    closePopoverEdit(): boolean;
+    handleBatchAdd(values: {
+        batchOption: string;
+    }, action: any): void;
+    renderHeader(): JSX.Element;
+    renderOption(props: any): JSX.Element;
+    renderPopover(): JSX.Element;
+    buildBatchAddSchema(): {
+        type: string;
+        actionType: string;
+        level: string;
+        size: string;
+        label: string;
+        dialog: {
+            title: string;
+            headerClassName: string;
+            closeOnEsc: boolean;
+            closeOnOutside: boolean;
+            showCloseButton: boolean;
+            body: ({
+                type: string;
+                level: string;
+                body: string;
+                showIcon: boolean;
+                className: string;
+                wrapWithPanel?: undefined;
+                mode?: undefined;
+                wrapperComponent?: undefined;
+                resetAfterSubmit?: undefined;
+                autoFocus?: undefined;
+                preventEnterSubmit?: undefined;
+                horizontal?: undefined;
+            } | {
+                type: string;
+                wrapWithPanel: boolean;
+                mode: string;
+                wrapperComponent: string;
+                resetAfterSubmit: boolean;
+                autoFocus: boolean;
+                preventEnterSubmit: boolean;
+                horizontal: {
+                    left: number;
+                    right: number;
+                };
+                body: {
+                    name: string;
+                    type: string;
+                    label: string;
+                    placeholder: string;
+                    trimContents: boolean;
+                    minRows: number;
+                    maxRows: number;
+                    required: boolean;
+                }[];
+                level?: undefined;
+                showIcon?: undefined;
+                className?: undefined;
+            })[];
+        };
+    };
+    render(): JSX.Element;
+}
+export declare class OptionControlRenderer extends OptionControl {
+}

package/dist/component/Control/PopoverEdit.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @file 浮窗编辑
+ */
+import React from 'react';
+import type { Action } from 'amis/lib/types';
+import type { IScopedContext } from 'amis/lib/Scoped';
+import type { FormSchema } from 'amis/lib/renderers/Form';
+import type { FormControlProps } from 'amis/lib/renderers/Form/Item';
+import type { Offset } from 'amis/lib/components/PopOver';
+export interface PopoverEditProps extends FormControlProps {
+    className?: string;
+    popOverclassName?: string;
+    btnLabel?: string;
+    btnIcon?: string;
+    iconPosition?: 'right' | 'left';
+    mode: 'popover' | 'dialog';
+    form: Omit<FormSchema, 'type'>;
+    rootClose?: boolean;
+    placement?: string;
+    offset?: ((clip: object, offset: object) => Offset) | Offset;
+    style?: object;
+    overlay?: boolean;
+    container?: React.ReactNode | Function;
+    target?: React.ReactNode | Function;
+    trueValue?: any;
+    falseValue?: any;
+    enableEdit?: boolean;
+    removable?: boolean;
+    onClose: (e: React.UIEvent<any> | void) => void;
+}
+interface PopoverEditState {
+    /**
+     * 是否展示编辑窗口
+     */
+    show: boolean;
+    /**
+     * 是否开启编辑
+     */
+    checked: boolean;
+}
+export declare class PopoverEdit extends React.Component<PopoverEditProps, PopoverEditState> {
+    static defaultProps: Pick<PopoverEditProps, 'btnIcon' | 'iconPosition' | 'container' | 'placement' | 'overlay' | 'rootClose' | 'mode' | 'trueValue' | 'falseValue' | 'enableEdit'>;
+    overlay: HTMLElement | null;
+    constructor(props: PopoverEditProps);
+    overlayRef(ref: any): void;
+    openPopover(): void;
+    closePopover(): void;
+    handleDelete(e: React.UIEvent<any> | void): void;
+    handleSwitchChange(checked: boolean): void;
+    handleSubmit(values: any, action: any): void;
+    handleAction(e: React.UIEvent<any> | void, action: Action, data: object, throwErrors?: boolean, delegate?: IScopedContext): void;
+    renderPopover(): JSX.Element;
+    render(): JSX.Element;
+}
+export declare class PopoverEditRenderer extends PopoverEdit {
+}
+export {};

package/dist/component/Control/ValidationControl.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @file 表单项校验配置
+ */
+/// <reference types="lodash" />
+import React from 'react';
+import type { FormControlProps } from 'amis/lib/renderers/Form/Item';
+export interface ValidationControlProps extends FormControlProps {
+}
+interface Rule {
+    label: string;
+    key: string;
+    value: boolean | string | number;
+    checked: boolean;
+    message?: string;
+}
+interface ValidationControlState {
+    rules: Array<Rule>;
+}
+export declare class ValidationControl extends React.Component<ValidationControlProps, ValidationControlState> {
+    validationRules: Record<string, string>;
+    constructor(props: ValidationControlProps);
+    transformRules(): Rule[];
+    normalizeRules(): import("lodash").Dictionary<boolean | Record<string, any>>;
+    handleAddRule(): void;
+    handleSubmit(values: any, action: any): void;
+    render(): JSX.Element;
+}
+export declare class ValidationControlRenderer extends ValidationControl {
+}
+export {};

package/dist/component/Editor.d.ts

@@ -14,6 +14,7 @@ export interface EditorProps extends PluginEventListener {
     className?: string;
     $schemaUrl?: string;
     theme?: string;
+    showCustomRenderersPanel?: boolean;
     amisDocHost?: string;
     /**
      * Preview 预览前可以修改配置。

package/dist/component/Panel/AMisCodeEditor.d.ts

@@ -0,0 +1,37 @@
+/// <reference types="lodash" />
+import React from 'react';
+export interface AMisCodeEditorProps {
+    value: any;
+    onChange: (value: any, diff: any) => void;
+    onPaste?: () => void;
+    disabled?: boolean;
+    $schemaUrl?: string;
+    $schema?: string;
+    className?: string;
+    theme?: string;
+}
+export default class AMisCodeEditor extends React.Component<AMisCodeEditorProps> {
+    state: {
+        wrongSchema: string;
+        value: any;
+        contents: any;
+    };
+    lastResult: any;
+    toDispose: Array<() => void>;
+    editor: any;
+    monaco: any;
+    model: any;
+    decorations: any;
+    uri: string;
+    componentDidUpdate(prevProps: AMisCodeEditorProps): void;
+    obj2str(value: any, props: AMisCodeEditorProps): any;
+    str2obj(str: string): any;
+    emitChange: import("lodash").DebouncedFunc<() => void>;
+    changeJsonOptions(props?: AMisCodeEditorProps): void;
+    editorFactory: (containerElement: HTMLElement, monaco: any, options: any) => any;
+    editorDidMount: (editor: any, monaco: any) => void;
+    editorWillUnmount: (editor: any, monaco: any) => void;
+    handleChange: (value: string) => void;
+    handleBlur: () => Promise<void>;
+    render(): JSX.Element;
+}

package/dist/component/Panel/AvailableRenderersPanel.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { PanelProps } from '../../plugin';
+declare type PanelStates = {
+    toggleCollapseFolderStatus: boolean;
+};
+export declare class AvailableRenderersPanel extends React.Component<PanelProps, PanelStates> {
+    handleSelect(key: string): void;
+    render(): JSX.Element;
+}
+export {};

package/dist/component/Panel/CodeEditorPanel.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { PanelProps } from '../../plugin';
+export default class CodeEditorPanel extends React.Component<PanelProps> {
+    handleCodePaste(): void;
+    render(): JSX.Element;
+}

package/dist/component/Panel/ContextMenuPanel.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { EditorStoreType } from '../../store/editor';
+export interface ContextMenuPanelProps {
+    store: EditorStoreType;
+}
+export declare class ContextMenuPanel extends React.Component<ContextMenuPanelProps> {
+    render(): JSX.Element | null;
+}

package/dist/component/Panel/DrawerPanel.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { EditorManager } from '../../manager';
+import { EditorStoreType } from '../../store/editor';
+import { EditorNodeType } from '../../store/node';
+export interface PanelsProps {
+    store: EditorStoreType;
+    manager: EditorManager;
+    node: EditorNodeType | undefined;
+    panelItem: any;
+    theme?: string;
+}
+export declare class DrawerPanel extends React.Component<PanelsProps> {
+    getPopOverContainer(): HTMLElement;
+    render(): JSX.Element;
+}

package/dist/component/Panel/DrawerRendererPanel.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { EditorManager } from '../../manager';
+import { EditorStoreType } from '../../store/editor';
+import { EditorNodeType } from '../../store/node';
+export interface PanelsProps {
+    store: EditorStoreType;
+    manager: EditorManager;
+    node: EditorNodeType | undefined;
+    panelItem: any;
+    theme?: string;
+}
+export declare class DrawerRendererPanel extends React.Component<PanelsProps> {
+    getPopOverContainer(): HTMLElement;
+    render(): JSX.Element;
+}

package/dist/component/Panel/InsertSubRendererPanel.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { PanelProps } from '../../plugin';
+export declare class InsertSubRendererPanel extends React.Component<PanelProps> {
+    handleLeftClick(e: React.MouseEvent): void;
+    handleClick(e: React.MouseEvent): void;
+    hadnlDBClick(e: React.MouseEvent): void;
+    handleInsert(): void;
+    handleReplace(): void;
+    handleCancel(): void;
+    render(): JSX.Element;
+}

package/dist/component/Panel/LeftPanels.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { EditorManager } from '../../manager';
+import { EditorStoreType } from '../../store/editor';
+interface LeftPanelsProps {
+    store: EditorStoreType;
+    manager: EditorManager;
+    theme?: string;
+}
+interface LeftPanelsStates {
+    isFixedStatus: boolean;
+}
+export declare class LeftPanels extends React.Component<LeftPanelsProps, LeftPanelsStates> {
+    constructor(props: any);
+    handleHidden(): void;
+    handleFixed(): void;
+    handleSelect(key: string): void;
+    getPopOverContainer(): HTMLElement;
+    render(): JSX.Element;
+}
+export {};

package/dist/component/Panel/Outline.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { PanelProps } from '../../plugin';
+import { EditorNodeType } from '../../store/node';
+export declare class OutlinePanel extends React.Component<PanelProps> {
+    state: {
+        curSearchElemKey: string;
+    };
+    handleClick(e: React.MouseEvent<HTMLAnchorElement>): void;
+    handleEnter(e: React.MouseEvent): void;
+    handleDragStart(e: React.DragEvent): void;
+    handleDragOver(e: React.DragEvent): void;
+    handleDrop(e: React.DragEvent): void;
+    handleSearchElemKeyChange(searchVal: string): void;
+    clearSearchElemKey(): void;
+    renderTitleByKeyword(rendererTitle: string, curSearchTitle: string): string | JSX.Element;
+    renderItem(option: EditorNodeType, index: number): JSX.Element | null;
+    render(): JSX.Element;
+}

package/dist/component/Panel/RenderersPanel.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { EditorStoreType } from '../../store/editor';
+import { EditorManager } from '../../manager';
+import { SubRendererInfo } from '../../plugin';
+declare type PanelProps = {
+    store: EditorStoreType;
+    manager: EditorManager;
+    groupedRenderers: {
+        [propName: string]: Array<SubRendererInfo>;
+    };
+    renderersPanelUUID: string;
+    isShowSearchRenderer?: boolean;
+    className?: string;
+};
+declare type PanelStates = {
+    toggleCollapseFolderStatus: boolean;
+};
+export default class RenderersPanel extends React.Component<PanelProps, PanelStates> {
+    state: {
+        toggleCollapseFolderStatus: boolean;
+    };
+    curCollapseFolded: {
+        [propName: string]: boolean;
+    };
+    handleRegionFilterClick(e: React.MouseEvent): void;
+    handleDragStart(e: React.DragEvent): void;
+    handleClick(e: React.MouseEvent): void;
+    changeCollapseFoldStatus(tagKey: string, event: any): void;
+    renderThumb(schema: any): JSX.Element;
+    render(): JSX.Element;
+}
+export {};

package/dist/component/Panel/RightPanels.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { EditorManager } from '../../manager';
+import { EditorStoreType } from '../../store/editor';
+interface RightPanelsProps {
+    store: EditorStoreType;
+    manager: EditorManager;
+    theme?: string;
+}
+interface RightPanelsStates {
+    isOpenStatus: boolean;
+    isFixedStatus: boolean;
+}
+export declare class RightPanels extends React.Component<RightPanelsProps, RightPanelsStates> {
+    constructor(props: any);
+    handleFixed(): void;
+    handleSelect(key: string): void;
+    handleHidden(): void;
+    getPopOverContainer(): HTMLElement;
+    render(): JSX.Element | null;
+}
+export {};

package/dist/component/Panel/TargetNamePanel.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { PanelProps } from '../../plugin';
+export declare class TargetNamePanel extends React.Component<PanelProps> {
+    handleClick(e: React.MouseEvent<HTMLElement>): void;
+    handleEnter(e: React.MouseEvent<HTMLElement>): void;
+    render(): JSX.Element;
+}

package/dist/component/Preview.d.ts

@@ -33,6 +33,7 @@ export default class Preview extends Component<PreviewProps> {
     getHighlightNodes(): string[];
     calculateHighlightBox(ids: Array<string>): void;
     handeMouseDown(e: MouseEvent): void;
+    /** 拖拽多选 */
     doSelection(rect: {
         x: number;
         y: number;

package/dist/component/ScaffoldModal.d.ts

@@ -14,7 +14,7 @@ export declare class ScaffoldModal extends React.Component<SubEditorProps> {
         wrapWithPanel: boolean;
         initApi: any;
         api: any;
-        mode: "normal" | "inline" | "horizontal";
+        mode: "normal" | "horizontal" | "inline";
         wrapperComponent: string;
     };
     amisScope: any;

package/dist/component/base/BackTop.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+export interface BackTopProps {
+    visibilityHeight?: number;
+    onClick?: React.MouseEventHandler<HTMLElement>;
+    target: () => HTMLElement | Window | Document;
+    children?: React.ReactNode;
+    className?: string;
+    visible?: boolean;
+}
+export interface BackTopStates {
+    visible: boolean;
+}
+export default class BackTop extends React.Component<BackTopProps, BackTopStates> {
+    ref: React.RefObject<HTMLDivElement>;
+    scrollElem: any;
+    constructor(props: any);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getDefaultTarget(): Document | (Window & typeof globalThis);
+    handleScroll(e: React.UIEvent<HTMLElement> | {
+        target: any;
+    }): void;
+    bindScrollEvent(): void;
+    scrollToTop(e: React.MouseEvent<HTMLDivElement>): void;
+    render(): JSX.Element;
+}

package/dist/component/base/ErrorRenderer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare class ErrorRenderer extends React.Component<any> {
+    render(): JSX.Element;
+}

package/dist/component/base/InputComponentName.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { RendererProps } from 'amis/lib/factory';
+interface InputComponentNameProps extends RendererProps {
+    value: any;
+    onChange: (value: any) => void;
+}
+export declare function InputComponentName(props: InputComponentNameProps): JSX.Element;
+export {};

package/dist/component/base/SearchRendererPanel.d.ts

@@ -0,0 +1,59 @@
+import React from 'react';
+import { EditorStoreType } from '../../store/editor';
+import { SubRendererInfo } from '../../plugin';
+interface SearchRendererProps {
+    store: EditorStoreType;
+}
+interface SearchRendererStates {
+    subRenderersByOrder: Array<SubRendererInfo>;
+    groupedSubRenderers: {
+        [propName: string]: Array<SubRendererInfo>;
+    };
+    searchSubRenderers: {
+        [propName: string]: Array<SubRendererInfo>;
+    };
+    visible: boolean;
+    curKeyword: string;
+    curKeywordSearchHistory: string[];
+    toggleTagFolderStatus: boolean;
+}
+export default class SearchRendererPanel extends React.Component<SearchRendererProps, SearchRendererStates> {
+    ref: React.RefObject<HTMLDivElement>;
+    curInputBox: any;
+    localStorageKey: string;
+    curTagFolded: {
+        [propName: string]: boolean;
+    };
+    lastSubRenderersTag: string;
+    constructor(props: any);
+    componentDidMount(): void;
+    componentWillReceiveProps(nextProps: any): void;
+    componentWillUnmount(): void;
+    bindFocusEvent(): void;
+    bindBlurEvent(): void;
+    updateCurKeyword(keywords: string): void;
+    searchSubRenderersByKeyword(): void;
+    changeTagFoldStatus(tagKey: string, event: any): void;
+    bindEnterEvent(event: any): void;
+    /** 删除搜索关键字 */
+    bindClearActionEvent(): void;
+    /** 组件分类tag点击事件 */
+    bindTagClickEvent(tag: string): void;
+    getSearchHistory(): any[];
+    /** 添加搜索历史 */
+    addSearchHistory(newKeywords: string): void;
+    /** 搜索历史/点击 */
+    clickKeywordEvent(keywords: string): void;
+    deleteSearchHistory(event: any, newKeywords: string): void;
+    clearSearchHistory(event: any): void;
+    /** 将搜索记录保存到localStorage */
+    updateSearchHistory(): void;
+    /** 显示搜索关键字 */
+    renderNameByKeyword(rendererName: string, curKeyword: string): string | JSX.Element;
+    /** 判断搜索展示内容是否有滚动（交互优化） */
+    resultIsHasScroll(searchSubRenderers: {
+        [propName: string]: Array<SubRendererInfo>;
+    }, maxShowLine: number): boolean;
+    render(): JSX.Element;
+}
+export {};

package/dist/component/base/WidthDraggableBtn.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+interface WidthDraggableProps {
+    isLeftDragIcon?: boolean;
+    className?: any;
+}
+export declare class WidthDraggableBtn extends React.Component<WidthDraggableProps> {
+    startX: number;
+    startWidth: number;
+    dragWrap: HTMLElement;
+    constructor(props: any);
+    handleResizeMouseDown(e: React.MouseEvent): void;
+    handleResizeMouseMove(e: MouseEvent): void;
+    handleResizeMouseUp(): void;
+    render(): JSX.Element;
+}
+export {};

package/dist/component/base/WidthDraggableContainer.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function (NeedWidthDraggableComp: React.ComponentType, isLeftDragIcon?: boolean): React.ComponentType;