@netless/appliance-plugin 1.0.4 → 1.0.7

package/dist/plugin/baseApplianceManager.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="lodash" />
 import EventEmitter2 from "eventemitter2";
 import { MemberState, AppliancePluginLike, AppliancePluginOptions } from "./types";
 import { Collector } from "../collector";
 import { RoomMemberManager } from "../members";
 import { TextEditorManager } from "../component/textEditor";
-import type { Camera, Displayer, DisplayerCallbacks, Player, Rectangle, Room, RoomMember } from "./types";
+import type { Camera, Displayer, DisplayerCallbacks, Player, PriorityType, Rectangle, Room, RoomMember } from "./types";
 import { CursorManager } from "../cursors";
 import { ViewContainerManager } from "./baseViewContainerManager";
 import { MasterControlForWorker } from "../core/mainEngine";
@@ -27,6 +26,7 @@ export declare abstract class BaseApplianceManager {
     collector?: Collector;
     hasSwitchToSelectorEffect?: boolean;
     snapshootStateMap?: Map<string, unknown>;
+    priority: PriorityType;
     effectResolve?: (value: boolean) => void;
     readonly hotkeyManager: HotkeyManager;
     readonly pluginOptions: AppliancePluginOptions;
@@ -36,6 +36,7 @@ export declare abstract class BaseApplianceManager {
     readonly worker: MasterControlForWorker;
     abstract readonly viewContainerManager: ViewContainerManager;
     constructor(params: BaseApplianceManagerProps);
+    setPriority(priority: PriorityType): void;
     hasOffscreenCanvas(): boolean;
     bindPlugin(plugin: AppliancePluginLike): void;
     /** 激活 plugin */
@@ -57,13 +58,13 @@ export declare abstract class BaseApplianceManager {
     /** 监听房间教具变更 */
     onMemberChange: import("lodash").DebouncedFunc<(memberState: MemberState) => void>;
     /** 获取当前工具key */
-    protected getToolsKey(memberState: MemberState): EToolsKey.Pencil | EToolsKey.Eraser | EToolsKey.Selector | EToolsKey.Clicker | EToolsKey.Arrow | EToolsKey.LaserPen | EToolsKey.Text | EToolsKey.Straight | EToolsKey.Rectangle | EToolsKey.Ellipse | EToolsKey.Star | EToolsKey.Polygon | EToolsKey.SpeechBalloon;
+    protected getToolsKey(memberState: MemberState): EToolsKey.Pencil | EToolsKey.Eraser | EToolsKey.PencilEraser | EToolsKey.Selector | EToolsKey.Clicker | EToolsKey.Arrow | EToolsKey.LaserPen | EToolsKey.Text | EToolsKey.Straight | EToolsKey.Rectangle | EToolsKey.Ellipse | EToolsKey.Star | EToolsKey.Polygon | EToolsKey.SpeechBalloon;
     /** 获取当前工具默认配置 */
     protected getToolsOpt(toolsKey: EToolsKey, memberState: MemberState): {
         toolsType: EToolsKey.Clicker;
         toolsOpt: {};
     } | {
-        toolsType: EToolsKey.Pencil | EToolsKey.Eraser | EToolsKey.Selector | EToolsKey.Arrow | EToolsKey.Hand | EToolsKey.LaserPen | EToolsKey.Text | EToolsKey.Straight | EToolsKey.Rectangle | EToolsKey.Ellipse | EToolsKey.Star | EToolsKey.Triangle | EToolsKey.Rhombus | EToolsKey.Polygon | EToolsKey.SpeechBalloon | EToolsKey.Image;
+        toolsType: EToolsKey.Pencil | EToolsKey.Eraser | EToolsKey.PencilEraser | EToolsKey.Selector | EToolsKey.Arrow | EToolsKey.Hand | EToolsKey.LaserPen | EToolsKey.Text | EToolsKey.Straight | EToolsKey.Rectangle | EToolsKey.Ellipse | EToolsKey.Star | EToolsKey.Triangle | EToolsKey.Rhombus | EToolsKey.Polygon | EToolsKey.SpeechBalloon | EToolsKey.Image;
         toolsOpt: BaseShapeOptions;
     };
     /** 激活当前view容器*/

package/dist/plugin/baseViewContainerManager.d.ts

@@ -1,7 +1,5 @@
-/// <reference types="react" />
-/// <reference types="lodash" />
 import type EventEmitter2 from "eventemitter2";
-import { ICameraOpt, ILayerOptionType, IMainMessageRenderData, IOffscreenCanvasOptionType } from "../core/types";
+import { ICameraOpt, ILayerOptionType, IMainMessageRenderData, IOffscreenCanvasOptionType, ViewWorkerOptions } from "../core/types";
 import { BaseSubWorkModuleProps, ApplianceManagerLike } from "./types";
 import type { CameraState, View } from "./types";
 import { ShowFloatBarMsgValue } from "../displayer/types";
@@ -28,6 +26,7 @@ export declare abstract class ViewContainerManager {
     mainView?: ViewInfo;
     appViews: Map<string, ViewInfo>;
     constructor(props: BaseSubWorkModuleProps);
+    abstract getViewInitData(viewId: string): ViewWorkerOptions | undefined;
     undoTickerStart(id: number, viewId: string): void;
     addExcludeIds(ids: string[], viewId: string): void;
     undo(): number;
@@ -73,6 +72,7 @@ export declare abstract class AppViewDisplayerManager {
     abstract vDom?: BaseViewDisplayer;
     abstract eventTragetElement?: HTMLDivElement;
     abstract canvasContainerRef: React.RefObject<HTMLDivElement>;
+    abstract subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
     abstract canvasTopRef: React.RefObject<HTMLCanvasElement>;
     abstract canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
     abstract canvasFloatRef: React.RefObject<HTMLCanvasElement>;
@@ -129,6 +129,7 @@ export declare abstract class MainViewDisplayerManager {
     abstract eventTragetElement?: HTMLDivElement;
     abstract snapshotContainerRef?: React.RefObject<HTMLDivElement>;
     abstract canvasContainerRef: React.RefObject<HTMLDivElement>;
+    abstract subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
     abstract canvasTopRef: React.RefObject<HTMLCanvasElement>;
     abstract canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
     abstract canvasFloatRef: React.RefObject<HTMLCanvasElement>;

package/dist/plugin/const.d.ts

@@ -20,4 +20,7 @@ export declare const DefaultAppliancePluginOptions: {
         full: number;
         sub: number;
     };
+    bezier: {
+        combineUnitTime: number;
+    };
 };

package/dist/plugin/displayerView.d.ts

@@ -8,6 +8,7 @@ export interface BaseDisplayerProps {
     refs: {
         snapshotContainerRef?: React.RefObject<HTMLDivElement>;
         canvasContainerRef: React.RefObject<HTMLDivElement>;
+        subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
         canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
         canvasFloatRef: React.RefObject<HTMLCanvasElement>;
         canvasBgRef: React.RefObject<HTMLCanvasElement>;
@@ -26,7 +27,7 @@ export interface BaseDisplayerState {
     activeTextId?: string;
 }
 export declare const DisplayerContext: React.Context<Pick<BaseDisplayerState, "scale" | "dpr" | "angle" | "floatBarData" | "operationType"> & {
-    mananger?: ApplianceViewManagerLike | undefined;
+    mananger?: ApplianceViewManagerLike;
     floatBarColors: [number, number, number][];
     setAngle: (angle: number) => void;
     setOperationType: (type: EmitEventType) => void;

package/dist/plugin/multi/containerManager.d.ts

@@ -2,6 +2,7 @@ import { ViewContainerManager, ViewInfo } from "../baseViewContainerManager";
 import type { View } from "../types";
 import { BaseSubWorkModuleProps } from "../types";
 import { ApplianceMultiManager } from "./applianceMultiManager";
+import { ViewWorkerOptions } from "../../core/types";
 import type { WindowManager } from './applianceMultiManager';
 export declare class ViewContainerMultiManager extends ViewContainerManager {
     focuedViewId?: string;
@@ -11,6 +12,7 @@ export declare class ViewContainerMultiManager extends ViewContainerManager {
     tmpFocusedViewId?: string;
     private checkScaleTimer?;
     constructor(props: BaseSubWorkModuleProps);
+    getViewInitData(viewId: string): ViewWorkerOptions | undefined;
     mountView(viewId: string): Promise<void>;
     listenerWindowManager(windowManager: WindowManager): void;
     private onMainViewRelease;

package/dist/plugin/multi/displayer/appViewDisplayerManager.d.ts

@@ -10,6 +10,7 @@ export declare class AppViewDisplayerManagerImpl extends AppViewDisplayerManager
     vDom?: BaseViewDisplayer;
     eventTragetElement?: HTMLDivElement;
     canvasContainerRef: React.RefObject<HTMLDivElement>;
+    subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
     canvasTopRef: React.RefObject<HTMLCanvasElement>;
     canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
     canvasFloatRef: React.RefObject<HTMLCanvasElement>;

package/dist/plugin/multi/displayer/mainViewDisplayerManager.d.ts

@@ -11,6 +11,7 @@ export declare class MainViewMultiDisplayerManager extends MainViewDisplayerMana
     eventTragetElement?: HTMLDivElement;
     snapshotContainerRef?: React.RefObject<HTMLDivElement>;
     canvasContainerRef: React.RefObject<HTMLDivElement>;
+    subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
     canvasTopRef: React.RefObject<HTMLCanvasElement>;
     canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
     canvasFloatRef: React.RefObject<HTMLCanvasElement>;

package/dist/plugin/single/applianceSingleManager.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="lodash" />
 import { BaseApplianceManager, BaseApplianceManagerProps } from "../baseApplianceManager";
 import type { CameraState } from "../types";
 import { ViewContainerSingleManager } from "./containerManager";

package/dist/plugin/single/containerManager.d.ts

@@ -1,3 +1,4 @@
+import { ViewWorkerOptions } from "../../core/types";
 import { ViewContainerManager, ViewInfo } from "../baseViewContainerManager";
 import { ApplianceSingleManager } from "./applianceSingleManager";
 import { BaseSubWorkModuleProps } from "../types";
@@ -7,5 +8,6 @@ export declare class ViewContainerSingleManager extends ViewContainerManager {
     focuedView?: ViewInfo;
     constructor(props: BaseSubWorkModuleProps);
     bindMainView(): void;
+    getViewInitData(viewId: string): ViewWorkerOptions | undefined;
     mountView(viewId: string): Promise<void>;
 }

package/dist/plugin/single/displayer/mainViewDisplayerManager.d.ts

@@ -12,6 +12,7 @@ export declare class MainViewSingleDisplayerManager extends MainViewDisplayerMan
     eventTragetElement?: HTMLDivElement;
     snapshotContainerRef?: React.RefObject<HTMLDivElement>;
     canvasContainerRef: React.RefObject<HTMLDivElement>;
+    subLocalCanvasContainerRef: React.RefObject<HTMLDivElement>;
     canvasTopRef: React.RefObject<HTMLCanvasElement>;
     canvasServiceFloatRef: React.RefObject<HTMLCanvasElement>;
     canvasFloatRef: React.RefObject<HTMLCanvasElement>;

package/dist/plugin/types.d.ts

@@ -185,6 +185,16 @@ export interface AppliancePluginInstance {
     destroy(): void;
     /** setMemberState */
     setMemberState(modifyState: Partial<MemberState>): void;
+    /** 设置性能优先项
+     * @param priority 优先项, 可以是 ``ui`` 或 ``cpu``
+     * ui: 优先绘制UI，适用于需要绘制高跟手度
+     * cpu: 优先降低主进程CPU消耗，适用于底端设备
+     */
+    setPerformancePriority(priority: PriorityType): void;
+    /** 获取undo */
+    canUndoSteps(): number;
+    /** 获取redo */
+    canRedoSteps(): number;
     /** 事件监听器 */
     callbacks: Callbacks<any>;
 }
@@ -319,3 +329,4 @@ export declare enum ActiveContainerType {
 }
 export type SpeechBalloonPlacement = 'top' | 'left' | 'right' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
 export type TeleBoxState = "normal" | "minimized" | "maximized";
+export type PriorityType = 'ui' | 'cpu';

package/dist/style.css

@@ -1 +1 @@
-.appliance-plugin-main-view-displayer,.appliance-plugin-app-view-displayer{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:2}.appliance-plugin-floatbtns{position:absolute;left:3px;transform:translateY(-60px);display:flex;flex-direction:row;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f;border-radius:4px;color-scheme:light;pointer-events:auto;z-index:9}.appliance-plugin-floatbtns .normal-button{width:40px;height:40px;touch-action:none}.appliance-plugin-floatbtns .button{display:flex;justify-content:center;align-items:center;cursor:pointer;border:none}.appliance-plugin-floatbtns .button:hover,.appliance-plugin-floatbtns .button.active{background-color:#eef0f6}.appliance-plugin-floatbtns .shapeOpt-sub-menu,.appliance-plugin-floatbtns .font-style-menu,.appliance-plugin-floatbtns .image-layer-menu,.appliance-plugin-floatbtns .font-colors-menu{box-sizing:border-box;display:flex;flex-wrap:wrap;flex-direction:row;justify-content:flex-start;align-items:center;position:absolute;padding:4px;background:#fff;box-shadow:0 3px 6px #0000001f;border-radius:2px;top:50px;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .normal-button,.appliance-plugin-floatbtns .font-style-menu .normal-button,.appliance-plugin-floatbtns .image-layer-menu .normal-button,.appliance-plugin-floatbtns .font-colors-menu .normal-button{width:32px;height:32px;touch-action:none}.appliance-plugin-floatbtns .font-colors-menu{justify-content:space-between;width:128px}.appliance-plugin-floatbtns .font-colors-menu .font-color-button{display:flex;justify-content:center;align-items:center;cursor:pointer;margin:4px;width:20px;height:20px;border-radius:50%;border-width:1px;border-style:solid;border-color:#fff;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px;box-sizing:border-box}.appliance-plugin-floatbtns .font-colors-menu .font-color-button.active{border-color:#a7a7a7}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .circle{box-sizing:border-box;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.12);touch-action:none}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .none{position:relative;background-color:#fff}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .none:before{content:"";position:absolute;left:50%;width:1px;height:100%;background-color:#0000001f;transform:rotate(45deg)}.appliance-plugin-floatbtns .font-colors-icon{flex-direction:column}.appliance-plugin-floatbtns .font-colors-icon .color-bar{height:2px;width:12px;margin-top:-2px;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px}.appliance-plugin-floatbtns .font-colors-icon .color-bar .color-bar-color{width:100%;height:100%}.appliance-plugin-floatbtns .font-colors-icon .color-bar-fill,.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring{height:12px;width:12px;border-radius:6px;border:1px solid rgba(0,0,0,.12);background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px}.appliance-plugin-floatbtns .font-colors-icon .color-bar-fill .circle,.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring .circle{width:100%;height:100%;border-radius:50%;touch-action:none}.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring{border:0}.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring .circle{transform:translate(35%,30%);width:60%;height:60%;border-radius:50%;background-color:#fff;touch-action:none}.appliance-plugin-floatbtns .font-color-opacity{box-sizing:border-box;width:100px;height:6px;margin:5px 0 10px;border-radius:3px;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px;position:relative}.appliance-plugin-floatbtns .font-color-opacity .range-color{height:6px;box-shadow:inset 0 0 1px #00000040;border-radius:4px;top:0;right:0;bottom:0;left:0}.appliance-plugin-floatbtns .font-color-opacity .range-opacity{position:absolute;top:0;left:-10px;height:6px;width:120px;touch-action:auto}.appliance-plugin-floatbtns .font-color-opacity .range-opacity .range-opacity-data-icon{position:absolute;top:10px;left:0;width:30px;height:16px;text-align:center;background-color:#333;border-radius:4px;font-size:12px;color:#fff;display:none}.appliance-plugin-floatbtns .font-color-opacity .range-opacity:hover .range-opacity-data-icon{display:block}.appliance-plugin-floatbtns .font-color-opacity .circle{position:absolute;top:-3px;border:2px solid #ffffff;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 1px #00000040,0 0 0 1px #0000000f;width:12px;height:12px;box-sizing:border-box;touch-action:none}.appliance-plugin-floatbtns .font-style-menu{justify-content:space-between;width:128px}.appliance-plugin-floatbtns .font-style-menu .font-style-button{display:flex;justify-content:center;align-items:center;cursor:pointer;margin:4px;width:20px;height:20px;box-sizing:border-box}.appliance-plugin-floatbtns .font-style-menu .font-style-button.active{border-color:#a7a7a7}.appliance-plugin-floatbtns .font-size-barBtn .font-size-input{line-height:20px;height:20px;padding:0 2px;margin-left:2px;width:25px;border:1px solid;border-radius:3px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-input:focus{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns{width:15px;margin-left:3px;display:flex;flex-direction:column;justify-content:center}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut{position:relative;width:10px;height:10px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:hover,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:after,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:after{content:"";position:absolute;top:0;border:4px solid #999;border-left-color:transparent;border-right-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add{margin-bottom:3px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:after{border-top-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:after{border-bottom-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu{position:absolute;top:35px;width:50px;overflow-y:auto;display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu .font-size-btn{font-size:12px;line-height:20px;width:100%;text-align:center}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu .font-size-btn:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn:hover{background:#fff}.appliance-plugin-floatbtns .shapeOpt-sub-menu{flex-direction:column;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-tabs{display:flex;flex-direction:row;justify-content:flex-start;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-tabs .tab-button{width:32px;height:24px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content{flex:1;background-color:#eef0f6;display:flex;flex-direction:column;align-items:baseline;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button{flex:1;height:32px;padding:5px 0;cursor:default;display:flex;flex-direction:row;justify-content:flex-start;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button img{width:16px;height:16px;margin:0 5px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number{flex:1;padding:0 3px;height:20px;border:1px solid;border-radius:3px;margin-right:5px;max-width:70px;min-width:40px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns{width:15px;display:flex;flex-direction:column;justify-content:center}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut{position:relative;width:10px;height:10px;cursor:pointer}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:hover,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:hover{background:#eef0f6}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:after,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:after{content:"";position:absolute;top:0;border:4px solid #999;border-left-color:transparent;border-right-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add{margin-bottom:3px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:after{border-top-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:after{border-bottom-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container{flex:1;box-sizing:border-box;width:100px;height:6px;margin:7px 6px 7px 0;border-radius:3px;background-color:#3381ff;position:relative}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .range-number-color{height:6px;box-shadow:inset 0 0 1px #00000040;border-radius:4px;top:0;right:0;bottom:0;left:0}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .range-number{position:absolute;top:0;left:-6px;height:6px;width:112px;cursor:pointer}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .circle{position:absolute;top:-3px;border:2px solid #ffffff;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 1px #00000040,0 0 0 1px #0000000f;width:12px;height:12px;box-sizing:border-box;background-color:#3381ff;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu{position:absolute;top:60px;left:30px;width:80px;display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu .select-option-btn{font-size:12px;line-height:20px;width:100%;text-align:center}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu .select-option-btn:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-colors-line{width:100%;height:0px;border-bottom:1px dashed #ccc;margin-bottom:3px}.appliance-plugin-floatbtns .stroke-type-box{width:100%;height:15px;display:flex;flex-direction:row;justify-content:space-around;padding-top:8px;cursor:default}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item{box-sizing:content-box;padding-top:2px;width:20px;height:3px;border:0;cursor:pointer;opacity:.3}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.active{opacity:1}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Stroke{margin-top:2px;padding:0;height:3px;border-radius:0 10px}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Normal{height:0;border-bottom:3px solid}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Dotted{height:0;border-bottom:3px dotted}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.LongDotted{height:0;border-bottom:3px dashed}.appliance-plugin-fill-scene-snapshot-img{position:absolute;top:50%;left:50%;max-width:100%;max-height:100%;transform:translate(-50%,-50%);pointer-events:none}.index-module__Container__nLsM3{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;outline:none;pointer-events:none;touch-action:none}.index-module__Container__nLsM3 *{touch-action:none}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe-{position:relative;width:100%;height:100%;pointer-events:none}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe- .index-module__FloatCanvas__d1YR7{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe- .index-module__TopFloatCanvas__7IaCw{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2}.index-module__Container__nLsM3 .index-module__SnapshotBox__--eeE{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL{position:absolute;top:0;left:0;width:0;height:0;pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box{position:relative;box-sizing:border-box;width:100%;height:100%;border:1px solid;z-index:1;pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .point{position:absolute;width:7px;height:7px;transform:translate(-50%,-50%);pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .point-dot{margin:-1px 0 0 -1px;width:5px;height:5px;border:1px solid;border-radius:3px;background-color:#fff}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LB{left:0}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .TC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RT{top:0}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RB{right:-7px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RB,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .BC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LB{bottom:-7px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LC{top:50%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .TC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .BC{left:50%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .lock{pointer-events:none;position:absolute;width:22px;height:22px;top:-11px;left:-11px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-floatCanvas-box{position:absolute;z-index:1;overflow:hidden}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-floatCanvas{width:100%;height:100%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor-box{position:absolute;touch-action:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor{position:relative;padding:5px;pointer-events:auto;font-family:sans-serif;resize:none;z-index:2;border:1px dashed;white-space:pre;display:flex;flex-direction:column;align-items:baseline}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:hover{border-style:solid}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:focus,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:focus-visible{outline:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .readOnly{border-color:transparent}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf{position:absolute;cursor:move;top:0;left:0;width:16px;height:16px;z-index:2;pointer-events:auto}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-btn{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:8px;display:flex;justify-content:center;align-items:center}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-btn img{width:12px;height:12px}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer{position:relative;width:100%;height:100%;opacity:0}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer.active{opacity:1}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer img{width:100%;height:100%}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer .angle-icon{position:absolute;top:-16px;left:-16px;width:30px;height:16px;text-align:center;background-color:#333;border-radius:4px;font-size:12px;color:#fff}.index-module__Container__nLsM3 .index-module__ResizeBtn__yjvda{position:absolute;box-sizing:content-box;top:0;width:0;left:0;z-index:1;touch-action:none}.index-module__Container__nLsM3 .index-module__CursorBox__2UHvI{position:absolute;left:0;top:0;z-index:2}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:hidden;transform:translateZ(0)}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor-box{position:absolute;touch-action:none}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor{position:relative;padding:5px;pointer-events:auto;font-family:sans-serif;resize:none;z-index:2;border:1px dashed;white-space:nowrap;display:flex;flex-direction:column;align-items:baseline}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:hover{border-style:solid}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:focus,.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:focus-visible{outline:none}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .readOnly{pointer-events:none;border-color:transparent}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX{position:absolute;top:0;width:0;left:0}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX .appliance-plugin-point-btn{position:absolute;width:5px;height:5px;border:1px solid;border-radius:3px;transform:translate(-50%,-50%);background-color:#fff;z-index:2}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX .appliance-plugin-point-draggable-btn{position:absolute;width:10px;height:10px;margin-top:-5px;margin-left:-5px;z-index:3;pointer-events:auto;cursor:move;touch-action:none}.index-module__Container__nLsM3 .index-module__FloatBarBtn__FJrOG{position:absolute;pointer-events:none}.cursor-box{color:#fff;padding:4px;border-radius:2px;width:100%;height:100%}.cursor-pencil-image{width:26px;height:26px}.cursor-selector-image{width:24px;height:24px}.cursor-selector-avatar{border-radius:50%;border-style:solid;border-width:2px;border-color:#fff;margin-bottom:2px}.cursor-inner{border-radius:4px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:4px;padding-right:4px;font-size:12px}.cursor-inner-mellow{height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:16px;padding-right:16px}.cursor-tag-name{font-size:12px;margin-left:4px;padding:2px 8px;border-radius:4px}.cursor-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px}.cursor-pencil-offset{margin-left:-20px}.cursor-selector-offset{margin-left:-22px;margin-top:56px}.cursor-text-offset{margin-left:-30px;margin-top:18px}.cursor-shape-offset{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px;margin-left:-30px;margin-top:12px}.cursor-name{width:100%;height:48px;display:flex;align-items:center;justify-content:center}
+.appliance-plugin-main-view-displayer,.appliance-plugin-app-view-displayer{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:2}.appliance-plugin-floatbtns{position:absolute;left:3px;transform:translateY(-60px);display:flex;flex-direction:row;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f;border-radius:4px;color-scheme:light;pointer-events:auto;z-index:9}.appliance-plugin-floatbtns .normal-button{width:40px;height:40px;touch-action:none}.appliance-plugin-floatbtns .button{display:flex;justify-content:center;align-items:center;cursor:pointer;border:none}.appliance-plugin-floatbtns .button:hover,.appliance-plugin-floatbtns .button.active{background-color:#eef0f6}.appliance-plugin-floatbtns .shapeOpt-sub-menu,.appliance-plugin-floatbtns .font-style-menu,.appliance-plugin-floatbtns .image-layer-menu,.appliance-plugin-floatbtns .font-colors-menu{box-sizing:border-box;display:flex;flex-wrap:wrap;flex-direction:row;justify-content:flex-start;align-items:center;position:absolute;padding:4px;background:#fff;box-shadow:0 3px 6px #0000001f;border-radius:2px;top:50px;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .normal-button,.appliance-plugin-floatbtns .font-style-menu .normal-button,.appliance-plugin-floatbtns .image-layer-menu .normal-button,.appliance-plugin-floatbtns .font-colors-menu .normal-button{width:32px;height:32px;touch-action:none}.appliance-plugin-floatbtns .font-colors-menu{justify-content:space-between;width:128px}.appliance-plugin-floatbtns .font-colors-menu .font-color-button{display:flex;justify-content:center;align-items:center;cursor:pointer;margin:4px;width:20px;height:20px;border-radius:50%;border-width:1px;border-style:solid;border-color:#fff;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px;box-sizing:border-box}.appliance-plugin-floatbtns .font-colors-menu .font-color-button.active{border-color:#a7a7a7}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .circle{box-sizing:border-box;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.12);touch-action:none}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .none{position:relative;background-color:#fff}.appliance-plugin-floatbtns .font-colors-menu .font-color-button .none:before{content:"";position:absolute;left:50%;width:1px;height:100%;background-color:#0000001f;transform:rotate(45deg)}.appliance-plugin-floatbtns .font-colors-icon{flex-direction:column}.appliance-plugin-floatbtns .font-colors-icon .color-bar{height:2px;width:12px;margin-top:-2px;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px}.appliance-plugin-floatbtns .font-colors-icon .color-bar .color-bar-color{width:100%;height:100%}.appliance-plugin-floatbtns .font-colors-icon .color-bar-fill,.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring{height:12px;width:12px;border-radius:6px;border:1px solid rgba(0,0,0,.12);background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px}.appliance-plugin-floatbtns .font-colors-icon .color-bar-fill .circle,.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring .circle{width:100%;height:100%;border-radius:50%;touch-action:none}.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring{border:0}.appliance-plugin-floatbtns .font-colors-icon .color-bar-ring .circle{transform:translate(35%,30%);width:60%;height:60%;border-radius:50%;background-color:#fff;touch-action:none}.appliance-plugin-floatbtns .font-color-opacity{box-sizing:border-box;width:100px;height:6px;margin:5px 0 10px;border-radius:3px;background-image:conic-gradient(rgba(0,0,0,.06) 0 25%,transparent 0 50%,rgba(0,0,0,.06) 0 75%,transparent 0);background-size:6px 6px;position:relative}.appliance-plugin-floatbtns .font-color-opacity .range-color{height:6px;box-shadow:inset 0 0 1px #00000040;border-radius:4px;top:0;right:0;bottom:0;left:0}.appliance-plugin-floatbtns .font-color-opacity .range-opacity{position:absolute;top:0;left:-10px;height:6px;width:120px;touch-action:auto}.appliance-plugin-floatbtns .font-color-opacity .range-opacity .range-opacity-data-icon{position:absolute;top:10px;left:0;width:30px;height:16px;text-align:center;background-color:#333;border-radius:4px;font-size:12px;color:#fff;display:none}.appliance-plugin-floatbtns .font-color-opacity .range-opacity:hover .range-opacity-data-icon{display:block}.appliance-plugin-floatbtns .font-color-opacity .circle{position:absolute;top:-3px;border:2px solid #ffffff;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 1px #00000040,0 0 0 1px #0000000f;width:12px;height:12px;box-sizing:border-box;touch-action:none}.appliance-plugin-floatbtns .font-style-menu{justify-content:space-between;width:128px}.appliance-plugin-floatbtns .font-style-menu .font-style-button{display:flex;justify-content:center;align-items:center;cursor:pointer;margin:4px;width:20px;height:20px;box-sizing:border-box}.appliance-plugin-floatbtns .font-style-menu .font-style-button.active{border-color:#a7a7a7}.appliance-plugin-floatbtns .font-size-barBtn .font-size-input{line-height:20px;height:20px;padding:0 2px;margin-left:2px;width:25px;border:1px solid;border-radius:3px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-input:focus{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns{width:15px;margin-left:3px;display:flex;flex-direction:column;justify-content:center}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut{position:relative;width:10px;height:10px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:hover,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:after,.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:after{content:"";position:absolute;top:0;border:4px solid #999;border-left-color:transparent;border-right-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add{margin-bottom:3px}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-add:after{border-top-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-btns .font-size-cut:after{border-bottom-color:transparent}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu{position:absolute;top:35px;width:50px;overflow-y:auto;display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu .font-size-btn{font-size:12px;line-height:20px;width:100%;text-align:center}.appliance-plugin-floatbtns .font-size-barBtn .font-size-menu .font-size-btn:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-size-barBtn:hover{background:#fff}.appliance-plugin-floatbtns .shapeOpt-sub-menu{flex-direction:column;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-tabs{display:flex;flex-direction:row;justify-content:flex-start;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-tabs .tab-button{width:32px;height:24px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content{flex:1;background-color:#eef0f6;display:flex;flex-direction:column;align-items:baseline;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button{flex:1;height:32px;padding:5px 0;cursor:default;display:flex;flex-direction:row;justify-content:flex-start;width:100%}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button img{width:16px;height:16px;margin:0 5px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number{flex:1;padding:0 3px;height:20px;border:1px solid;border-radius:3px;margin-right:5px;max-width:70px;min-width:40px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns{width:15px;display:flex;flex-direction:column;justify-content:center}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut{position:relative;width:10px;height:10px;cursor:pointer}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:hover,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:hover{background:#eef0f6}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:after,.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:after{content:"";position:absolute;top:0;border:4px solid #999;border-left-color:transparent;border-right-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add{margin-bottom:3px}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-add:after{border-top-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .input-number-btns .input-number-cut:after{border-bottom-color:transparent}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container{flex:1;box-sizing:border-box;width:100px;height:6px;margin:7px 6px 7px 0;border-radius:3px;background-color:#3381ff;position:relative}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .range-number-color{height:6px;box-shadow:inset 0 0 1px #00000040;border-radius:4px;top:0;right:0;bottom:0;left:0}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .range-number{position:absolute;top:0;left:-6px;height:6px;width:112px;cursor:pointer}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .range-number-container .circle{position:absolute;top:-3px;border:2px solid #ffffff;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 1px #00000040,0 0 0 1px #0000000f;width:12px;height:12px;box-sizing:border-box;background-color:#3381ff;touch-action:none}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu{position:absolute;top:60px;left:30px;width:80px;display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid #EFEFEF;box-shadow:0 6px 12px #0000001f}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu .select-option-btn{font-size:12px;line-height:20px;width:100%;text-align:center}.appliance-plugin-floatbtns .shapeOpt-sub-menu .shapeOpt-sub-menu-content .input-button .select-option-menu .select-option-btn:hover{background:#eef0f6}.appliance-plugin-floatbtns .font-colors-line{width:100%;height:0px;border-bottom:1px dashed #ccc;margin-bottom:3px}.appliance-plugin-floatbtns .stroke-type-box{width:100%;height:15px;display:flex;flex-direction:row;justify-content:space-around;padding-top:8px;cursor:default}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item{box-sizing:content-box;padding-top:2px;width:20px;height:3px;border:0;cursor:pointer;opacity:.3}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.active{opacity:1}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Stroke{margin-top:2px;padding:0;height:3px;border-radius:0 10px}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Normal{height:0;border-bottom:3px solid}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.Dotted{height:0;border-bottom:3px dotted}.appliance-plugin-floatbtns .stroke-type-box .stroke-type-box-item.LongDotted{height:0;border-bottom:3px dashed}.appliance-plugin-fill-scene-snapshot-img{position:absolute;top:50%;left:50%;max-width:100%;max-height:100%;transform:translate(-50%,-50%);pointer-events:none}.index-module__Container__nLsM3{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;outline:none;pointer-events:none;touch-action:none}.index-module__Container__nLsM3 *{touch-action:none}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe-{position:relative;width:100%;height:100%;pointer-events:none}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe- .index-module__FloatCanvas__d1YR7{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.index-module__Container__nLsM3 .index-module__CanvasBox__j2Xe- .index-module__TopFloatCanvas__7IaCw{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2}.index-module__Container__nLsM3 .index-module__CanvasBoxSub__hcMeK{position:absolute!important;top:0;left:0;width:100%;height:100%;z-index:1}.index-module__Container__nLsM3 .index-module__SnapshotBox__--eeE{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL{position:absolute;top:0;left:0;width:0;height:0;pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box{position:relative;box-sizing:border-box;width:100%;height:100%;border:1px solid;z-index:1;pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .point{position:absolute;width:7px;height:7px;transform:translate(-50%,-50%);pointer-events:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .point-dot{margin:-1px 0 0 -1px;width:5px;height:5px;border:1px solid;border-radius:3px;background-color:#fff}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LB{left:0}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .TC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RT{top:0}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RT,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RB{right:-7px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RB,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .BC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LB{bottom:-7px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .RC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .LC{top:50%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .TC,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .BC{left:50%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-hightlight-box .lock{pointer-events:none;position:absolute;width:22px;height:22px;top:-11px;left:-11px}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-floatCanvas-box{position:absolute;z-index:1;overflow:hidden}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .appliance-plugin-floatCanvas{width:100%;height:100%}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor-box{position:absolute;touch-action:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor{position:relative;padding:5px;pointer-events:auto;font-family:sans-serif;resize:none;z-index:2;border:1px dashed;white-space:pre;display:flex;flex-direction:column;align-items:baseline}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:hover{border-style:solid}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:focus,.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .editor:focus-visible{outline:none}.index-module__Container__nLsM3 .index-module__FloatBar__cm-EL .readOnly{border-color:transparent}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf{position:absolute;cursor:move;top:0;left:0;width:16px;height:16px;z-index:2;pointer-events:auto}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-btn{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:8px;display:flex;justify-content:center;align-items:center}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-btn img{width:12px;height:12px}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer{position:relative;width:100%;height:100%;opacity:0}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer.active{opacity:1}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer img{width:100%;height:100%}.index-module__Container__nLsM3 .index-module__RotateBtn__HSSkf .appliance-plugin-rotate-mouse-pointer .angle-icon{position:absolute;top:-16px;left:-16px;width:30px;height:16px;text-align:center;background-color:#333;border-radius:4px;font-size:12px;color:#fff}.index-module__Container__nLsM3 .index-module__ResizeBtn__yjvda{position:absolute;box-sizing:content-box;top:0;width:0;left:0;z-index:1;touch-action:none}.index-module__Container__nLsM3 .index-module__CursorBox__2UHvI{position:absolute;left:0;top:0;z-index:2}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:hidden;transform:translateZ(0)}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor-box{position:absolute;touch-action:none}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor{position:relative;padding:5px;pointer-events:auto;font-family:sans-serif;resize:none;z-index:2;border:1px dashed;white-space:nowrap;display:flex;flex-direction:column;align-items:baseline}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:hover{border-style:solid}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:focus,.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .editor:focus-visible{outline:none}.index-module__Container__nLsM3 .index-module__TextEditorContainer__Qm8KC .readOnly{pointer-events:none;border-color:transparent}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX{position:absolute;top:0;width:0;left:0}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX .appliance-plugin-point-btn{position:absolute;width:5px;height:5px;border:1px solid;border-radius:3px;transform:translate(-50%,-50%);background-color:#fff;z-index:2}.index-module__Container__nLsM3 .index-module__ResizeTowBox__HOllX .appliance-plugin-point-draggable-btn{position:absolute;width:10px;height:10px;margin-top:-5px;margin-left:-5px;z-index:3;pointer-events:auto;cursor:move;touch-action:none}.index-module__Container__nLsM3 .index-module__FloatBarBtn__FJrOG{position:absolute;pointer-events:none}.cursor-box{color:#fff;padding:4px;border-radius:2px;width:100%;height:100%}.cursor-pencil-image{width:26px;height:26px}.cursor-selector-image{width:24px;height:24px}.cursor-selector-avatar{border-radius:50%;border-style:solid;border-width:2px;border-color:#fff;margin-bottom:2px}.cursor-inner{border-radius:4px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:4px;padding-right:4px;font-size:12px}.cursor-inner-mellow{height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:16px;padding-right:16px}.cursor-tag-name{font-size:12px;margin-left:4px;padding:2px 8px;border-radius:4px}.cursor-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px}.cursor-pencil-offset{margin-left:-20px}.cursor-selector-offset{margin-left:-22px;margin-top:56px}.cursor-text-offset{margin-left:-30px;margin-top:18px}.cursor-shape-offset{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px;margin-left:-30px;margin-top:12px}.cursor-name{width:100%;height:48px;display:flex;align-items:center;justify-content:center}