@univerjs/engine-render 0.4.0-alpha.0 → 0.4.0-alpha.2

package/lib/es/index.js

@@ -4286,6 +4286,9 @@ const _Canvas = class _Canvas {
   getHeight() {
     return this._height;
   }
+  setId(id) {
+    this._canvasEle.id = id;
+  }
   setSize(width, height, pixelRatioParam) {
     var _a10;
     this._pixelRatio = pixelRatioParam || getDevicePixelRatio();
@@ -26232,7 +26235,7 @@ const UNIQUE_KEY$2 = "DefaultDocsBorderExtension", _Border = class _Border exten
 __name(_Border, "Border");
 let Border = _Border;
 DocumentsSpanAndLineExtensionRegistry.add(new Border());
-const SHAPE_OBJECT_ARRAY = [
+const BASE_OBJECT_ARRAY_Set = new Set(BASE_OBJECT_ARRAY), SHAPE_OBJECT_ARRAY = [
   "hoverCursor",
   "moveCursor",
   "fillRule",
@@ -26410,7 +26413,7 @@ const SHAPE_OBJECT_ARRAY = [
     return themeKeys.length === 0 ? this : (themeKeys.forEach((key) => {
       if (props[key] === void 0)
         return !0;
-      BASE_OBJECT_ARRAY.indexOf(key) === -1 && (this[`_${key}`] = props[key]);
+      BASE_OBJECT_ARRAY_Set.has(key) || (this[`_${key}`] = props[key]);
     }), this.makeDirty(!0), this);
   }
   toJson() {
@@ -26432,10 +26435,15 @@ const SHAPE_OBJECT_ARRAY = [
       return;
     const transformState = {};
     let hasTransformState = !1;
+    const hasRotateEnabled = (props == null ? void 0 : props.rotateEnabled) !== void 0, hasResizeEnabled = (props == null ? void 0 : props.resizeEnabled) !== void 0;
+    if (hasRotateEnabled || hasResizeEnabled) {
+      const transformerConfig = this.transformerConfig || {};
+      hasRotateEnabled && (transformerConfig.rotateEnabled = props == null ? void 0 : props.rotateEnabled), hasResizeEnabled && (transformerConfig.resizeEnabled = props == null ? void 0 : props.resizeEnabled), this.transformerConfig = { ...transformerConfig };
+    }
     themeKeys.forEach((key) => {
       if (props[key] === void 0)
         return !0;
-      BASE_OBJECT_ARRAY.indexOf(key) > -1 ? (transformState[key] = props[key], hasTransformState = !0) : this[`_${key}`] = props[key];
+      BASE_OBJECT_ARRAY_Set.has(key) ? (transformState[key] = props[key], hasTransformState = !0) : this[`_${key}`] = props[key];
     }), hasTransformState && this.transformByState(transformState), this.makeDirty(!0);
   }
 };
@@ -27907,9 +27915,10 @@ const UNIQUE_KEY$1 = "DefaultDocsFontAndBaseLineExtension", DOC_EXTENSION_Z_INDE
     else {
       const CHECKED_GLYPH = "☑";
       if ((content === "☐" || content === CHECKED_GLYPH) && glyph.glyphType === GlyphType.LIST) {
-        ctx.save();
         const size = Math.ceil(((_b = (_a10 = glyph.ts) == null ? void 0 : _a10.fs) != null ? _b : 12) * 1.2);
-        ctx.translate(spanPointWithFont.x, spanPointWithFont.y - size), Checkbox.drawWith(ctx, {
+        ctx.save();
+        const fontWidth = glyph.bBox.width, fontHeight = glyph.bBox.aba - glyph.bBox.abd, bottom = spanPointWithFont.y, top = bottom - fontHeight, left = spanPointWithFont.x, right = left + fontWidth, topOffset = top + (bottom - top - size) / 2, leftOffset = left + (right - left - size) / 2, BORDER_WIDTH = 1;
+        ctx.translate(leftOffset - BORDER_WIDTH / 2, topOffset - BORDER_WIDTH / 2), Checkbox.drawWith(ctx, {
           width: size,
           height: size,
           checked: content === CHECKED_GLYPH
@@ -29428,6 +29437,7 @@ const _ThinEngine = class _ThinEngine extends Disposable {
 __name(_ThinEngine, "ThinEngine");
 let ThinEngine = _ThinEngine;
 const _Engine = class _Engine extends ThinEngine {
+  // unitId
   constructor(elemWidth = 1, elemHeight = 1, pixelRatio, mode) {
     super();
     __publicField(this, "renderEvenInBackground", !0);
@@ -29479,6 +29489,7 @@ const _Engine = class _Engine extends ThinEngine {
     __publicField(this, "_isUsingFirefox", navigator.userAgent.indexOf("Firefox") !== -1);
     __publicField(this, "_previousWidth", -1e3);
     __publicField(this, "_previousHeight", -1e3);
+    __publicField(this, "_unitId", "");
     this._canvas = new Canvas({
       mode,
       width: elemWidth,
@@ -31322,7 +31333,7 @@ const TransformerManagerTypeArray = [
     }), this._transformerControlMap.clear();
   }
   _createControl(applyObject, isSkipOnCropper = !0) {
-    const { left = 0, top = 0, height = 0, width = 0 } = applyObject.getState(), angle = applyObject.angle, { isCropper, resizeEnabled, rotateAnchorOffset, rotateSize, rotateCornerRadius, borderEnabled, borderStroke, borderStrokeWidth, borderSpacing, enabledAnchors } = this._getConfig(applyObject);
+    const { left = 0, top = 0, height = 0, width = 0 } = applyObject.getState(), angle = applyObject.angle, { isCropper, resizeEnabled, rotateEnabled, rotateAnchorOffset, rotateSize, rotateCornerRadius, borderEnabled, borderStroke, borderStrokeWidth, borderSpacing, enabledAnchors } = this._getConfig(applyObject);
     if (isSkipOnCropper && isCropper)
       return;
     const oKey = applyObject.oKey, zIndex = this._selectedObjectMap.size + applyObject.maxZIndex + DEFAULT_CONTROL_PLUS_INDEX, layerIndex = applyObject.getLayerIndex() || DEFAULT_TRANSFORMER_LAYER_INDEX, groupElements = [];
@@ -31342,29 +31353,32 @@ const TransformerManagerTypeArray = [
         height,
         width,
         applyObject
-      ), rotateLine = new Rect(`__SpreadsheetTransformerRotateLine___${zIndex}`, {
-        zIndex: zIndex - 1,
-        evented: !1,
-        left: lineLeft,
-        top: lineTop,
-        height: rotateAnchorOffset,
-        width: 1,
-        strokeWidth: borderStrokeWidth,
-        stroke: borderStroke
-      }), { left: left2, top: top2 } = this._getRotateAnchorPosition("__SpreadsheetTransformerRotate__", height, width, applyObject), cursor = this._getRotateAnchorCursor(
-        "__SpreadsheetTransformerRotate__"
-        /* ROTATE */
-      ), rotate = new Rect(`__SpreadsheetTransformerRotate___${zIndex}`, {
-        zIndex: zIndex - 1,
-        left: left2,
-        top: top2,
-        height: rotateSize,
-        width: rotateSize,
-        radius: rotateCornerRadius,
-        strokeWidth: borderStrokeWidth * 2,
-        stroke: borderStroke
-      });
-      this._attachEventToRotate(rotate, applyObject), this._attachHover(rotate, cursor, CURSOR_TYPE.DEFAULT), groupElements.push(rotateLine, rotate);
+      );
+      if (rotateEnabled) {
+        const rotateLine = new Rect(`__SpreadsheetTransformerRotateLine___${zIndex}`, {
+          zIndex: zIndex - 1,
+          evented: !1,
+          left: lineLeft,
+          top: lineTop,
+          height: rotateAnchorOffset,
+          width: 1,
+          strokeWidth: borderStrokeWidth,
+          stroke: borderStroke
+        }), { left: left2, top: top2 } = this._getRotateAnchorPosition("__SpreadsheetTransformerRotate__", height, width, applyObject), cursor = this._getRotateAnchorCursor(
+          "__SpreadsheetTransformerRotate__"
+          /* ROTATE */
+        ), rotate = new Rect(`__SpreadsheetTransformerRotate___${zIndex}`, {
+          zIndex: zIndex - 1,
+          left: left2,
+          top: top2,
+          height: rotateSize,
+          width: rotateSize,
+          radius: rotateCornerRadius,
+          strokeWidth: borderStrokeWidth * 2,
+          stroke: borderStroke
+        });
+        this._attachEventToRotate(rotate, applyObject), this._attachHover(rotate, cursor, CURSOR_TYPE.DEFAULT), groupElements.push(rotateLine, rotate);
+      }
     }
     if (resizeEnabled)
       for (let i = 0, len = enabledAnchors.length; i < len; i++) {

package/lib/types/canvas.d.ts

@@ -19,6 +19,7 @@ interface ICanvasProps {
     height?: number;
     pixelRatio?: number;
     mode?: CanvasRenderMode;
+    id?: string;
 }
 /**
  * View Renderer constructor. It is a wrapper around native canvas element.
@@ -48,6 +49,7 @@ export declare class Canvas {
     getPixelRatio(): number;
     getWidth(): number;
     getHeight(): number;
+    setId(id: string): void;
     setSize(width?: number, height?: number, pixelRatioParam?: number): void;
     setPixelRatio(pixelRatio: number): void;
     dispose(): void;

package/lib/types/components/docs/extensions/font-and-base-line.d.ts

@@ -1,7 +1,7 @@
 import { IScale } from '@univerjs/core';
-import { docExtension } from '../doc-extension';
 import { IDocumentSkeletonGlyph } from '../../../basics/i-document-skeleton-cached';
 import { UniverRenderingContext } from '../../../context';
+import { docExtension } from '../doc-extension';
 export declare class FontAndBaseLine extends docExtension {
     uKey: string;
     Z_INDEX: number;

package/lib/types/engine.d.ts

@@ -54,6 +54,7 @@ export declare class Engine extends ThinEngine<Scene> {
     private _isUsingFirefox;
     private _previousWidth;
     private _previousHeight;
+    private _unitId;
     constructor(elemWidth?: number, elemHeight?: number, pixelRatio?: number, mode?: CanvasRenderMode);
     _init(): void;
     get elapsedTime(): number;

package/lib/types/render-manager/render-manager.service.d.ts

@@ -1,11 +1,11 @@
-import { Disposable, Injector, IUniverInstanceService, UniverInstanceType, Dependency, DependencyIdentifier, IDisposable, Nullable, UnitModel, UnitType } from '@univerjs/core';
+import { Dependency, DependencyIdentifier, IDisposable, Nullable, UnitModel, UnitType, Disposable, Injector, IUniverInstanceService, UniverInstanceType } from '@univerjs/core';
 import { Observable } from 'rxjs';
-import { Engine } from '../engine';
-import { IRender, RenderUnit } from './render-unit';
 import { BaseObject } from '../base-object';
 import { DocComponent } from '../components/docs/doc-component';
 import { SheetComponent } from '../components/sheets/sheet-component';
 import { Slide } from '../components/slides/slide';
+import { Engine } from '../engine';
+import { IRender, RenderUnit } from './render-unit';
 export type RenderComponentType = SheetComponent | DocComponent | Slide | BaseObject;
 export interface IRenderManagerService extends IDisposable {
     /** @deprecated */

package/lib/types/scene.transformer.d.ts

@@ -1,9 +1,9 @@
 import { Nullable, Disposable } from '@univerjs/core';
 import { BaseObject } from './base-object';
 import { IMouseEvent, IPointerEvent } from './basics/i-events';
-import { Group } from './group';
-import { Scene } from './scene';
 import { ITransformerConfig } from './basics/transformer-config';
+import { Scene } from './scene';
+import { Group } from './group';
 declare enum MoveObserverType {
     MOVE_START = 0,
     MOVING = 1,

package/lib/types/shape/rect.d.ts

@@ -1,7 +1,7 @@
 import { Nullable } from '@univerjs/core';
-import { ObjectType } from '../base-object';
-import { Shape, IShapeProps } from './shape';
 import { UniverRenderingContext } from '../context';
+import { IShapeProps, Shape } from './shape';
+import { ObjectType } from '../base-object';
 export interface IRectProps extends IShapeProps {
     radius?: number;
     visualHeight?: number;

package/lib/types/shape/shape.d.ts

@@ -1,12 +1,14 @@
 import { IOffset, IScale, ISize, Nullable } from '@univerjs/core';
-import { BaseObject, ObjectType } from '../base-object';
 import { IObjectFullState } from '../basics/interfaces';
 import { IViewportInfo, Vector2 } from '../basics/vector2';
 import { UniverRenderingContext } from '../context';
+import { BaseObject, ObjectType } from '../base-object';
 export type LineJoin = 'round' | 'bevel' | 'miter';
 export type LineCap = 'butt' | 'round' | 'square';
 export type PaintFirst = 'fill' | 'stroke';
 export interface IShapeProps extends IObjectFullState, ISize, IOffset, IScale {
+    rotateEnabled?: boolean;
+    resizeEnabled?: boolean;
     hoverCursor?: Nullable<string>;
     moveCursor?: string | null;
     fillRule?: string;