@remotion/shapes - npm Package Compare versions

Comparing version 3.3.37 to 3.3.38

dist/components/render-svg.js

@@ -25,2 +25,5 @@ "use strict";
                             : instructions[index - 1];
+                        if (prevInstruction.type === 'z') {
+                            return null;
+                        }
                         const prevX = prevInstruction.x;
@@ -27,0 +30,0 @@ const prevY = prevInstruction.y;

dist/index.d.ts

 export { Circle, CircleProps } from './components/circle';
 export { Ellipse, EllipseProps } from './components/ellipse';
+export { Pie, PieProps } from './components/pie';
 export { Rect, RectProps } from './components/rect';
@@ -9,4 +10,5 @@ export { Star, StarProps } from './components/star';
 export { makeEllipse, MakeEllipseOptions } from './utils/make-ellipse';
+export { makePie, MakePieProps } from './utils/make-pie';
 export { makeRect, MakeRectOptions } from './utils/make-rect';
 export { makeStar, MakeStarProps } from './utils/make-star';
 export { makeTriangle, MakeTriangleProps } from './utils/make-triangle';

dist/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeTriangle = exports.makeStar = exports.makeRect = exports.makeEllipse = exports.makeCircle = exports.Triangle = exports.Star = exports.Rect = exports.Ellipse = exports.Circle = void 0;
+exports.makeTriangle = exports.makeStar = exports.makeRect = exports.makePie = exports.makeEllipse = exports.makeCircle = exports.Triangle = exports.Star = exports.Rect = exports.Pie = exports.Ellipse = exports.Circle = void 0;
 var circle_1 = require("./components/circle");
@@ -8,2 +8,4 @@ Object.defineProperty(exports, "Circle", { enumerable: true, get: function () { return circle_1.Circle; } });
 Object.defineProperty(exports, "Ellipse", { enumerable: true, get: function () { return ellipse_1.Ellipse; } });
+var pie_1 = require("./components/pie");
+Object.defineProperty(exports, "Pie", { enumerable: true, get: function () { return pie_1.Pie; } });
 var rect_1 = require("./components/rect");
@@ -19,2 +21,4 @@ Object.defineProperty(exports, "Rect", { enumerable: true, get: function () { return rect_1.Rect; } });
 Object.defineProperty(exports, "makeEllipse", { enumerable: true, get: function () { return make_ellipse_1.makeEllipse; } });
+var make_pie_1 = require("./utils/make-pie");
+Object.defineProperty(exports, "makePie", { enumerable: true, get: function () { return make_pie_1.makePie; } });
 var make_rect_1 = require("./utils/make-rect");
@@ -21,0 +25,0 @@ Object.defineProperty(exports, "makeRect", { enumerable: true, get: function () { return make_rect_1.makeRect; } });

dist/make-circle.d.ts

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

dist/make-circle.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeCircle = void 0;
-const makeCircle = ({ radius }) => {
-    const cx = radius;
-    const cy = radius;
+const makeCircle = ({ cx = 50, cy = 50, radius = 50, }) => {
     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;
-    ry: number;
+    rx?: number | string;
+    ry?: number | string;
 };
 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: ({ width, height }: MakeRectOptions) => string;
+export declare const makeRect: ({ x, y, width, height }: MakeRectOptions) => string;

dist/make-rect.js

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

dist/utils/instructions.d.ts

@@ -18,7 +18,12 @@ export declare type Instruction = {
 } | {
-    type: 'm';
+    type: 'a';
+    rx: number;
+    ry: number;
+    xAxisRotation: number;
+    largeArcFlag: boolean;
+    sweepFlag: boolean;
     x: number;
     y: number;
 } | {
-    type: 'a';
+    type: 'A';
     rx: number;
@@ -31,4 +36,6 @@ ry: number;
     y: number;
+} | {
+    type: 'z';
 };
 export declare const serializeInstructions: (instructions: Instruction[]) => string;
-export declare const serializeInstruction: (instruction: Instruction) => string | undefined;
+export declare const serializeInstruction: (instruction: Instruction) => string;

dist/utils/instructions.js

@@ -5,3 +5,3 @@ "use strict";
 const serializeInstructions = (instructions) => {
-    return instructions.map(exports.serializeInstruction).join(' ');
+    return instructions.map((i) => (0, exports.serializeInstruction)(i)).join(' ');
 };
@@ -19,9 +19,13 @@ exports.serializeInstructions = serializeInstructions;
     }
-    if (instruction.type === 'm') {
-        return `m ${instruction.x} ${instruction.y}`;
-    }
     if (instruction.type === 'a') {
         return `a ${instruction.rx} ${instruction.ry} ${instruction.xAxisRotation} ${Number(instruction.largeArcFlag)} ${Number(instruction.sweepFlag ? 1 : 0)} ${instruction.x} ${instruction.y}`;
     }
+    if (instruction.type === 'A') {
+        return `A ${instruction.rx} ${instruction.ry} ${instruction.xAxisRotation} ${Number(instruction.largeArcFlag)} ${Number(instruction.sweepFlag ? 1 : 0)} ${instruction.x} ${instruction.y}`;
+    }
+    if (instruction.type === 'z') {
+        return 'z';
+    }
+    throw new Error('not implemented');
 };
 exports.serializeInstruction = serializeInstruction;

dist/utils/make-circle.js

@@ -9,11 +9,6 @@ "use strict";
             type: 'M',
-            x: radius,
+            x: 0,
             y: radius,
         },
         {
-            type: 'm',
-            x: -radius,
-            y: 0,
-        },
-        {
             type: 'a',
@@ -38,2 +33,5 @@ rx: radius,
         },
+        {
+            type: 'z',
+        },
     ];
@@ -40,0 +38,0 @@ const path = (0, instructions_1.serializeInstructions)(instructions);

dist/utils/make-ellipse.js

@@ -22,2 +22,5 @@ "use strict";
         },
+        {
+            type: 'z',
+        },
     ];
@@ -24,0 +27,0 @@ const path = (0, instructions_1.serializeInstructions)(instructions);

dist/utils/make-rect.js

@@ -8,9 +8,14 @@ "use strict";
     const transformOrigin = [width / 2, height / 2];
-    const instructions = (0, join_points_1.joinPoints)([
-        [0, 0],
-        [width, 0],
-        [width, height],
-        [0, height],
-        [0, 0],
-    ], { edgeRoundness, cornerRadius, roundCornerStrategy: 'arc' });
+    const instructions = [
+        ...(0, join_points_1.joinPoints)([
+            [0, 0],
+            [width, 0],
+            [width, height],
+            [0, height],
+            [0, 0],
+        ], { edgeRoundness, cornerRadius, roundCornerStrategy: 'arc' }),
+        {
+            type: 'z',
+        },
+    ];
     const path = (0, instructions_1.serializeInstructions)(instructions);
@@ -17,0 +22,0 @@ return {

dist/utils/make-star.js

@@ -18,7 +18,10 @@ "use strict";
     });
-    return (0, join_points_1.joinPoints)([...d, d[0]], {
-        edgeRoundness,
-        cornerRadius,
-        roundCornerStrategy: cornerRadius > 0 ? 'bezier' : 'arc',
-    });
+    return [
+        ...(0, join_points_1.joinPoints)([...d, d[0]], {
+            edgeRoundness,
+            cornerRadius,
+            roundCornerStrategy: cornerRadius > 0 ? 'bezier' : 'arc',
+        }),
+        { type: 'z' },
+    ];
 };
@@ -25,0 +28,0 @@ const makeStar = ({ points, innerRadius, outerRadius, cornerRadius = 0, edgeRoundness = null, }) => {

dist/utils/make-triangle.js

@@ -48,7 +48,12 @@ "use strict";
     }[direction];
-    const instructions = (0, join_points_1.joinPoints)(points[direction], {
-        edgeRoundness,
-        cornerRadius,
-        roundCornerStrategy: 'bezier',
-    });
+    const instructions = [
+        ...(0, join_points_1.joinPoints)(points[direction], {
+            edgeRoundness,
+            cornerRadius,
+            roundCornerStrategy: 'bezier',
+        }),
+        {
+            type: 'z',
+        },
+    ];
     const path = (0, instructions_1.serializeInstructions)(instructions);
@@ -55,0 +60,0 @@ return {

package.json

 {
 	"name": "@remotion/shapes",
-	"version": "3.3.37",
+	"version": "3.3.38",
 	"description": "Utility functions and components for SVG shapes",
@@ -47,3 +47,3 @@ "main": "dist/index.js",
 	},
-	"gitHead": "ead6bdacc14a9953cae738159c49bf3daf09e9b0"
+	"gitHead": "ac58695e452e58deb5c010f09bcc94d036930e6c"
 }

No alert changes

Worsened metrics

Total package byte prevSize

39789

decreased by-23.07%

Number of package files

57

decreased by-41.24%

Lines of code

964

decreased by-20.92%

No dependency changes