@easy-editor/core 0.0.1

package/dist/designer/clipboard.d.ts

@@ -0,0 +1,12 @@
+declare class Clipboard {
+    private copyPasters;
+    private waitFn?;
+    isCopyPasteEvent(e: Event): void;
+    private isCopyPaster;
+    initCopyPaster(el: HTMLTextAreaElement): () => void;
+    injectCopyPaster(document: Document): (() => void) | undefined;
+    setData(data: any): Promise<void>;
+    waitPasteData(keyboardEvent: KeyboardEvent, cb: (data: any, e: ClipboardEvent) => void): void;
+}
+export declare const clipboard: Clipboard;
+export {};

package/dist/designer/component-meta/component-meta-manager.d.ts

@@ -0,0 +1,21 @@
+import type { Editor } from '../../editor';
+import type { Designer } from '../designer';
+import type { Component, ComponentMetadata } from './meta';
+import { ComponentMeta } from './component-meta';
+export declare class ComponentMetaManager {
+    readonly editor: Editor;
+    private accessor _componentMetasMap;
+    private _lostComponentMetasMap;
+    get designer(): Designer;
+    constructor(editor: Editor);
+    buildComponentMetasMap: (metas: Record<string, ComponentMetadata>) => void;
+    createComponentMeta(data: ComponentMetadata): ComponentMeta | null;
+    getComponentMeta(componentName: string, generateMetadata?: () => ComponentMetadata | null): ComponentMeta;
+    getComponentSnippets(): import("./meta").Snippet[];
+    get componentMetasMap(): Record<string, ComponentMetadata>;
+    get componentsMap(): {
+        [key: string]: Component;
+    };
+    getComponentMetasMap(): Map<string, ComponentMeta>;
+    isComponentMeta(obj: any): obj is ComponentMeta;
+}

package/dist/designer/component-meta/component-meta.d.ts

@@ -0,0 +1,30 @@
+import type { Designer } from '../designer';
+import type { ComponentMetadata } from './meta';
+export declare enum COMPONENT_META_EVENT {
+    CHANGE = "componentMeta:metadata.change"
+}
+export declare class ComponentMeta {
+    readonly designer: Designer;
+    readonly isComponentMeta = true;
+    private emitter;
+    private _componentName?;
+    get componentName(): string;
+    private _isContainer?;
+    get isContainer(): boolean;
+    private _descriptor?;
+    get descriptor(): string | undefined;
+    private _metadata?;
+    get configure(): import("./meta").FieldConfig[];
+    private _title?;
+    get title(): string;
+    get icon(): string | undefined;
+    get advanced(): import("./meta").Advanced;
+    get snippets(): import("./meta").Snippet[];
+    constructor(designer: Designer, metadata: ComponentMetadata);
+    private parseMetadata;
+    refreshMetadata(): void;
+    setMetadata(metadata: ComponentMetadata): void;
+    getMetadata(): ComponentMetadata;
+    onMetadataChange(fn: (args: any) => void): () => void;
+}
+export declare function isComponentMeta(obj: any): obj is ComponentMeta;

package/dist/designer/component-meta/index.d.ts

@@ -0,0 +1,3 @@
+export * from './component-meta';
+export * from './component-meta-manager';
+export * from './meta';

package/dist/designer/component-meta/meta.d.ts

@@ -0,0 +1,264 @@
+import type { Node, PropKey } from '../../document';
+import type { NodeSchema } from '../../types';
+import type { SettingField, SettingPropEntry } from '../setting';
+export interface ComponentMetadata {
+    componentName: string;
+    title?: string;
+    icon?: string;
+    tags?: string[];
+    description?: string;
+    /**
+     * component screenshot, for left panel to display component screenshot
+     */
+    screenshot?: string;
+    /**
+     * component dev mode
+     */
+    devMode?: 'proCode' | 'lowCode';
+    /**
+     * component configure, for right panel to use setter to config component
+     */
+    configure?: Configure;
+    /**
+     * available snippets, one snippet is a schema(a component)
+     */
+    snippets?: Snippet[];
+    /**
+     * first level group
+     */
+    group?: string;
+    /**
+     * second level group
+     */
+    category?: string;
+    /**
+     * component priority for sorting
+     */
+    priority?: number;
+    [key: string]: any;
+}
+export interface Snippet {
+    /**
+     * same as component title
+     */
+    title?: string;
+    /**
+     * same as component screenshot
+     */
+    screenshot?: string;
+    /**
+     * schema to be inserted
+     */
+    schema?: NodeSchema;
+}
+export interface Configure {
+    /**
+     * configure component props
+     */
+    props?: FieldConfig[];
+    /**
+     * component behavior configure
+     */
+    component?: ComponentConfigure;
+    /**
+     * 通用扩展面板支持性配置
+     */
+    supports?: ConfigureSupport;
+    /**
+     * 高级特性配置
+     */
+    advanced?: Advanced;
+}
+export interface FieldConfig {
+    /**
+     * default is field, if is group, the items will be used
+     */
+    type?: 'field' | 'group';
+    /**
+     * the setting items which group body contains when .type = 'group'
+     */
+    items?: FieldConfig[];
+    /**
+     * the name of this setting field, the name can refer to the props of the component, such as `title` or `obj.a` ...
+     */
+    name?: PropKey;
+    /**
+     * the field title, for configure tooltip
+     */
+    title?: string;
+    /**
+     * the field body contains when .type = 'field'
+     */
+    setter?: SetterType | DynamicSetter;
+    /**
+     * extra props for field
+     */
+    extraProps?: FieldExtraProps;
+}
+export interface FieldExtraProps {
+    /**
+     * is required
+     */
+    isRequired?: boolean;
+    /**
+     * default value of target prop for setter use
+     */
+    defaultValue?: any;
+    /**
+     * default collapsed
+     */
+    defaultCollapsed?: boolean;
+    /**
+     * get value for field
+     */
+    getValue?: (target: SettingField, fieldValue: any) => any;
+    /**
+     * set value for field
+     */
+    setValue?: (target: SettingField, value: any) => void;
+    /**
+     * the field conditional show, is not set always true
+     */
+    condition?: (target: SettingField) => boolean;
+    /**
+     * autorun when something change
+     */
+    autorun?: (target: SettingField) => void;
+    /**
+     * support variable
+     */
+    supportVariable?: boolean;
+    onChange?: (target: SettingField, value: any) => void;
+}
+export interface ComponentConfigure {
+    isContainer?: boolean;
+    descriptor?: string;
+    /**
+     * disable some behaviors, such as `'copy'`, `'move'`, `'remove'` or array of them
+     */
+    disableBehaviors?: string[] | string;
+}
+export interface ConfigureSupport {
+    /**
+     * supported events
+     */
+    events?: string[];
+    /**
+     * supported className
+     */
+    className?: boolean;
+    /**
+     * supported style
+     */
+    style?: boolean;
+    /**
+     * supported lifecycle
+     */
+    lifecycles?: any[];
+    /**
+     * supported loop component
+     */
+    loop?: boolean;
+    /**
+     * supported condition render
+     */
+    condition?: boolean;
+}
+export interface Advanced {
+    /**
+     * callbacks/hooks which can be used to do things on some special cations like onNodeAdd or onResize
+     */
+    callbacks?: Callbacks;
+    /**
+     * auto add children when drag into container
+     */
+    initialChildren?: NodeSchema[] | ((target: Node) => NodeSchema[]);
+    /**
+     * TODO: 补充文档
+     * @experimental not in spec yet
+     */
+    view?: ComponentType<any>;
+}
+export interface Callbacks {
+    onMouseDownHook?: (e: MouseEvent, currentNode: Node | null) => any;
+    onDblClickHook?: (e: MouseEvent, currentNode: Node | null) => any;
+    onClickHook?: (e: MouseEvent, currentNode: Node | null) => any;
+    onMoveHook?: (currentNode: Node) => boolean;
+    onHoverHook?: (currentNode: Node) => boolean;
+    /** 选中 hook，如果返回值是 false，可以控制组件不可被选中 */
+    onSelectHook?: (currentNode: Node) => boolean;
+    onChildMoveHook?: (childNode: Node, currentNode: Node) => boolean;
+    onNodeRemove?: (removedNode: Node | null, currentNode: Node | null) => void;
+    onNodeAdd?: (addedNode: Node | null, currentNode: Node | null) => void;
+    onSubtreeModified?: (currentNode: Node, options: any) => void;
+    onResize?: (e: MouseEvent & {
+        trigger: string;
+        deltaX?: number;
+        deltaY?: number;
+    }, currentNode: any) => void;
+    onResizeStart?: (e: MouseEvent & {
+        trigger: string;
+        deltaX?: number;
+        deltaY?: number;
+    }, currentNode: any) => void;
+    onResizeEnd?: (e: MouseEvent & {
+        trigger: string;
+        deltaX?: number;
+        deltaY?: number;
+    }, currentNode: Node) => void;
+}
+export type SetterType = SetterConfig | string;
+export type DynamicSetterProps = (target: SettingField) => Record<string, unknown>;
+export interface SetterConfig {
+    /**
+     * the name of the setter
+     */
+    componentName: string;
+    /**
+     * the props pass to Setter Component
+     */
+    props?: Record<string, unknown> | DynamicSetterProps;
+    /**
+     * is required
+     */
+    isRequired?: boolean;
+    /**
+     * Setter initial value
+     */
+    /**
+     * Setter default value
+     */
+    defaultValue?: any;
+}
+export declare const isSetterConfig: (obj: any) => obj is SetterConfig;
+export type DynamicSetter = (target: SettingPropEntry) => string | SetterConfig | Component;
+export type ComponentInstance = any;
+export type ComponentType<T> = any;
+/**
+ * component type
+ */
+export type Component = ComponentType<any> | object;
+export interface LowCodeComponent {
+    /**
+     * 研发模式
+     */
+    devMode: 'lowCode';
+    /**
+     * 组件名称
+     */
+    componentName: string;
+}
+export interface ProCodeComponent {
+    /**
+     * 研发模式
+     */
+    devMode: 'proCode';
+    /**
+     * 组件名称
+     */
+    componentName: string;
+}
+export type ComponentMap = ProCodeComponent | LowCodeComponent;
+export type ComponentsMap = ComponentMap[];
+export declare function isProCodeComponentType(desc: ComponentMap): desc is ProCodeComponent;
+export declare function isLowCodeComponentType(desc: ComponentMap): desc is LowCodeComponent;

package/dist/designer/designer.d.ts

@@ -0,0 +1,86 @@
+import type { Node, PropsMap } from '../document';
+import type { Editor } from '../editor';
+import type { ProjectSchema, TRANSFORM_STAGE } from '../types';
+import type { ComponentMetaManager } from './component-meta';
+import type { DragObject } from './dragon';
+import type { LocateEvent, LocationData } from './location';
+import { Project } from '../project';
+import { Detecting } from './detecting';
+import { Dragon } from './dragon';
+import { DropLocation } from './location';
+import { type NodeSelector, type OffsetObserver } from './offset-observer';
+import { Selection } from './selection';
+import { SettingsManager } from './setting';
+import { SettingTopEntry } from './setting/setting-top-entry';
+export type PropsTransducer = (props: PropsMap, node: Node, ctx?: {
+    stage: TRANSFORM_STAGE;
+}) => PropsMap;
+export interface DesignerProps {
+    editor: Editor;
+    defaultSchema?: ProjectSchema;
+    onDragstart?: (e: LocateEvent) => void;
+    onDrag?: (e: LocateEvent) => void;
+    onDragend?: (e: {
+        dragObject: DragObject;
+        copy: boolean;
+    }, loc?: DropLocation) => void;
+    [key: string]: any;
+}
+export declare enum DESIGNER_EVENT {
+    INIT = "designer:init",
+    DRAG_START = "designer:dragstart",
+    DRAG = "designer:drag",
+    DRAG_END = "designer:dragend",
+    CURRENT_DOCUMENT_CHANGE = "designer:current-document.change",
+    CURRENT_HISTORY_CHANGE = "designer:current-history.change",
+    DROP_LOCATION_CHANGE = "designer:dropLocation.change",
+    DOCUMENT_DROP_LOCATION_CHANGE = "designer:document.dropLocation.change",
+    INSERT_NODE_BEFORE = "designer:node.insert.before",
+    INSERT_NODE_AFTER = "designer:node.insert.after",
+    NODE_VISIBLE_CHANGE = "designer:node.visible.change",
+    NODE_LOCK_CHANGE = "designer:node.lock.change",
+    NODE_CHILDREN_CHANGE = "designer:node.children.change",
+    NODE_PROPS_CHANGE = "designer:node.props.change",
+    NODE_REMOVE = "designer:node.remove",
+    NODE_RENDER = "designer:node.render",
+    SETTING_TOP_ENTRY_VALUE_CHANGE = "designer:setting.top-entry.value.change",
+    SELECTION_CHANGE = "designer:selection.change",
+    SIMULATOR_SELECT = "designer:simulator.select",
+    VIEWPORT_MOUNT = "simulator:viewport.mount"
+}
+export declare class Designer {
+    private emitter;
+    readonly editor: Editor;
+    readonly dragon: Dragon;
+    readonly detecting: Detecting;
+    readonly project: Project;
+    readonly selection: Selection;
+    readonly settingsManager: SettingsManager;
+    private _dropLocation?;
+    get componentMetaManager(): ComponentMetaManager;
+    private props?;
+    private propsReducers;
+    private oobxList;
+    get currentDocument(): import("..").Document | undefined;
+    get currentHistory(): import("..").History<import("..").RootSchema> | undefined;
+    constructor(props: DesignerProps);
+    /**
+     * 该函数用于 Designer constructor 的插件扩展，因为 Object.defineProperty 无法修改 constructor
+     */
+    init(): void;
+    setProps(nextProps: DesignerProps): void;
+    get(key: string): any;
+    postEvent(event: string, ...args: any[]): void;
+    onEvent(event: string, listener: (...args: any[]) => void): () => void;
+    createLocation(locationData: LocationData<Node>): DropLocation;
+    clearLocation(): void;
+    createOffsetObserver(nodeInstance: NodeSelector): OffsetObserver | null;
+    private clearOobxList;
+    touchOffsetObserver(): void;
+    onInit(listener: (designer: Designer) => void): void;
+    get schema(): ProjectSchema<import("..").RootSchema>;
+    setSchema(schema: ProjectSchema): void;
+    transformProps(props: PropsMap, node: Node, stage: TRANSFORM_STAGE): PropsMap;
+    addPropsReducer(reducer: PropsTransducer, stage: TRANSFORM_STAGE): void;
+    createSettingEntry(nodes: Node[]): SettingTopEntry;
+}

package/dist/designer/detecting.d.ts

@@ -0,0 +1,23 @@
+import type { Designer } from '..';
+import type { Document, Node } from '../document';
+export declare enum DETECTING_EVENT {
+    CHANGE = "detecting:change"
+}
+export declare class Detecting {
+    readonly designer: Designer;
+    private emitter;
+    private accessor _enable;
+    /**
+     * control whether to show the hover effect when the outline tree is hovered
+     * TODO: extract this logic from the designer
+     */
+    get enable(): boolean;
+    set enable(flag: boolean);
+    private accessor _current;
+    get current(): Node<import("..").NodeSchema> | null;
+    constructor(designer: Designer);
+    capture(node: Node | null): void;
+    release(node: Node | null): void;
+    leave(document: Document | undefined): void;
+    onDetectingChange(fn: (node: Node) => void): () => void;
+}

package/dist/designer/dragon.d.ts

@@ -0,0 +1,103 @@
+import type { Designer } from '.';
+import type { Node } from '../document';
+import type { Simulator } from '../simulator';
+import type { NodeSchema } from '../types';
+import type { ComponentInstance } from './component-meta';
+import type { LocateEvent } from './location';
+import type { Sensor } from './sensor';
+export declare enum DRAGON_EVENT {
+    DRAGSTART = "dragstart",
+    DRAG = "drag",
+    DRAGEND = "dragend"
+}
+export declare enum DragObjectType {
+    Node = "node",
+    NodeData = "nodedata"
+}
+export declare class DragObject {
+    type: DragObjectType;
+    data?: NodeSchema | NodeSchema[] | undefined;
+    nodes?: (Node | null)[] | undefined;
+}
+export interface DragAnyObject {
+    type: string;
+    [key: string]: any;
+}
+export interface DragNodeObject<T = Node> {
+    type: DragObjectType.Node;
+    nodes: T[];
+}
+export interface DragNodeDataObject {
+    type: DragObjectType.NodeData;
+    data: NodeSchema | NodeSchema[];
+    thumbnail?: string;
+    description?: string;
+    [extra: string]: any;
+}
+export interface NodeInstance<T = ComponentInstance, N = Node> {
+    docId: string;
+    nodeId: string;
+    instance: T;
+    node?: N | null;
+}
+export declare function isDragAnyObject(obj: any): obj is DragAnyObject;
+export declare const isDragNodeObject: (obj: any) => obj is DragNodeObject;
+export declare const isDragNodeDataObject: (obj: any) => obj is DragNodeDataObject;
+export declare const isLocateEvent: (e: any) => e is LocateEvent;
+export declare const isDragEvent: (e: any) => e is DragEvent;
+export declare const isInvalidPoint: (e: any, last: any) => boolean;
+export declare const isSameAs: (e1: MouseEvent | DragEvent, e2: MouseEvent | DragEvent) => boolean;
+/**
+ * mouse shake check
+ */
+export declare const isShaken: (e1: MouseEvent | DragEvent, e2: MouseEvent | DragEvent) => boolean;
+export declare const setShaken: (e: any) => void;
+export declare const getSourceSensor: (dragObject: DragObject) => Simulator | null;
+export declare class Dragon {
+    readonly designer: Designer;
+    emitter: import("..").EventBus;
+    private sensors;
+    /** current active sensor */
+    private accessor _activeSensor;
+    get activeSensor(): Sensor<Node<NodeSchema>> | undefined;
+    private accessor _dragging;
+    get dragging(): boolean;
+    constructor(designer: Designer);
+    /**
+     * Quick listen a shell(container element) drag behavior
+     * @param shell container element
+     * @param boost boost got a drag object
+     * @param eventType choose a event to trigger the dnd
+     */
+    from(shell: HTMLElement, boost: (e: MouseEvent | DragEvent) => DragObject | null, eventType?: 'mouse' | 'drag'): () => void;
+    /**
+     * boost your dragObject for dragging(flying)
+     * @param dragObject drag object
+     * @param boostEvent drag start event
+     */
+    boost(dragObject: DragObject, boostEvent: MouseEvent | DragEvent): void;
+    /**
+     * get master sensors(opened documents)
+     */
+    private getMasterSensors;
+    /**
+     * get all simulators
+     */
+    private getSimulators;
+    /**
+     * 添加投放感应区
+     */
+    addSensor(sensor: Sensor): void;
+    /**
+     * 移除投放感应
+     */
+    removeSensor(sensor: Sensor): void;
+    onDragstart(func: (e: LocateEvent) => void): () => void;
+    onDrag(func: (e: LocateEvent) => void): () => void;
+    onDragend(func: (e: {
+        dragObject: DragObject;
+        copy?: boolean;
+        esc?: boolean;
+    }) => void): () => void;
+}
+export declare const makeEventsHandler: (boostEvent: MouseEvent | DragEvent, sensors: Simulator[]) => (handle: (sdoc: globalThis.Document) => void) => void;

package/dist/designer/index.d.ts

@@ -0,0 +1,10 @@
+export * from './clipboard';
+export * from './component-meta';
+export * from './designer';
+export * from './detecting';
+export * from './dragon';
+export * from './location';
+export * from './offset-observer';
+export * from './selection';
+export * from './sensor';
+export * from './setting';

package/dist/designer/location.d.ts

@@ -0,0 +1,94 @@
+import type { Document as IDocument, Node as INode } from '../document';
+import type { DragObject } from './dragon';
+import type { Sensor } from './sensor';
+export interface Point {
+    clientX: number;
+    clientY: number;
+}
+export interface CanvasPoint {
+    canvasX: number;
+    canvasY: number;
+}
+export type Rect = DOMRect & {
+    elements?: Array<Element | Text>;
+    computed?: boolean;
+};
+export type Rects = DOMRect[] & {
+    elements: Array<Element | Text>;
+};
+export declare enum LocationDetailType {
+    Children = "Children",
+    Prop = "Prop"
+}
+export interface LocationChildrenDetail {
+    type: LocationDetailType.Children;
+    index?: number | null;
+    /** is valid location */
+    valid?: boolean;
+    edge?: DOMRect;
+    near?: {
+        node: INode;
+        pos: 'before' | 'after' | 'replace';
+        rect?: Rect;
+        align?: 'V' | 'H';
+    };
+    focus?: {
+        type: 'node';
+        node: INode;
+    };
+}
+export interface LocationPropDetail {
+    type: LocationDetailType.Prop;
+    name: string;
+    domNode?: HTMLElement;
+}
+export type LocationDetail = LocationChildrenDetail | LocationPropDetail | {
+    [key: string]: any;
+    type: string;
+};
+export interface LocationData<Node = INode> {
+    target: Node;
+    detail: LocationDetail;
+    source: string;
+    event: LocateEvent;
+}
+export interface LocateEvent {
+    get type(): string;
+    /**
+     * browser window coordinate system
+     */
+    readonly globalX: number;
+    readonly globalY: number;
+    readonly originalEvent: MouseEvent | DragEvent;
+    /**
+     * browser event response target
+     */
+    target?: Element | null;
+    /**
+     * event correction identifier, initially constructed from the initiating end, missing canvasX,canvasY, needs to be corrected
+     */
+    fixed?: true;
+    canvasX?: number;
+    canvasY?: number;
+    /**
+     * active or target document
+     */
+    document?: Document | null;
+    get dragObject(): DragObject | null;
+    sensor?: Sensor;
+}
+export declare const isLocationData: (obj: any) => obj is LocationData;
+export declare const isLocationChildrenDetail: (obj: any) => obj is LocationChildrenDetail;
+export declare const isText: (elem: any) => elem is Text;
+export declare const isElement: (node: any) => node is Element;
+export declare const isDocumentElem: (elem: any) => elem is Document;
+export declare const getWindow: (elem: Element | Document) => Window;
+export declare class DropLocation {
+    readonly target: INode;
+    readonly detail: LocationDetail;
+    readonly event: LocateEvent;
+    readonly source: string;
+    get document(): IDocument | null;
+    constructor({ target, detail, source, event }: LocationData);
+    clone(event: LocateEvent): DropLocation;
+}

package/dist/designer/offset-observer.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentInstance, Node, Viewport } from '..';
+export interface NodeSelector {
+    node: Node;
+    instance?: ComponentInstance;
+}
+export declare class OffsetObserver {
+    readonly nodeInstance: NodeSelector;
+    readonly id: string;
+    private lastOffsetLeft?;
+    private lastOffsetTop?;
+    private lastOffsetHeight?;
+    private lastOffsetWidth?;
+    private accessor _height;
+    private accessor _width;
+    private accessor _left;
+    private accessor _top;
+    private accessor _right;
+    private accessor _bottom;
+    get height(): number;
+    get width(): number;
+    get top(): number;
+    get left(): number;
+    get bottom(): number;
+    get right(): number;
+    accessor hasOffset: boolean;
+    get offsetLeft(): number;
+    get offsetTop(): number;
+    get offsetHeight(): number;
+    get offsetWidth(): number;
+    get scale(): number;
+    private pid;
+    readonly viewport: Viewport;
+    private isRoot;
+    readonly node: Node;
+    readonly compute: () => void;
+    constructor(nodeInstance: NodeSelector);
+    computeRect(): DOMRect | undefined;
+    purge(): void;
+    isPurged(): boolean;
+}
+export declare function createOffsetObserver(nodeInstance: NodeSelector): OffsetObserver | null;