@visactor/vrender-core 0.21.2-vstory.1 → 0.21.2-vstory.2

package/dist/index.es.js

@@ -3276,19 +3276,19 @@ function rewriteProto(obj, c) {
 const DefaultArcAttribute = Object.assign(Object.assign({}, DefaultAttribute), { startAngle: 0, endAngle: pi2, innerRadius: 0, outerRadius: 1, innerPadding: 0, outerPadding: 0, cornerRadius: 0, padRadius: 0, padAngle: 0, cap: false, forceShowCap: false });
 const DefaultAreaAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultConnectAttribute), { points: [], segments: [], curveType: 'linear', clipRange: 1, closePath: false, curveTension: 1 });
 const DefaultCircleAttribute = Object.assign(Object.assign({}, DefaultAttribute), { radius: 1, startAngle: 0, endAngle: pi2 });
-const DefaultGroupAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, cornerRadius: 0, path: [], clip: false, visibleAll: true, display: 'relative', flexDirection: 'row', flexWrap: 'wrap', justifyContent: 'flex-start', alignItems: 'flex-start', alignContent: 'flex-start', baseOpacity: 1 });
+const DefaultGroupAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, cornerRadius: 0, path: [], clip: false, visibleAll: true, display: 'relative', flexDirection: 'row', flexWrap: 'wrap', justifyContent: 'flex-start', alignItems: 'flex-start', alignContent: 'flex-start', baseOpacity: 1, cornerType: 'round' });
 const DefaultGlyphAttribute = Object.assign(Object.assign({}, DefaultAttribute), { path: '', width: 0, height: 0, cornerRadius: 0, clip: false });
 const DefaultLineAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultConnectAttribute), { points: [], segments: [], curveType: 'linear', clipRange: 1, clipRangeByDimension: 'default', closePath: false, curveTension: 1 });
 const DefaultPathAttribute = Object.assign(Object.assign({}, DefaultAttribute), { path: new CustomPath2D(), fillStrokeOrder: 1, clipRange: 1, customPath: () => {
         Logger.getInstance().warn('空函数');
     } });
 const DefaultPolygonAttribute = Object.assign(Object.assign({}, DefaultAttribute), { points: [], cornerRadius: 0, closePath: true });
-const DefaultRectAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, x1: 0, y1: 0, strokeBoundsBuffer: 0, cornerRadius: 0 });
-const DefaultRect3dAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, x1: 0, y1: 0, cornerRadius: 0, length: 0 });
+const DefaultRectAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, x1: 0, y1: 0, strokeBoundsBuffer: 0, cornerRadius: 0, cornerType: 'round' });
+const DefaultRect3dAttribute = Object.assign(Object.assign({}, DefaultAttribute), { width: 0, height: 0, x1: 0, y1: 0, cornerRadius: 0, length: 0, cornerType: 'round' });
 const DefaultSymbolAttribute = Object.assign(Object.assign({}, DefaultAttribute), { symbolType: 'circle', size: 10, keepDirIn3d: true, clipRange: 1 });
 const DefaultTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), { strokeBoundsBuffer: 0, keepDirIn3d: true });
 const DefaultRichTextAttribute = Object.assign(Object.assign(Object.assign({}, DefaultAttribute), DefaultTextStyle), { editable: false, width: 300, height: 300, ellipsis: true, wordBreak: 'break-word', verticalDirection: 'top', textAlign: 'left', textBaseline: 'top', layoutDirection: 'horizontal', textConfig: [], disableAutoWrapLine: false, maxHeight: undefined, maxWidth: undefined, singleLine: false });
-const DefaultImageAttribute = Object.assign(Object.assign({ repeatX: 'no-repeat', repeatY: 'no-repeat', image: '', width: 0, height: 0 }, DefaultAttribute), { fill: true, cornerRadius: 0 });
+const DefaultImageAttribute = Object.assign(Object.assign({ repeatX: 'no-repeat', repeatY: 'no-repeat', image: '', width: 0, height: 0 }, DefaultAttribute), { fill: true, cornerRadius: 0, cornerType: 'round' });
 const DefaultRichTextIconAttribute = Object.assign(Object.assign({}, DefaultImageAttribute), { backgroundShowMode: 'never', backgroundWidth: 0, backgroundHeight: 0, textAlign: 'left', textBaseline: 'middle', direction: 'horizontal', margin: 0, id: '', width: 20, height: 20, backgroundFill: 'rgba(101, 117, 168, 0.1)', backgroundFillOpacity: 1, backgroundStroke: false, backgroundStrokeOpacity: 1, backgroundRadius: 4, opacity: 1 });
 
 class Application {
@@ -8069,6 +8069,22 @@ Easing.easeInOutElastic = (x) => {
                 ? -(Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5)) / 2
                 : (Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5)) / 2 + 1;
 };
+function flicker(t, n) {
+    const step = 1 / n;
+    let flag = 1;
+    while (t > step) {
+        t -= step;
+        flag *= -1;
+    }
+    const v = (flag * t) / step;
+    return v > 0 ? v : 1 + v;
+}
+for (let i = 0; i < 10; i++) {
+    Easing[`flicker${i}`] = (t) => flicker(t, i);
+}
+for (let i = 2; i < 10; i++) {
+    Easing[`aIn${i}`] = (t) => i * t * t + (1 - i) * t;
+}
 
 class DefaultTimeline {
     constructor() {
@@ -9263,26 +9279,14 @@ class InputText extends ACustomAnimate {
         };
     }
     onBind() {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
         this.fromText = (_b = (_a = this.from) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : '';
-        this.toText = (_d = (_c = this.to) === null || _c === void 0 ? void 0 : _c.text) !== null && _d !== void 0 ? _d : '';
-        if (!this.toText || isArray(this.toText)) {
+        this.toText = ((_c = this.to) === null || _c === void 0 ? void 0 : _c.text) || '';
+        if (!this.toText || (isArray(this.toText) && this.toText.length === 0)) {
             this.valid = false;
         }
-        else {
-            this.toText = this.toText.toString();
-            const root = this.target.attachShadow();
-            const line = application.graphicService.creator.line({
-                x: 0,
-                y: 0,
-                points: [
-                    { x: 0, y: 0 },
-                    { x: 0, y: this.target.getComputedAttribute('fontSize') }
-                ],
-                stroke: 'black',
-                lineWidth: 1
-            });
-            root.add(line);
+        if (isArray(this.toText)) {
+            this.toText = this.toText.map(item => (item || '').toString());
         }
     }
     onEnd() {
@@ -9290,17 +9294,32 @@ class InputText extends ACustomAnimate {
         return;
     }
     onUpdate(end, ratio, out) {
-        var _a;
         if (this.valid === false) {
             return;
         }
         const fromCount = this.fromText.length;
-        const toCount = this.toText.length;
+        const toTextIsArray = isArray(this.toText);
+        const toCount = toTextIsArray
+            ? this.toText.reduce((c, t) => c + (t || '').length, 0)
+            : this.toText.length;
         const count = Math.ceil(fromCount + (toCount - fromCount) * ratio);
-        out.text = this.toText.substr(0, count);
-        const line = (_a = this.target.shadowRoot) === null || _a === void 0 ? void 0 : _a.at(0);
-        const endX = this.target.clipedWidth + 2;
-        line.setAttribute('x', endX);
+        if (toTextIsArray) {
+            out.text = [];
+            let len = 0;
+            this.toText.forEach(t => {
+                if (len + t.length > count) {
+                    out.text.push(t.substr(0, count - len));
+                    len = count;
+                }
+                else {
+                    out.text.push(t);
+                    len += t.length;
+                }
+            });
+        }
+        else {
+            out.text = this.toText.substr(0, count);
+        }
     }
 }
 class StreamLight extends ACustomAnimate {
@@ -12748,6 +12767,22 @@ class Graphic extends Node {
             }
             return true;
         }
+        else if (Array.isArray(nextStepVal) && nextStepVal.length === lastStepVal.length) {
+            const nextList = [];
+            let valid = true;
+            for (let i = 0; i < nextStepVal.length; i++) {
+                const v = lastStepVal[i];
+                const val = v + (nextStepVal[i] - v) * ratio;
+                if (!Number.isFinite(val)) {
+                    valid = false;
+                    break;
+                }
+                nextList.push(val);
+            }
+            if (valid) {
+                nextAttributes[key] = nextList;
+            }
+        }
         return false;
     }
     _interpolate(key, ratio, lastStepVal, nextStepVal, nextAttributes) {
@@ -20288,7 +20323,7 @@ class DefaultGroupBackgroundRenderContribution extends DefaultBaseBackgroundRend
 const defaultGroupBackgroundRenderContribution = new DefaultGroupBackgroundRenderContribution();
 
 const halfPi = pi / 2;
-function createRectPath(path, x, y, width, height, rectCornerRadius, edgeCb) {
+function createRectPath(path, x, y, width, height, rectCornerRadius, roundCorner, edgeCb) {
     if (width < 0) {
         x += width;
         width = -width;
@@ -20362,41 +20397,57 @@ function createRectPath(path, x, y, width, height, rectCornerRadius, edgeCb) {
     const leftBottomPoint1 = [leftBottom[0] + _cornerRadius[3], leftBottom[1]];
     const leftBottomPoint2 = [leftBottom[0], leftBottom[1] - _cornerRadius[3]];
     path.moveTo(leftTopPoint1[0], leftTopPoint1[1]);
-    edgeCb && edgeCb[0]
-        ? edgeCb[0](leftTopPoint1[0], leftTopPoint1[1], rightTopPoint1[0], rightTopPoint1[1])
-        : path.lineTo(rightTopPoint1[0], rightTopPoint1[1]);
-    if (!arrayEqual(rightTopPoint1, rightTopPoint2)) {
-        edgeCb && edgeCb[0] && path.moveTo(rightTopPoint1[0], rightTopPoint1[1]);
-        const centerX = rightTopPoint1[0];
-        const centerY = rightTopPoint1[1] + _cornerRadius[1];
-        path.arc(centerX, centerY, _cornerRadius[1], -halfPi, 0, false);
-    }
-    edgeCb && edgeCb[1]
-        ? edgeCb[1](rightTopPoint2[0], rightTopPoint2[1], rightBottomPoint2[0], rightBottomPoint2[1])
-        : path.lineTo(rightBottomPoint2[0], rightBottomPoint2[1]);
-    if (!arrayEqual(rightBottomPoint1, rightBottomPoint2)) {
-        const centerX = rightBottomPoint2[0] - _cornerRadius[2];
-        const centerY = rightBottomPoint2[1];
-        edgeCb && edgeCb[1] && path.moveTo(rightBottomPoint2[0], rightBottomPoint2[1]);
-        path.arc(centerX, centerY, _cornerRadius[2], 0, halfPi, false);
-    }
-    edgeCb && edgeCb[2]
-        ? edgeCb[2](rightBottomPoint1[0], rightBottomPoint1[1], leftBottomPoint1[0], leftBottomPoint1[1])
-        : path.lineTo(leftBottomPoint1[0], leftBottomPoint1[1]);
-    if (!arrayEqual(leftBottomPoint1, leftBottomPoint2)) {
-        const centerX = leftBottomPoint1[0];
-        const centerY = leftBottomPoint1[1] - _cornerRadius[3];
-        edgeCb && edgeCb[2] && path.moveTo(leftBottomPoint1[0], leftBottomPoint1[1]);
-        path.arc(centerX, centerY, _cornerRadius[3], halfPi, pi, false);
-    }
-    edgeCb && edgeCb[3]
-        ? edgeCb[3](leftBottomPoint2[0], leftBottomPoint2[1], leftTopPoint2[0], leftTopPoint2[1])
-        : path.lineTo(leftTopPoint2[0], leftTopPoint2[1]);
-    if (!arrayEqual(leftTopPoint1, leftTopPoint2)) {
-        const centerX = leftTopPoint1[0];
-        const centerY = leftTopPoint1[1] + _cornerRadius[0];
-        edgeCb && edgeCb[3] && path.moveTo(leftTopPoint2[0], leftTopPoint2[1]);
-        path.arc(centerX, centerY, _cornerRadius[0], pi, pi + halfPi, false);
+    if (!roundCorner) {
+        edgeCb && edgeCb[0]
+            ? edgeCb[0](leftTopPoint1[0], leftTopPoint1[1], rightTopPoint1[0], rightTopPoint1[1])
+            : path.lineTo(rightTopPoint1[0], rightTopPoint1[1]);
+        edgeCb && edgeCb[1]
+            ? edgeCb[1](rightTopPoint1[0], rightTopPoint1[1], rightBottomPoint1[0], rightBottomPoint1[1])
+            : path.lineTo(rightBottomPoint1[0], rightBottomPoint1[1]);
+        edgeCb && edgeCb[2]
+            ? edgeCb[2](rightBottomPoint1[0], rightBottomPoint1[1], leftBottomPoint1[0], leftBottomPoint1[1])
+            : path.lineTo(leftBottomPoint1[0], leftBottomPoint1[1]);
+        edgeCb && edgeCb[2]
+            ? edgeCb[2](leftBottomPoint1[0], leftBottomPoint1[1], leftTopPoint1[0], leftTopPoint1[1])
+            : path.lineTo(leftTopPoint1[0], leftTopPoint1[1]);
+    }
+    else {
+        edgeCb && edgeCb[0]
+            ? edgeCb[0](leftTopPoint1[0], leftTopPoint1[1], rightTopPoint1[0], rightTopPoint1[1])
+            : path.lineTo(rightTopPoint1[0], rightTopPoint1[1]);
+        if (!arrayEqual(rightTopPoint1, rightTopPoint2)) {
+            edgeCb && edgeCb[0] && path.moveTo(rightTopPoint1[0], rightTopPoint1[1]);
+            const centerX = rightTopPoint1[0];
+            const centerY = rightTopPoint1[1] + _cornerRadius[1];
+            path.arc(centerX, centerY, _cornerRadius[1], -halfPi, 0, false);
+        }
+        edgeCb && edgeCb[1]
+            ? edgeCb[1](rightTopPoint2[0], rightTopPoint2[1], rightBottomPoint2[0], rightBottomPoint2[1])
+            : path.lineTo(rightBottomPoint2[0], rightBottomPoint2[1]);
+        if (!arrayEqual(rightBottomPoint1, rightBottomPoint2)) {
+            const centerX = rightBottomPoint2[0] - _cornerRadius[2];
+            const centerY = rightBottomPoint2[1];
+            edgeCb && edgeCb[1] && path.moveTo(rightBottomPoint2[0], rightBottomPoint2[1]);
+            path.arc(centerX, centerY, _cornerRadius[2], 0, halfPi, false);
+        }
+        edgeCb && edgeCb[2]
+            ? edgeCb[2](rightBottomPoint1[0], rightBottomPoint1[1], leftBottomPoint1[0], leftBottomPoint1[1])
+            : path.lineTo(leftBottomPoint1[0], leftBottomPoint1[1]);
+        if (!arrayEqual(leftBottomPoint1, leftBottomPoint2)) {
+            const centerX = leftBottomPoint1[0];
+            const centerY = leftBottomPoint1[1] - _cornerRadius[3];
+            edgeCb && edgeCb[2] && path.moveTo(leftBottomPoint1[0], leftBottomPoint1[1]);
+            path.arc(centerX, centerY, _cornerRadius[3], halfPi, pi, false);
+        }
+        edgeCb && edgeCb[3]
+            ? edgeCb[3](leftBottomPoint2[0], leftBottomPoint2[1], leftTopPoint2[0], leftTopPoint2[1])
+            : path.lineTo(leftTopPoint2[0], leftTopPoint2[1]);
+        if (!arrayEqual(leftTopPoint1, leftTopPoint2)) {
+            const centerX = leftTopPoint1[0];
+            const centerY = leftTopPoint1[1] + _cornerRadius[0];
+            edgeCb && edgeCb[3] && path.moveTo(leftTopPoint2[0], leftTopPoint2[1]);
+            path.arc(centerX, centerY, _cornerRadius[0], pi, pi + halfPi, false);
+        }
     }
     !edgeCb && path.closePath();
     return path;
@@ -20415,7 +20466,7 @@ class DefaultRectRenderContribution {
         if (!(doOuterBorder || doInnerBorder)) {
             return;
         }
-        const { cornerRadius = rectAttribute.cornerRadius, opacity = rectAttribute.opacity, x: originX = rectAttribute.x, y: originY = rectAttribute.y, scaleX = rectAttribute.scaleX, scaleY = rectAttribute.scaleY, x1, y1, keepStrokeScale = rectAttribute.keepStrokeScale } = rect.attribute;
+        const { cornerRadius = rectAttribute.cornerRadius, cornerType = rectAttribute.cornerType, opacity = rectAttribute.opacity, x: originX = rectAttribute.x, y: originY = rectAttribute.y, scaleX = rectAttribute.scaleX, scaleY = rectAttribute.scaleY, x1, y1, keepStrokeScale = rectAttribute.keepStrokeScale } = rect.attribute;
         let { width, height } = rect.attribute;
         width = (width !== null && width !== void 0 ? width : x1 - x) || 0;
         height = (height !== null && height !== void 0 ? height : y1 - y) || 0;
@@ -20433,7 +20484,7 @@ class DefaultRectRenderContribution {
             }
             else {
                 context.beginPath();
-                createRectPath(context, nextX, nextY, width - sign * dw, height - sign * dw, cornerRadius);
+                createRectPath(context, nextX, nextY, width - sign * dw, height - sign * dw, cornerRadius, cornerType === 'round');
             }
             context.setShadowBlendStyle && context.setShadowBlendStyle(rect, rect.attribute, rectAttribute);
             if (strokeCb) {
@@ -20474,7 +20525,7 @@ let SplitRectAfterRenderContribution = class SplitRectAfterRenderContribution {
         this.order = 0;
     }
     drawShape(rect, context, x, y, doFill, doStroke, fVisible, sVisible, groupAttribute, drawContext, fillCb, strokeCb) {
-        const { x1, y1, x: originX = groupAttribute.x, y: originY = groupAttribute.y, stroke = groupAttribute.stroke, cornerRadius = groupAttribute.cornerRadius } = rect.attribute;
+        const { x1, y1, x: originX = groupAttribute.x, y: originY = groupAttribute.y, stroke = groupAttribute.stroke, cornerRadius = groupAttribute.cornerRadius, cornerType = groupAttribute.cornerType } = rect.attribute;
         let { width, height } = rect.attribute;
         width = (width !== null && width !== void 0 ? width : x1 - originX) || 0;
         height = (height !== null && height !== void 0 ? height : y1 - originY) || 0;
@@ -20485,7 +20536,7 @@ let SplitRectAfterRenderContribution = class SplitRectAfterRenderContribution {
         if (!(cornerRadius === 0 || (isArray(cornerRadius) && cornerRadius.every(num => num === 0)))) {
             let lastStrokeI = 0;
             let lastStroke;
-            createRectPath(context, x, y, width, height, cornerRadius, new Array(4).fill(0).map((_, i) => (x1, y1, x2, y2) => {
+            createRectPath(context, x, y, width, height, cornerRadius, cornerType === 'round', new Array(4).fill(0).map((_, i) => (x1, y1, x2, y2) => {
                 if (stroke[i]) {
                     if (!(lastStrokeI === i - 1 && stroke[i] === lastStroke)) {
                         context.setStrokeStyle(rect, Object.assign(Object.assign({}, rect.attribute), { stroke: stroke[i] }), x, y, groupAttribute);
@@ -20560,7 +20611,7 @@ class DefaultImageBackgroundRenderContribution extends DefaultBaseBackgroundRend
                 context.beginPath();
                 const { x, y, width, height } = getActualPosition(graphic);
                 if (cornerRadius) {
-                    createRectPath(context, x - expandX, y - expandY, width + expandX * 2, height + expandY * 2, cornerRadius);
+                    createRectPath(context, x - expandX, y - expandY, width + expandX * 2, height + expandY * 2, cornerRadius, true);
                 }
                 else {
                     context.rect(x - expandX, y - expandY, width + expandX * 2, height + expandY * 2);
@@ -22219,7 +22270,7 @@ let DefaultCanvasRectRender = class DefaultCanvasRectRender extends BaseRender {
     drawShape(rect, context, x, y, drawContext, params, fillCb, strokeCb) {
         var _a;
         const rectAttribute = (_a = this.tempTheme) !== null && _a !== void 0 ? _a : getTheme(rect, params === null || params === void 0 ? void 0 : params.theme).rect;
-        const { fill = rectAttribute.fill, background, stroke = rectAttribute.stroke, cornerRadius = rectAttribute.cornerRadius, opacity = rectAttribute.opacity, fillOpacity = rectAttribute.fillOpacity, lineWidth = rectAttribute.lineWidth, strokeOpacity = rectAttribute.strokeOpacity, visible = rectAttribute.visible, x1, y1, x: originX = rectAttribute.x, y: originY = rectAttribute.y, fillStrokeOrder = rectAttribute.fillStrokeOrder } = rect.attribute;
+        const { fill = rectAttribute.fill, background, stroke = rectAttribute.stroke, cornerRadius = rectAttribute.cornerRadius, cornerType = rectAttribute.cornerType, opacity = rectAttribute.opacity, fillOpacity = rectAttribute.fillOpacity, lineWidth = rectAttribute.lineWidth, strokeOpacity = rectAttribute.strokeOpacity, visible = rectAttribute.visible, x1, y1, x: originX = rectAttribute.x, y: originY = rectAttribute.y, fillStrokeOrder = rectAttribute.fillStrokeOrder } = rect.attribute;
         let { width, height } = rect.attribute;
         width = (width !== null && width !== void 0 ? width : x1 - originX) || 0;
         height = (height !== null && height !== void 0 ? height : y1 - originY) || 0;
@@ -22242,7 +22293,7 @@ let DefaultCanvasRectRender = class DefaultCanvasRectRender extends BaseRender {
         }
         else {
             context.beginPath();
-            createRectPath(context, x, y, width, height, cornerRadius);
+            createRectPath(context, x, y, width, height, cornerRadius, cornerType === 'round');
         }
         const doFillOrStroke = {
             doFill,
@@ -22542,7 +22593,7 @@ class DefaultTextBackgroundRenderContribution extends DefaultBaseBackgroundRende
             context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute);
             context.fillStyle = background;
             if (backgroundCornerRadius) {
-                createRectPath(context, b.x1, b.y1, b.width(), b.height(), backgroundCornerRadius);
+                createRectPath(context, b.x1, b.y1, b.width(), b.height(), backgroundCornerRadius, true);
                 context.fill();
             }
             else {
@@ -22912,7 +22963,7 @@ let DefaultCanvasGroupRender = class DefaultCanvasGroupRender {
     }
     drawShape(group, context, x, y, drawContext, params, fillCb, strokeCb) {
         const groupAttribute = getTheme(group, params === null || params === void 0 ? void 0 : params.theme).group;
-        const { fill = groupAttribute.fill, background, stroke = groupAttribute.stroke, opacity = groupAttribute.opacity, width = groupAttribute.width, height = groupAttribute.height, clip = groupAttribute.clip, fillOpacity = groupAttribute.fillOpacity, strokeOpacity = groupAttribute.strokeOpacity, cornerRadius = groupAttribute.cornerRadius, path = groupAttribute.path, lineWidth = groupAttribute.lineWidth, visible = groupAttribute.visible, fillStrokeOrder = groupAttribute.fillStrokeOrder, x: originX = groupAttribute.x, y: originY = groupAttribute.y } = group.attribute;
+        const { fill = groupAttribute.fill, background, stroke = groupAttribute.stroke, opacity = groupAttribute.opacity, width = groupAttribute.width, height = groupAttribute.height, clip = groupAttribute.clip, fillOpacity = groupAttribute.fillOpacity, strokeOpacity = groupAttribute.strokeOpacity, cornerRadius = groupAttribute.cornerRadius, path = groupAttribute.path, lineWidth = groupAttribute.lineWidth, visible = groupAttribute.visible, fillStrokeOrder = groupAttribute.fillStrokeOrder, cornerType = groupAttribute.cornerType, x: originX = groupAttribute.x, y: originY = groupAttribute.y } = group.attribute;
         const fVisible = rectFillVisible(opacity, fillOpacity, width, height, fill);
         const sVisible = rectStrokeVisible(opacity, strokeOpacity, width, height);
         const doFill = runFill(fill, background);
@@ -22949,7 +23000,7 @@ let DefaultCanvasGroupRender = class DefaultCanvasGroupRender {
         }
         else {
             context.beginPath();
-            createRectPath(context, x, y, width, height, cornerRadius);
+            createRectPath(context, x, y, width, height, cornerRadius, cornerType === 'round');
         }
         if (!this._groupRenderContribitions) {
             this._groupRenderContribitions = this.groupRenderContribitions.getContributions() || [];
@@ -23096,7 +23147,7 @@ let DefaultCanvasImageRender = class DefaultCanvasImageRender extends BaseRender
     }
     drawShape(image, context, x, y, drawContext, params, fillCb, strokeCb) {
         const imageAttribute = getTheme(image).image;
-        const { width = imageAttribute.width, height = imageAttribute.height, repeatX = imageAttribute.repeatX, repeatY = imageAttribute.repeatY, x: originX = imageAttribute.x, y: originY = imageAttribute.y, cornerRadius = imageAttribute.cornerRadius, fillStrokeOrder = imageAttribute.fillStrokeOrder, image: url } = image.attribute;
+        const { width = imageAttribute.width, height = imageAttribute.height, repeatX = imageAttribute.repeatX, repeatY = imageAttribute.repeatY, x: originX = imageAttribute.x, y: originY = imageAttribute.y, cornerRadius = imageAttribute.cornerRadius, fillStrokeOrder = imageAttribute.fillStrokeOrder, cornerType = imageAttribute.cornerType, image: url } = image.attribute;
         const data = this.valid(image, imageAttribute, fillCb);
         if (!data) {
             return;
@@ -23121,7 +23172,7 @@ let DefaultCanvasImageRender = class DefaultCanvasImageRender extends BaseRender
                     if (cornerRadius === 0 || (isArray(cornerRadius) && cornerRadius.every(num => num === 0))) ;
                     else {
                         context.beginPath();
-                        createRectPath(context, x, y, width, height, cornerRadius);
+                        createRectPath(context, x, y, width, height, cornerRadius, cornerType === 'round');
                         context.save();
                         context.clip();
                         needRestore = true;
@@ -28024,7 +28075,7 @@ let DefaultCanvasRichTextRender = class DefaultCanvasRichTextRender extends Base
             }
             else {
                 context.beginPath();
-                createRectPath(context, x - expandX, y - expandY, backgroundWidth, backgroundHeight, backgroundRadius);
+                createRectPath(context, x - expandX, y - expandY, backgroundWidth, backgroundHeight, backgroundRadius, true);
             }
             if (backgroundFill) {
                 context.globalAlpha = backgroundFillOpacity;

package/es/animate/custom-animate.js

@@ -153,37 +153,26 @@ export class InputText extends ACustomAnimate {
         };
     }
     onBind() {
-        var _a, _b, _c, _d;
-        if (this.fromText = null !== (_b = null === (_a = this.from) || void 0 === _a ? void 0 : _a.text) && void 0 !== _b ? _b : "", 
-        this.toText = null !== (_d = null === (_c = this.to) || void 0 === _c ? void 0 : _c.text) && void 0 !== _d ? _d : "", 
-        !this.toText || isArray(this.toText)) this.valid = !1; else {
-            this.toText = this.toText.toString();
-            const root = this.target.attachShadow(), line = application.graphicService.creator.line({
-                x: 0,
-                y: 0,
-                points: [ {
-                    x: 0,
-                    y: 0
-                }, {
-                    x: 0,
-                    y: this.target.getComputedAttribute("fontSize")
-                } ],
-                stroke: "black",
-                lineWidth: 1
-            });
-            root.add(line);
-        }
+        var _a, _b, _c;
+        this.fromText = null !== (_b = null === (_a = this.from) || void 0 === _a ? void 0 : _a.text) && void 0 !== _b ? _b : "", 
+        this.toText = (null === (_c = this.to) || void 0 === _c ? void 0 : _c.text) || "", 
+        (!this.toText || isArray(this.toText) && 0 === this.toText.length) && (this.valid = !1), 
+        isArray(this.toText) && (this.toText = this.toText.map((item => (item || "").toString())));
     }
     onEnd() {
         this.target.detachShadow();
     }
     onUpdate(end, ratio, out) {
-        var _a;
         if (!1 === this.valid) return;
-        const fromCount = this.fromText.length, toCount = this.toText.length, count = Math.ceil(fromCount + (toCount - fromCount) * ratio);
-        out.text = this.toText.substr(0, count);
-        const line = null === (_a = this.target.shadowRoot) || void 0 === _a ? void 0 : _a.at(0), endX = this.target.clipedWidth + 2;
-        line.setAttribute("x", endX);
+        const fromCount = this.fromText.length, toTextIsArray = isArray(this.toText), toCount = toTextIsArray ? this.toText.reduce(((c, t) => c + (t || "").length), 0) : this.toText.length, count = Math.ceil(fromCount + (toCount - fromCount) * ratio);
+        if (toTextIsArray) {
+            out.text = [];
+            let len = 0;
+            this.toText.forEach((t => {
+                len + t.length > count ? (out.text.push(t.substr(0, count - len)), len = count) : (out.text.push(t), 
+                len += t.length);
+            }));
+        } else out.text = this.toText.substr(0, count);
     }
 }