@visactor/vrender 0.15.1 → 0.15.3-alpha.0

package/dist/index.js

@@ -9371,7 +9371,8 @@
 	    scaleIn3d: false,
 	    direction: 'horizontal',
 	    wordBreak: 'break-all',
-	    ignoreBuf: false
+	    ignoreBuf: false,
+	    verticalMode: 0
 	};
 	const DefaultStyle = Object.assign(Object.assign(Object.assign({ opacity: 1, background: null, texture: null, textureColor: 'black', textureSize: 10, texturePadding: 2, backgroundMode: 0, blur: 0, cursor: null, html: null }, DefaultFillStyle), DefaultStrokeStyle), DefaultLayout);
 	const DefaultConnectAttribute = {
@@ -9380,7 +9381,10 @@
 	    connectedX: NaN,
 	    connectedY: NaN
 	};
-	const DefaultAttribute = Object.assign(Object.assign({ strokeSeg: null, pickable: true, childrenPickable: true, visible: true, zIndex: 0, layout: null, boundsPadding: 0, pickMode: 'accurate', customPickShape: null, boundsMode: 'accurate', keepDirIn3d: true, shadowRootIdx: 1 }, DefaultStyle), DefaultTransform);
+	const DefaultDebugAttribute = {
+	    _debug_bounds: false
+	};
+	const DefaultAttribute = Object.assign(Object.assign(Object.assign({ strokeSeg: null, pickable: true, childrenPickable: true, visible: true, zIndex: 0, layout: null, boundsPadding: 0, pickMode: 'accurate', customPickShape: null, boundsMode: 'accurate', keepDirIn3d: true, shadowRootIdx: 1 }, DefaultDebugAttribute), DefaultStyle), DefaultTransform);
 	function addAttributeToPrototype(obj, c, keys) {
 	    keys.forEach(key => {
 	        c.prototype[key] = obj[key];
@@ -9398,7 +9402,7 @@
 	const DefaultPathAttribute = Object.assign(Object.assign({}, DefaultAttribute), { path: new CustomPath2D(), customPath: () => {
 	        console.warn('空函数');
 	    } });
-	const DefaultPolygonAttribute = Object.assign(Object.assign({}, DefaultAttribute), { points: [], cornerRadius: 0 });
+	const DefaultPolygonAttribute = Object.assign(Object.assign({}, DefaultAttribute), { points: [], cornerRadius: 0, closePath: true });
 	const DefaultRectAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, strokeBoundsBuffer: 0, cornerRadius: 0 });
 	const DefaultRect3dAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, cornerRadius: 0, length: 0 });
 	const DefaultSymbolAttribute = Object.assign(Object.assign({}, DefaultAttribute), { symbolType: 'circle', size: 10, keepDirIn3d: true });
@@ -10980,11 +10984,11 @@
 	    forEach(cb) {
 	        return this.forEachChildren(cb);
 	    }
-	    appendChild(node) {
+	    appendChild(node, highPerformance = true) {
 	        if (this._uid === node._uid) {
 	            return null;
 	        }
-	        if (node.isAncestorsOf(this)) {
+	        if (!highPerformance && node.isAncestorsOf(this)) {
 	            throw new Error('【Node::appendChild】不能将父辈元素append为子元素');
 	        }
 	        node.parent && node.parent.removeChild(node);
@@ -17130,6 +17134,35 @@
 	const tempConstantScaleXYKey = ['scaleX', 'scaleY'];
 	const tempConstantAngleKey = ['angle'];
 	const point = new Point();
+	const NOWORK_ANIMATE_ATTR = {
+	    strokeSeg: 1,
+	    boundsPadding: 2,
+	    pickMode: 1,
+	    boundsMode: 1,
+	    customPickShape: 1,
+	    pickable: 1,
+	    childrenPickable: 1,
+	    visible: 1,
+	    zIndex: 1,
+	    layout: 1,
+	    keepDirIn3d: 1,
+	    outerBorder: 1,
+	    innerBorder: 1,
+	    lineDash: 1,
+	    lineCap: 1,
+	    lineJoin: 1,
+	    miterLimit: 2,
+	    strokeBoundsBuffer: 2,
+	    scaleCenter: 1,
+	    anchor: 1,
+	    anchor3d: 1,
+	    postMatrix: 1,
+	    backgroundMode: 2,
+	    background: 1,
+	    texture: 1,
+	    cursor: 1,
+	    html: 1
+	};
 	class Graphic extends Node {
 	    static mixin(source) {
 	        const keys = Object.keys(source);
@@ -18058,6 +18091,7 @@
 	    }
 	    release() {
 	        this.releaseStatus = 'released';
+	        application.graphicService.onRelease(this);
 	    }
 	    _emitCustomEvent(type, context) {
 	        var _a, _b;
@@ -20417,7 +20451,11 @@
 	    clone() {
 	        return new Group(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Group.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Group.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	const LayerHandlerContribution = Symbol.for('LayerHandlerContribution');
 	class Layer extends Group {
@@ -20972,6 +21010,9 @@
 	                context.moveTo(cx + xors, cy + yors);
 	                context.arc(cx, cy, outerRadius, outerStartAngle, outerEndAngle, !clockwise);
 	            }
+	            else {
+	                context.moveTo(cx + outerRadius * cos(outerEndAngle), cy + outerRadius * sin(outerEndAngle));
+	            }
 	        }
 	        if (!(innerRadius > epsilon) || innerDeltaAngle < 0.001) {
 	            if (!partStroke || partStroke[1]) {
@@ -21039,7 +21080,7 @@
 	        context.closePath();
 	    }
 	    else if (partStroke[3]) {
-	        context.lineTo(cx + outerRadius * cos(endAngle), cy + outerRadius * cos(endAngle));
+	        context.lineTo(cx + outerRadius * cos(startAngle), cy + outerRadius * sin(startAngle));
 	    }
 	    return collapsedToLine;
 	}
@@ -21697,7 +21738,11 @@
 	    clone() {
 	        return new Circle(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Circle.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Circle.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	function getContextFont(text, defaultAttr = {}, fontSizeScale) {
 	    if (!fontSizeScale) {
@@ -21903,6 +21948,8 @@
 	    'fontWeight',
 	    'ellipsis',
 	    'lineHeight',
+	    'direction',
+	    'wordBreak',
 	    ...GRAPHIC_UPDATE_TAG_KEY
 	];
 	class Text extends Graphic {
@@ -22047,15 +22094,27 @@
 	        }
 	        return this._AABBBounds;
 	    }
+	    getBaselineMapAlign() {
+	        return Text.baselineMapAlign;
+	    }
+	    getAlignMapBaseline() {
+	        return Text.alignMapBaseline;
+	    }
 	    updateVerticalSinglelineAABBBounds(text) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textTheme = getTheme(this).text;
 	        const textMeasure = application.graphicUtil.textMeasure;
 	        let width;
 	        const attribute = this.attribute;
 	        const { ignoreBuf = textTheme.ignoreBuf } = attribute;
 	        const buf = ignoreBuf ? 0 : 2;
-	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, fontFamily = textTheme.fontFamily, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak } = attribute;
+	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, fontFamily = textTheme.fontFamily, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, verticalMode = textTheme.verticalMode } = attribute;
+	        let { textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline } = attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_b = Text.baselineMapAlign[textBaseline]) !== null && _b !== void 0 ? _b : 'left';
+	            textBaseline = (_c = Text.alignMapBaseline[t]) !== null && _c !== void 0 ? _c : 'top';
+	        }
 	        if (!this.shouldUpdateShape() && this.cache) {
 	            width = this.cache.clipedWidth;
 	            const dx = textDrawOffsetX(textAlign, width);
@@ -22131,14 +22190,20 @@
 	        return this._AABBBounds;
 	    }
 	    updateVerticalMultilineAABBBounds(text) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textTheme = getTheme(this).text;
 	        const textMeasure = application.graphicUtil.textMeasure;
 	        let width;
 	        const attribute = this.attribute;
 	        const { ignoreBuf = textTheme.ignoreBuf } = attribute;
 	        const buf = ignoreBuf ? 0 : 2;
-	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak } = attribute;
+	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, verticalMode = textTheme.verticalMode } = attribute;
+	        let { textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline } = attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_b = Text.baselineMapAlign[textBaseline]) !== null && _b !== void 0 ? _b : 'left';
+	            textBaseline = (_c = Text.alignMapBaseline[t]) !== null && _c !== void 0 ? _c : 'top';
+	        }
 	        width = 0;
 	        if (!this.shouldUpdateShape() && this.cache) {
 	            this.cache.verticalList.forEach(item => {
@@ -22225,7 +22290,21 @@
 	    clone() {
 	        return new Text(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Text.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Text.NOWORK_ANIMATE_ATTR = Object.assign({ ellipsis: 1, wordBreak: 1, direction: 1, textAlign: 1, textBaseline: 1, fontFamily: 1, fontWeight: 1 }, NOWORK_ANIMATE_ATTR);
+	Text.baselineMapAlign = {
+	    top: 'left',
+	    bottom: 'right',
+	    middle: 'center'
+	};
+	Text.alignMapBaseline = {
+	    left: 'top',
+	    right: 'bottom',
+	    center: 'middle'
+	};
 
 	const WRAP_TEXT_UPDATE_TAG_KEY = ['heightLimit', 'lineClamp'];
 	class WrapText extends Text {
@@ -22360,6 +22439,9 @@
 	        }
 	        return super.needUpdateTag(key);
 	    }
+	    getNoWorkAnimateAttr() {
+	        return WrapText.NOWORK_ANIMATE_ATTR;
+	    }
 	}
 
 	function circle(ctx, r, x, y, z) {
@@ -23366,8 +23448,12 @@
 	    clone() {
 	        return new Symbol(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Symbol.NOWORK_ANIMATE_ATTR;
+	    }
 	};
 	Symbol$1.userSymbolMap = {};
+	Symbol$1.NOWORK_ANIMATE_ATTR = Object.assign({ symbolType: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const LINE_UPDATE_TAG_KEY = ['segments', 'points', 'curveType', ...GRAPHIC_UPDATE_TAG_KEY];
 	let Line$1 = class Line extends Graphic {
@@ -23472,7 +23558,11 @@
 	    clone() {
 	        return new Line(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Line.NOWORK_ANIMATE_ATTR;
+	    }
 	};
+	Line$1.NOWORK_ANIMATE_ATTR = Object.assign({ segments: 1, curveType: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const RECT_UPDATE_TAG_KEY = ['width', 'height', 'cornerRadius', ...GRAPHIC_UPDATE_TAG_KEY];
 	class Rect extends Graphic {
@@ -23540,7 +23630,11 @@
 	    clone() {
 	        return new Rect(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Rect.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Rect.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	const CUBE_VERTICES = [
 	    [0, 0, 0],
@@ -23588,7 +23682,11 @@
 	        ];
 	        return faces;
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Rect3d.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Rect3d.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	class Glyph extends Graphic {
 	    constructor(params) {
@@ -23754,7 +23852,11 @@
 	        glyph.setSubGraphic(this.subGraphic.map(g => g.clone()));
 	        return glyph;
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Glyph.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Glyph.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	class Frame {
 	    constructor(left, top, width, height, ellipsis, wordBreak, verticalDirection, globalAlign, globalBaseline, layoutDirection, isWidthMax, isHeightMax, singleLine, icons) {
@@ -24306,7 +24408,11 @@
 	    clone() {
 	        return new Image(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Image.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Image.NOWORK_ANIMATE_ATTR = Object.assign({ image: 1, repeatX: 1, repeatY: 1 }, NOWORK_ANIMATE_ATTR);
 
 	class RichTextIcon extends Image {
 	    constructor(params) {
@@ -24914,7 +25020,11 @@
 	        });
 	        return pickIcon;
 	    }
+	    getNoWorkAnimateAttr() {
+	        return RichText.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	RichText.NOWORK_ANIMATE_ATTR = Object.assign({ ellipsis: 1, wordBreak: 1, verticalDirection: 1, textAlign: 1, textBaseline: 1, textConfig: 1, layoutDirection: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const PATH_UPDATE_TAG_KEY = ['path', 'customPath', ...GRAPHIC_UPDATE_TAG_KEY];
 	class Path extends Graphic {
@@ -25008,7 +25118,11 @@
 	    clone() {
 	        return new Path(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Path.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Path.NOWORK_ANIMATE_ATTR = Object.assign({ path: 1, customPath: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const AREA_UPDATE_TAG_KEY = ['segments', 'points', 'curveType', ...GRAPHIC_UPDATE_TAG_KEY];
 	class Area extends Graphic {
@@ -25122,7 +25236,11 @@
 	    clone() {
 	        return new Area(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Area.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Area.NOWORK_ANIMATE_ATTR = Object.assign({ segments: 1, curveType: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const ARC_UPDATE_TAG_KEY = [
 	    'innerRadius',
@@ -25326,7 +25444,11 @@
 	    clone() {
 	        return new Arc(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Arc.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Arc.NOWORK_ANIMATE_ATTR = Object.assign({ cap: 1 }, NOWORK_ANIMATE_ATTR);
 
 	class Arc3d extends Arc {
 	    constructor(params) {
@@ -25347,7 +25469,11 @@
 	        this.clearUpdateBoundTag();
 	        return this._AABBBounds;
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Arc3d.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Arc3d.NOWORK_ANIMATE_ATTR = Object.assign({ cap: 1 }, NOWORK_ANIMATE_ATTR);
 
 	const POLYGON_UPDATE_TAG_KEY = ['points', 'cornerRadius', ...GRAPHIC_UPDATE_TAG_KEY];
 	class Polygon extends Graphic {
@@ -25423,7 +25549,11 @@
 	    clone() {
 	        return new Polygon(Object.assign({}, this.attribute));
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Polygon.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Polygon.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	class Pyramid3d extends Polygon {
 	    constructor(params) {
@@ -25519,7 +25649,11 @@
 	    _isValid() {
 	        return super._isValid() && this.attribute.points.length === 4;
 	    }
+	    getNoWorkAnimateAttr() {
+	        return Pyramid3d.NOWORK_ANIMATE_ATTR;
+	    }
 	}
+	Pyramid3d.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 
 	let DefaultOuterBorderBoundsContribution = class DefaultOuterBorderBoundsContribution {
 	    updateBounds(attribute, theme, aabbBounds, graphic) {
@@ -26105,6 +26239,7 @@
 	            onAttributeUpdate: new SyncHook(['graphic']),
 	            onSetStage: new SyncHook(['graphic', 'stage']),
 	            onRemove: new SyncHook(['graphic']),
+	            onRelease: new SyncHook(['graphic']),
 	            onAddIncremental: new SyncHook(['graphic', 'group', 'stage']),
 	            onClearIncremental: new SyncHook(['graphic', 'group', 'stage']),
 	            beforeUpdateAABBBounds: new SyncHook([
@@ -26139,6 +26274,11 @@
 	            this.hooks.onRemove.call(graphic);
 	        }
 	    }
+	    onRelease(graphic) {
+	        if (this.hooks.onRelease.taps.length) {
+	            this.hooks.onRelease.call(graphic);
+	        }
+	    }
 	    onAddIncremental(graphic, group, stage) {
 	        if (this.hooks.onAddIncremental.taps.length) {
 	            this.hooks.onAddIncremental.call(graphic, group, stage);
@@ -27121,7 +27261,11 @@
 	            offsetY,
 	            offsetZ: z
 	        });
-	        if (line.cache && !isArray$1(line.cache) && line.attribute.curveType && line.attribute.curveType.includes('Closed')) {
+	        if (line.cache &&
+	            !isArray$1(line.cache) &&
+	            line.cache.curves.every(c => c.defined) &&
+	            line.attribute.curveType &&
+	            line.attribute.curveType.includes('Closed')) {
 	            context.closePath();
 	        }
 	        context.setShadowStyle && context.setShadowStyle(line, attribute, defaultAttribute);
@@ -28387,10 +28531,16 @@
 	        this.numberType = TEXT_NUMBER_TYPE;
 	    }
 	    drawShape(text, context, x, y, drawContext, params, fillCb, strokeCb) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textAttribute = getTheme(text, params === null || params === void 0 ? void 0 : params.theme).text;
-	        const { text: str, fill = textAttribute.fill, stroke = textAttribute.stroke, fillOpacity = textAttribute.fillOpacity, strokeOpacity = textAttribute.strokeOpacity, opacity = textAttribute.opacity, lineWidth = textAttribute.lineWidth, visible = textAttribute.visible, underline = textAttribute.underline, lineThrough = textAttribute.lineThrough, keepDirIn3d = textAttribute.keepDirIn3d, direction = textAttribute.direction, fontSize = textAttribute.fontSize, textBaseline = textAttribute.textBaseline, textAlign = textAttribute.textAlign, x: originX = textAttribute.x, y: originY = textAttribute.y } = text.attribute;
-	        const lineHeight = (_a = text.attribute.lineHeight) !== null && _a !== void 0 ? _a : fontSize;
+	        const { text: str, fill = textAttribute.fill, stroke = textAttribute.stroke, fillOpacity = textAttribute.fillOpacity, strokeOpacity = textAttribute.strokeOpacity, opacity = textAttribute.opacity, lineWidth = textAttribute.lineWidth, visible = textAttribute.visible, underline = textAttribute.underline, lineThrough = textAttribute.lineThrough, keepDirIn3d = textAttribute.keepDirIn3d, direction = textAttribute.direction, fontSize = textAttribute.fontSize, verticalMode = textAttribute.verticalMode, x: originX = textAttribute.x, y: originY = textAttribute.y } = text.attribute;
+	        let { textAlign = textAttribute.textAlign, textBaseline = textAttribute.textBaseline } = text.attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_a = text.getBaselineMapAlign()[textBaseline]) !== null && _a !== void 0 ? _a : 'left';
+	            textBaseline = (_b = text.getAlignMapBaseline()[t]) !== null && _b !== void 0 ? _b : 'top';
+	        }
+	        const lineHeight = (_c = text.attribute.lineHeight) !== null && _c !== void 0 ? _c : fontSize;
 	        const fVisible = fillVisible(opacity, fillOpacity, fill);
 	        const sVisible = strokeVisible(opacity, strokeOpacity);
 	        const doFill = runFill(fill);
@@ -28678,23 +28828,30 @@
 	        path.lineTo(points[i].x + x, points[i].y + y);
 	    }
 	}
-	function drawRoundedPolygon(path, points, x, y, cornerRadius) {
+	function drawRoundedPolygon(path, points, x, y, cornerRadius, closePath = true) {
 	    var _a;
 	    if (points.length < 3) {
 	        drawPolygon(path, points, x, y);
 	        return;
 	    }
-	    for (let i = 0; i < points.length; i++) {
-	        const p1 = points[i];
-	        const angularPoint = points[(i + 1) % points.length];
-	        const p2 = points[(i + 2) % points.length];
+	    let startI = 0;
+	    let endI = points.length - 1;
+	    if (!closePath) {
+	        startI += 1;
+	        endI -= 1;
+	        path.moveTo(points[0].x + x, points[0].y + y);
+	    }
+	    for (let i = startI; i <= endI; i++) {
+	        const p1 = points[i === 0 ? endI : (i - 1) % points.length];
+	        const angularPoint = points[i % points.length];
+	        const p2 = points[(i + 1) % points.length];
 	        const dx1 = angularPoint.x - p1.x;
 	        const dy1 = angularPoint.y - p1.y;
 	        const dx2 = angularPoint.x - p2.x;
 	        const dy2 = angularPoint.y - p2.y;
 	        const angle = (Math.atan2(dy1, dx1) - Math.atan2(dy2, dx2)) / 2;
 	        const tan = Math.abs(Math.tan(angle));
-	        let radius = Array.isArray(cornerRadius) ? (_a = cornerRadius[(i + 1) % points.length]) !== null && _a !== void 0 ? _a : 0 : cornerRadius;
+	        let radius = Array.isArray(cornerRadius) ? (_a = cornerRadius[i % points.length]) !== null && _a !== void 0 ? _a : 0 : cornerRadius;
 	        let segment = radius / tan;
 	        const length1 = getLength(dx1, dy1);
 	        const length2 = getLength(dx2, dy2);
@@ -28731,6 +28888,9 @@
 	        }
 	        path.lineTo(p2Cross.x + x, p2Cross.y + y);
 	    }
+	    if (!closePath) {
+	        path.lineTo(points[endI + 1].x + x, points[endI + 1].y + y);
+	    }
 	}
 	function getLength(dx, dy) {
 	    return Math.sqrt(dx * dx + dy * dy);
@@ -28750,7 +28910,7 @@
 	    }
 	    drawShape(polygon, context, x, y, drawContext, params, fillCb, strokeCb) {
 	        const polygonAttribute = getTheme(polygon, params === null || params === void 0 ? void 0 : params.theme).polygon;
-	        const { points = polygonAttribute.points, fill = polygonAttribute.fill, stroke = polygonAttribute.stroke, cornerRadius = polygonAttribute.cornerRadius, fillOpacity = polygonAttribute.fillOpacity, background, strokeOpacity = polygonAttribute.strokeOpacity, lineWidth = polygonAttribute.lineWidth, opacity = polygonAttribute.opacity, visible = polygonAttribute.visible, x: originX = polygonAttribute.x, y: originY = polygonAttribute.y } = polygon.attribute;
+	        const { points = polygonAttribute.points, fill = polygonAttribute.fill, stroke = polygonAttribute.stroke, cornerRadius = polygonAttribute.cornerRadius, fillOpacity = polygonAttribute.fillOpacity, background, strokeOpacity = polygonAttribute.strokeOpacity, lineWidth = polygonAttribute.lineWidth, opacity = polygonAttribute.opacity, visible = polygonAttribute.visible, x: originX = polygonAttribute.x, y: originY = polygonAttribute.y, closePath = polygonAttribute.closePath } = polygon.attribute;
 	        const fVisible = fillVisible(opacity, fillOpacity, fill);
 	        const sVisible = strokeVisible(opacity, strokeOpacity);
 	        const doFill = runFill(fill, background);
@@ -28769,9 +28929,9 @@
 	            drawPolygon(context.camera ? context : context.nativeContext, points, x, y);
 	        }
 	        else {
-	            drawRoundedPolygon(context.camera ? context : context.nativeContext, points, x, y, cornerRadius);
+	            drawRoundedPolygon(context.camera ? context : context.nativeContext, points, x, y, cornerRadius, closePath);
 	        }
-	        context.closePath();
+	        closePath && context.closePath();
 	        if (!this._polygonRenderContribitions) {
 	            this._polygonRenderContribitions = this.polygonRenderContribitions.getContributions() || [];
 	            this._polygonRenderContribitions.sort((a, b) => b.order - a.order);
@@ -30071,21 +30231,21 @@
 	        if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {
 	            return this._pickItem(graphic, pickerService, point, pickParams, params);
 	        }
-	        return false;
+	        return null;
 	    }
 	    beforePickItem(graphic, pickerService, point, pickParams, params) {
 	        if (graphic.attribute.shadowRootIdx < 0) {
 	            return this._pickItem(graphic, pickerService, point, pickParams, params);
 	        }
-	        return false;
+	        return null;
 	    }
 	    _pickItem(graphic, pickerService, point, pickParams, params) {
 	        if (!graphic.shadowRoot) {
-	            return false;
+	            return null;
 	        }
 	        const { parentMatrix } = params || {};
 	        if (!parentMatrix) {
-	            return false;
+	            return null;
 	        }
 	        const context = pickerService.pickContext;
 	        context.highPerformanceSave();
@@ -30269,7 +30429,7 @@
 	                result = this.pickGroup(graphics[i], point, parentMatrix, params);
 	            }
 	            else {
-	                result.graphic = this.pickItem(graphics[i], point, parentMatrix, params);
+	                result = this.pickItem(graphics[i], point, parentMatrix, params);
 	            }
 	            if (result.graphic) {
 	                break;
@@ -30351,12 +30511,13 @@
 	            return result;
 	        }
 	        const pickedItem = this.pickItem(group, newPoint.clone(), parentMatrix, params);
-	        if (pickedItem) {
-	            result.graphic = pickedItem;
+	        if (pickedItem && pickedItem.graphic) {
+	            result.graphic = pickedItem.graphic;
+	            result.params = pickedItem.params;
 	        }
 	        const groupPicked = group.attribute.pickable !== false && insideGroup;
 	        currentGroupMatrix.multiply(transMatrix.a, transMatrix.b, transMatrix.c, transMatrix.d, transMatrix.e, transMatrix.f);
-	        if (group.attribute.childrenPickable !== false && !pickedItem) {
+	        if (group.attribute.childrenPickable !== false && !(pickedItem && pickedItem.graphic)) {
 	            foreach(group, DefaultAttribute.zIndex, (graphic) => {
 	                if (graphic.isContainer) {
 	                    const newPoint = new Point(point.x, point.y);
@@ -30374,7 +30535,10 @@
 	                    newPoint.x -= scrollX;
 	                    newPoint.y -= scrollY;
 	                    const pickedItem = this.pickItem(graphic, newPoint, parentMatrix, params);
-	                    result.graphic = pickedItem;
+	                    if (pickedItem && pickedItem.graphic) {
+	                        result.graphic = pickedItem.graphic;
+	                        result.params = pickedItem.params;
+	                    }
 	                }
 	                return !!result.graphic || !!result.group;
 	            }, true, !!context.camera);
@@ -30429,7 +30593,11 @@
 	                result = this.pickGroup(graphics[i], point, parentMatrix, params);
 	            }
 	            else {
-	                result.graphic = this.pickItem(graphics[i], point, parentMatrix, params);
+	                const data = this.pickItem(graphics[i], point, parentMatrix, params);
+	                if (data) {
+	                    result.graphic = data.graphic;
+	                    result.params = data.params;
+	                }
 	            }
 	            if (result.graphic) {
 	                break;
@@ -30483,7 +30651,11 @@
 	                else {
 	                    const newPoint = new Point(point.x, point.y);
 	                    parentMatrix.transformPoint(newPoint, newPoint);
-	                    result.graphic = this.pickItem(graphic, newPoint, parentMatrix, params);
+	                    const data = this.pickItem(graphic, newPoint, parentMatrix, params);
+	                    if (data) {
+	                        result.graphic = data.graphic;
+	                        result.params = data.params;
+	                    }
 	                }
 	                return !!result.graphic || !!result.group;
 	            });
@@ -30498,7 +30670,9 @@
 	            return null;
 	        }
 	        if (graphic.AABBBounds.containsPoint(point)) {
-	            return graphic;
+	            return {
+	                graphic: graphic
+	            };
 	        }
 	        return null;
 	    }
@@ -31783,7 +31957,7 @@
 	                if (drawContribution.beforePickItem) {
 	                    const ret = drawContribution.beforePickItem(graphic, this, point, params, { parentMatrix });
 	                    if (ret) {
-	                        return ret === true ? graphic : ret.graphic;
+	                        return ret;
 	                    }
 	                }
 	            }
@@ -31792,8 +31966,11 @@
 	        if (!picker) {
 	            return null;
 	        }
-	        const data = picker.contains(graphic, point, params) ? graphic : null;
-	        if (data) {
+	        const g = picker.contains(graphic, point, params) ? graphic : null;
+	        const data = {
+	            graphic: g
+	        };
+	        if (g) {
 	            return data;
 	        }
 	        if (this.InterceptorContributions.length) {
@@ -31802,7 +31979,7 @@
 	                if (drawContribution.afterPickItem) {
 	                    const ret = drawContribution.afterPickItem(graphic, this, point, params, { parentMatrix });
 	                    if (ret) {
-	                        return ret === true ? graphic : ret.graphic;
+	                        return ret;
 	                    }
 	                }
 	            }
@@ -32120,7 +32297,13 @@
 	        if (!picker) {
 	            return null;
 	        }
-	        return picker.contains(graphic, point, params) ? graphic : null;
+	        const g = picker.contains(graphic, point, params) ? graphic : null;
+	        if (g) {
+	            return {
+	                graphic: g
+	            };
+	        }
+	        return null;
 	    }
 	};
 	__decorate([
@@ -33159,15 +33342,15 @@
 	    injectable()
 	], NodeEnvContribution);
 
-	function makeUpCanvas(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, compoient) {
+	function makeUpCanvas(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, component) {
 	    return __awaiter(this, void 0, void 0, function* () {
 	        const dpr = wx.getSystemInfoSync().pixelRatio;
 	        for (let i = 0; i < canvasIdLists.length; i++) {
 	            const id = canvasIdLists[i];
 	            yield new Promise(resolve => {
 	                let data = wx.createSelectorQuery();
-	                if (compoient) {
-	                    data = data.in(compoient);
+	                if (component) {
+	                    data = data.in(component);
 	                }
 	                data
 	                    .select(`#${id}`)
@@ -33213,7 +33396,7 @@
 	    configure(service, params) {
 	        if (service.env === this.type) {
 	            service.setActiveEnvContribution(this);
-	            return makeUpCanvas(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.compoient).then(() => {
+	            return makeUpCanvas(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.component).then(() => {
 	                loadFeishuContributions();
 	            });
 	        }
@@ -35502,6 +35685,40 @@
 	ShadowRootDrawItemInterceptorContribution = __decorate([
 	    injectable()
 	], ShadowRootDrawItemInterceptorContribution);
+	let CommonDrawItemInterceptorContribution = class CommonDrawItemInterceptorContribution {
+	    constructor() {
+	        this.order = 1;
+	    }
+	    afterDrawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {
+	            this.drawItem(graphic, renderService, drawContext, drawContribution, params);
+	        }
+	        return false;
+	    }
+	    beforeDrawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (graphic.attribute.shadowRootIdx < 0) {
+	            this.drawItem(graphic, renderService, drawContext, drawContribution, params);
+	        }
+	        return false;
+	    }
+	    drawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (!graphic.attribute._debug_bounds) {
+	            return false;
+	        }
+	        const { context } = drawContext;
+	        context.highPerformanceSave();
+	        const b = graphic.AABBBounds;
+	        if (graphic.attribute._debug_bounds !== true) {
+	            graphic.attribute._debug_bounds(context, graphic);
+	        }
+	        context.strokeRect(b.x1, b.y1, b.width(), b.height());
+	        context.highPerformanceRestore();
+	        return true;
+	    }
+	};
+	CommonDrawItemInterceptorContribution = __decorate([
+	    injectable()
+	], CommonDrawItemInterceptorContribution);
 	let Canvas3DDrawItemInterceptor = class Canvas3DDrawItemInterceptor {
 	    constructor() {
 	        this.order = 1;
@@ -37264,6 +37481,8 @@
 	    bindContributionProvider(bind, GraphicRender);
 	    bind(ShadowRootDrawItemInterceptorContribution).toSelf().inSingletonScope();
 	    bind(DrawItemInterceptor).toService(ShadowRootDrawItemInterceptorContribution);
+	    bind(CommonDrawItemInterceptorContribution).toSelf().inSingletonScope();
+	    bind(DrawItemInterceptor).toService(CommonDrawItemInterceptorContribution);
 	    bind(Canvas3DDrawItemInterceptor).toSelf().inSingletonScope();
 	    bind(DrawItemInterceptor).toService(Canvas3DDrawItemInterceptor);
 	    bindContributionProvider(bind, DrawItemInterceptor);
@@ -37367,6 +37586,7 @@
 	        }
 	        let picked = true;
 	        if (!onlyTranslate ||
+	            rect.shadowRoot ||
 	            (isNumber$2(cornerRadius, true) && cornerRadius !== 0) ||
 	            (isArray$1(cornerRadius) && cornerRadius.some(num => num !== 0))) {
 	            picked = false;
@@ -37386,7 +37606,7 @@
 	                return picked;
 	            });
 	        }
-	        else if (picked) {
+	        else {
 	            const { fill = rectAttribute.fill, stroke = rectAttribute.stroke, lineWidth = rectAttribute.lineWidth } = rect.attribute;
 	            if (fill) {
 	                picked = true;
@@ -38973,6 +39193,9 @@
 	            }
 	            this.drawHTML(context.stage.renderService);
 	        });
+	        application.graphicService.hooks.onRelease.tap(this.key, graphic => {
+	            this.removeDom(graphic);
+	        });
 	    }
 	    deactivate(context) {
 	        context.stage.hooks.afterRender.taps = context.stage.hooks.afterRender.taps.filter(item => {
@@ -39002,6 +39225,14 @@
 	            }
 	        });
 	    }
+	    removeDom(graphic) {
+	        if (graphic.bindDom && graphic.bindDom.size) {
+	            graphic.bindDom.forEach(item => {
+	                item.dom && item.dom.parentElement.removeChild(item.dom);
+	            });
+	            graphic.bindDom.clear();
+	        }
+	    }
 	    renderGraphicHTML(graphic) {
 	        const { html } = graphic.attribute;
 	        if (!html) {
@@ -40266,7 +40497,7 @@
 	}
 	const Fragment = Group;
 
-	const version = "0.15.1";
+	const version = "0.15.3-alpha.0";
 
 	exports.ACustomAnimate = ACustomAnimate;
 	exports.ARC3D_NUMBER_TYPE = ARC3D_NUMBER_TYPE;
@@ -40312,6 +40543,7 @@
 	exports.DefaultAttribute = DefaultAttribute;
 	exports.DefaultCircleAttribute = DefaultCircleAttribute;
 	exports.DefaultConnectAttribute = DefaultConnectAttribute;
+	exports.DefaultDebugAttribute = DefaultDebugAttribute;
 	exports.DefaultFillStyle = DefaultFillStyle;
 	exports.DefaultGlyphAttribute = DefaultGlyphAttribute;
 	exports.DefaultGroupAttribute = DefaultGroupAttribute;
@@ -40395,6 +40627,7 @@
 	exports.MorphingPath = MorphingPath;
 	exports.MotionPath = MotionPath;
 	exports.MultiToOneMorphingPath = MultiToOneMorphingPath;
+	exports.NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;
 	exports.Node = Node;
 	exports.PATH_NUMBER_TYPE = PATH_NUMBER_TYPE;
 	exports.POLYGON_NUMBER_TYPE = POLYGON_NUMBER_TYPE;