@remotion/shapes - npm Package Compare versions

Comparing version 4.0.0-newpaths.14 to 4.0.0-newpaths.40

dist/components/render-svg.d.ts

@@ -0,3 +1,3 @@
+import type { Instruction } from '@remotion/paths/dist/helpers/types';
 import React from 'react';
-import type { Instruction } from '../utils/instructions';
 export declare type AllShapesProps = Omit<React.SVGProps<SVGPathElement>, 'width' | 'height' | 'd'> & {
@@ -4,0 +4,0 @@ debug?: boolean;

dist/components/render-svg.js

@@ -25,3 +25,15 @@ "use strict";
                             : instructions[index - 1];
-                        if (prevInstruction.type === 'z') {
+                        if (prevInstruction.type === 'V' ||
+                            prevInstruction.type === 'H' ||
+                            prevInstruction.type === 'a' ||
+                            prevInstruction.type === 'z' ||
+                            prevInstruction.type === 'Z' ||
+                            prevInstruction.type === 't' ||
+                            prevInstruction.type === 'q' ||
+                            prevInstruction.type === 'l' ||
+                            prevInstruction.type === 'c' ||
+                            prevInstruction.type === 'm' ||
+                            prevInstruction.type === 'h' ||
+                            prevInstruction.type === 's' ||
+                            prevInstruction.type === 'v') {
                             return null;
@@ -28,0 +40,0 @@ }

dist/index.d.ts

@@ -0,1 +1,2 @@
+export { Instruction } from '@remotion/paths';
 export { Circle, CircleProps } from './components/circle';
@@ -7,3 +8,2 @@ export { Ellipse, EllipseProps } from './components/ellipse';
 export { Triangle, TriangleProps } from './components/triangle';
-export { Instruction } from './utils/instructions';
 export { makeCircle, MakeCircleProps } from './utils/make-circle';
@@ -10,0 +10,0 @@ export { makeEllipse, MakeEllipseOptions } from './utils/make-ellipse';

dist/make-circle.d.ts

 export declare type MakeCircleProps = {
-    cx?: number | string;
-    cy?: number | string;
-    radius?: number | string;
+    radius: number;
 };
-export declare const makeCircle: ({ cx, cy, radius, }: MakeCircleProps) => string;
+export declare const makeCircle: ({ radius }: MakeCircleProps) => string;

dist/make-circle.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeCircle = void 0;
-const makeCircle = ({ cx = 50, cy = 50, radius = 50, }) => {
+const makeCircle = ({ radius }) => {
+    const cx = radius;
+    const cy = radius;
     return `M ${cx} ${cy} m -${radius} 0 a ${radius} ${radius} 0 1 0 ${radius * 2} 0 ${radius} ${radius} 0 1 0 ${-radius * 2} 0`;
 };
 exports.makeCircle = makeCircle;

dist/make-ellipse.d.ts

 export declare type MakeEllipseOptions = {
-    rx?: number | string;
-    ry?: number | string;
+    rx: number;
+    ry: number;
 };
 export declare const makeEllipse: ({ rx, ry }: MakeEllipseOptions) => string;

dist/make-rect.d.ts

 export declare type MakeRectOptions = {
-    x?: number;
-    y?: number;
     width: number;
     height: number;
 };
-export declare const makeRect: ({ x, y, width, height }: MakeRectOptions) => string;
+export declare const makeRect: ({ width, height }: MakeRectOptions) => string;

dist/make-rect.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeRect = void 0;
-const makeRect = ({ x = 0, y = 0, width, height }) => {
+const makeRect = ({ width, height }) => {
+    const x = 0;
+    const y = 0;
     return `M ${x} ${y} l ${width} 0 l 0 ${height} l ${-width} 0 Z`;
 };
 exports.makeRect = makeRect;

dist/utils/instructions.d.ts

@@ -1,39 +0,3 @@
-export declare type Instruction = {
-    type: 'M';
-    x: number;
-    y: number;
-} | {
-    type: 'L';
-    x: number;
-    y: number;
-} | {
-    type: 'C';
-    cp1x: number;
-    cp1y: number;
-    cp2x: number;
-    cp2y: number;
-    x: number;
-    y: number;
-} | {
-    type: 'a';
-    rx: number;
-    ry: number;
-    xAxisRotation: number;
-    largeArcFlag: boolean;
-    sweepFlag: boolean;
-    x: number;
-    y: number;
-} | {
-    type: 'A';
-    rx: number;
-    ry: number;
-    xAxisRotation: number;
-    largeArcFlag: boolean;
-    sweepFlag: boolean;
-    x: number;
-    y: number;
-} | {
-    type: 'z';
-};
+import type { Instruction } from '@remotion/paths';
 export declare const serializeInstructions: (instructions: Instruction[]) => string;
 export declare const serializeInstruction: (instruction: Instruction) => string;

dist/utils/join-points.d.ts

@@ -1,6 +0,3 @@
-import type { Instruction } from './instructions';
-export declare const joinPoints: (points: [
-    number,
-    number
-][], { edgeRoundness, cornerRadius, roundCornerStrategy, }: {
+import type { Instruction } from '@remotion/paths';
+export declare const joinPoints: (points: [number, number][], { edgeRoundness, cornerRadius, roundCornerStrategy, }: {
     edgeRoundness: number | null;
@@ -7,0 +4,0 @@ cornerRadius: number;

dist/utils/join-points.js

@@ -30,13 +30,17 @@ "use strict";
             if (edgeRoundness !== null) {
-                return {
+                return [
+                    {
+                        type: 'M',
+                        x: middleOfLine[0],
+                        y: middleOfLine[1],
+                    },
+                ];
+            }
+            return [
+                {
                     type: 'M',
-                    x: middleOfLine[0],
-                    y: middleOfLine[1],
-                };
-            }
-            return {
-                type: 'M',
-                x,
-                y,
-            };
+                    x,
+                    y,
+                },
+            ];
         }
@@ -50,7 +54,9 @@ const prevVector = [x - prevPoint[0], y - prevPoint[1]];
             if (cornerRadius === 0) {
-                return {
-                    type: 'L',
-                    x,
-                    y,
-                };
+                return [
+                    {
+                        type: 'L',
+                        x,
+                        y,
+                    },
+                ];
             }
@@ -76,4 +82,4 @@ const prevVectorMinusRadius = shortenVector(prevVector, cornerRadius);
                         xAxisRotation: 0,
-                        x: prevVectorLenght[0] + nextVectorMinusRadius[0],
-                        y: prevVectorLenght[1] + nextVectorMinusRadius[1],
+                        dx: prevVectorLenght[0] + nextVectorMinusRadius[0],
+                        dy: prevVectorLenght[1] + nextVectorMinusRadius[1],
                         largeArcFlag: false,
@@ -101,11 +107,13 @@ sweepFlag: true,
         ];
-        return {
-            type: 'C',
-            cp1x: controlPoint1[0],
-            cp1y: controlPoint1[1],
-            cp2x: controlPoint2[0],
-            cp2y: controlPoint2[1],
-            x: middleOfLine[0],
-            y: middleOfLine[1],
-        };
+        return [
+            {
+                type: 'C',
+                cp1x: controlPoint1[0],
+                cp1y: controlPoint1[1],
+                cp2x: controlPoint2[0],
+                cp2y: controlPoint2[1],
+                x: middleOfLine[0],
+                y: middleOfLine[1],
+            },
+        ];
     })
@@ -112,0 +120,0 @@ .flat(1);

dist/utils/make-circle.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeCircle = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const makeCircle = ({ radius }) => {
@@ -19,4 +19,4 @@ const instructions = [
             sweepFlag: false,
-            x: radius * 2,
-            y: 0,
+            dx: radius * 2,
+            dy: 0,
         },
@@ -30,4 +30,4 @@ {
             sweepFlag: false,
-            x: -radius * 2,
-            y: 0,
+            dx: -radius * 2,
+            dy: 0,
         },
@@ -38,3 +38,3 @@ {
     ];
-    const path = (0, instructions_1.serializeInstructions)(instructions);
+    const path = (0, paths_1.serializeInstructions)(instructions);
     return {
@@ -41,0 +41,0 @@ height: radius * 2,

dist/utils/make-ellipse.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeEllipse = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const makeEllipse = ({ rx, ry }) => {
@@ -19,4 +19,4 @@ const instructions = [
             sweepFlag: false,
-            x: 1,
-            y: 0,
+            dx: 1,
+            dy: 0,
         },
@@ -27,3 +27,3 @@ {
     ];
-    const path = (0, instructions_1.serializeInstructions)(instructions);
+    const path = (0, paths_1.serializeInstructions)(instructions);
     return {
@@ -30,0 +30,0 @@ width: rx * 2,

dist/utils/make-pie.d.ts

@@ -1,2 +0,2 @@
-import type { Instruction } from './instructions';
+import type { Instruction } from '@remotion/paths';
 export declare type MakePieProps = {
@@ -3,0 +3,0 @@ radius: number;

dist/utils/make-pie.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makePie = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const getCoord = ({ counterClockwise, actualProgress, rotation, radius, coord, }) => {
@@ -101,3 +101,3 @@ const factor = counterClockwise ? -1 : 1;
     ].filter(Boolean);
-    const path = (0, instructions_1.serializeInstructions)(instructions);
+    const path = (0, paths_1.serializeInstructions)(instructions);
     return {
@@ -104,0 +104,0 @@ height: radius * 2,

dist/utils/make-rect.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeRect = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const join_points_1 = require("./join-points");
@@ -20,3 +20,3 @@ const makeRect = ({ width, height, edgeRoundness = null, cornerRadius = 0, }) => {
     ];
-    const path = (0, instructions_1.serializeInstructions)(instructions);
+    const path = (0, paths_1.serializeInstructions)(instructions);
     return {
@@ -23,0 +23,0 @@ width,

dist/utils/make-star.js

@@ -5,3 +5,3 @@ "use strict";
 exports.makeStar = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const join_points_1 = require("./join-points");
@@ -43,3 +43,3 @@ const star = ({ centerX, centerY, points, innerRadius, outerRadius, cornerRadius, edgeRoundness, }) => {
     return {
-        path: (0, instructions_1.serializeInstructions)(starPathInstructions),
+        path: (0, paths_1.serializeInstructions)(starPathInstructions),
         width,
@@ -46,0 +46,0 @@ height,

dist/utils/make-triangle.js

@@ -5,3 +5,3 @@ "use strict";
 exports.makeTriangle = void 0;
-const instructions_1 = require("./instructions");
+const paths_1 = require("@remotion/paths");
 const join_points_1 = require("./join-points");
@@ -59,3 +59,3 @@ const makeTriangle = ({ length, direction = 'right', edgeRoundness = null, cornerRadius = 0, }) => {
     ];
-    const path = (0, instructions_1.serializeInstructions)(instructions);
+    const path = (0, paths_1.serializeInstructions)(instructions);
     return {
@@ -62,0 +62,0 @@ path,

dist/utils/shape-info.d.ts

@@ -1,2 +0,2 @@
-import type { Instruction } from './instructions';
+import type { Instruction } from '@remotion/paths';
 export declare type ShapeInfo = {
@@ -3,0 +3,0 @@ path: string;

package.json

 {
 	"name": "@remotion/shapes",
-	"version": "4.0.0-newpaths.14+37718626b",
+	"version": "4.0.0-newpaths.40+09405cced",
 	"description": "Utility functions and components for SVG shapes",
@@ -47,3 +47,6 @@ "main": "dist/index.js",
 	},
-	"gitHead": "37718626b7dbf0248bf5a6aa08928030554bdb10"
+	"dependencies": {
+		"@remotion/paths": "4.0.0-newpaths.40+09405cced"
+	},
+	"gitHead": "09405cced148038402b72b568f349e0bc7bbb949"
 }

New alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Fixed alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

40740

increased by2.34%

Number of package files

59

increased by3.51%

Lines of code

969

increased by0.52%

Worsened metrics

Dependency count

3

increased by50%

Dependency changes

• + Added@remotion/paths@4.0.0-newpaths.40+09405cced