@remotion/shapes 3.3.78 → 3.3.79

package/dist/utils/join-points.d.ts

@@ -1,8 +1,5 @@
 import type { Instruction } from '@remotion/paths';
-export declare const joinPoints: (points: [
-    number,
-    number
-][], { edgeRoundness, cornerRadius, roundCornerStrategy, }: {
+export declare const joinPoints: (points: [number, number][], { edgeRoundness, cornerRadius, roundCornerStrategy, }: {
     edgeRoundness: number | null;
     cornerRadius: number;
     roundCornerStrategy: 'arc' | 'bezier';

package/dist/utils/join-points.js

@@ -25,6 +25,8 @@ const joinPoints = (points, { edgeRoundness, cornerRadius, roundCornerStrategy,
             (x + prevPoint[0]) / 2,
             (y + prevPoint[1]) / 2,
         ];
+        const prevVector = [x - prevPoint[0], y - prevPoint[1]];
+        const nextVector = [nextPoint[0] - x, nextPoint[1] - y];
         if (i === 0) {
             if (edgeRoundness !== null) {
                 return [
@@ -35,6 +37,16 @@ const joinPoints = (points, { edgeRoundness, cornerRadius, roundCornerStrategy,
                     },
                 ];
             }
+            if (cornerRadius !== 0) {
+                const computeRadius = shortenVector(nextVector, cornerRadius);
+                return [
+                    {
+                        type: 'M',
+                        x: computeRadius[0] + x,
+                        y: computeRadius[1] + y,
+                    }
+                ];
+            }
             return [
                 {
                     type: 'M',
@@ -43,8 +55,6 @@ const joinPoints = (points, { edgeRoundness, cornerRadius, roundCornerStrategy,
                 },
             ];
         }
-        const prevVector = [x - prevPoint[0], y - prevPoint[1]];
-        const nextVector = [nextPoint[0] - x, nextPoint[1] - y];
         if (cornerRadius && edgeRoundness !== null) {
             throw new Error(`"cornerRadius" and "edgeRoundness" cannot be specified at the same time.`);
         }
@@ -59,7 +69,7 @@ const joinPoints = (points, { edgeRoundness, cornerRadius, roundCornerStrategy,
                 ];
             }
             const prevVectorMinusRadius = shortenVector(prevVector, cornerRadius);
-            const prevVectorLenght = scaleVectorToLength(prevVector, cornerRadius);
+            const prevVectorLength = scaleVectorToLength(prevVector, cornerRadius);
             const nextVectorMinusRadius = scaleVectorToLength(nextVector, cornerRadius);
             const firstDraw = [
                 prevPoint[0] + prevVectorMinusRadius[0],
@@ -77,15 +87,15 @@ const joinPoints = (points, { edgeRoundness, cornerRadius, roundCornerStrategy,
                         rx: cornerRadius,
                         ry: cornerRadius,
                         xAxisRotation: 0,
-                        dx: prevVectorLenght[0] + nextVectorMinusRadius[0],
-                        dy: prevVectorLenght[1] + nextVectorMinusRadius[1],
+                        dx: prevVectorLength[0] + nextVectorMinusRadius[0],
+                        dy: prevVectorLength[1] + nextVectorMinusRadius[1],
                         largeArcFlag: false,
                         sweepFlag: true,
                     }
                     : {
                         type: 'C',
-                        x: firstDraw[0] + prevVectorLenght[0] + nextVectorMinusRadius[0],
-                        y: firstDraw[1] + prevVectorLenght[1] + nextVectorMinusRadius[1],
+                        x: firstDraw[0] + prevVectorLength[0] + nextVectorMinusRadius[0],
+                        y: firstDraw[1] + prevVectorLength[1] + nextVectorMinusRadius[1],
                         cp1x: x,
                         cp1y: y,
                         cp2x: x,

package/dist/utils/make-rect.js

@@ -15,7 +15,7 @@ const makeRect = ({ width, height, edgeRoundness = null, cornerRadius = 0, }) =>
     const transformOrigin = [width / 2, height / 2];
     const instructions = [
         ...(0, join_points_1.joinPoints)([
-            [0, 0],
+            [cornerRadius, 0],
             [width, 0],
             [width, height],
             [0, height],

package/dist/utils/make-triangle.js

@@ -13,6 +13,9 @@ const join_points_1 = require("./join-points");
  * @see [Documentation](https://www.remotion.dev/docs/shapes/make-triangle)
  */
 const makeTriangle = ({ length, direction = 'right', edgeRoundness = null, cornerRadius = 0, }) => {
+    if (typeof length !== 'number') {
+        throw new Error(`"length" of a triangle must be a number, got ${JSON.stringify(length)}`);
+    }
     const longerDimension = length;
     const shorterSize = Math.sqrt(length ** 2 * 0.75); // Calculated on paper;
     const points = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/shapes",
-  "version": "3.3.78",
+  "version": "3.3.79",
   "description": "Utility functions and components for SVG shapes",
   "main": "dist/index.js",
   "sideEffects": false,
@@ -39,7 +39,7 @@
     "react-dom": ">=16.8.0"
   },
   "dependencies": {
-    "@remotion/paths": "3.3.78"
+    "@remotion/paths": "3.3.79"
   },
   "scripts": {
     "lint": "eslint src --ext ts,tsx",