@remotion/shapes 3.3.45 → 3.3.51

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/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/shapes",
-	"version": "3.3.45",
+	"version": "3.3.51",
 	"description": "Utility functions and components for SVG shapes",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -45,7 +45,7 @@
 		"react-dom": ">=16.8.0"
 	},
 	"dependencies": {
-		"@remotion/paths": "3.3.45"
+		"@remotion/paths": "3.3.51"
 	},
-	"gitHead": "75c028236b43ff2fd0f3f3772f9f79cfde069e36"
+	"gitHead": "be64134aece51abd6c63e644702517c868d6c8d0"
 }

package/dist/Ellipse.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-export declare type EllipseProps = React.SVGProps<SVGPathElement> & {
-    rx: number;
-    ry: number;
-    fill?: string;
-    stroke?: string;
-    strokeWidth?: number;
-    style?: React.CSSProperties;
-};
-export declare const Ellipse: React.FC<EllipseProps>;

package/dist/Ellipse.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Ellipse = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const make_ellipse_1 = require("./make-ellipse");
-const Ellipse = ({ fill, stroke, strokeWidth, rx, ry, style, }) => {
-    return ((0, jsx_runtime_1.jsx)("svg", { width: rx * 2, height: ry * 2, viewBox: `0 0 ${rx * 2} ${ry * 2}`, xmlns: "http://www.w3.org/2000/svg", style: style, "data-shape-type": "ellipse", children: (0, jsx_runtime_1.jsx)("path", { d: (0, make_ellipse_1.makeEllipse)({
-                rx,
-                ry,
-            }), fill: fill, stroke: stroke, strokeWidth: strokeWidth }) }));
-};
-exports.Ellipse = Ellipse;

package/dist/circle.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-export declare type CircleProps = React.SVGProps<SVGPathElement> & {
-    width: number;
-    height: number;
-    fill?: string;
-    stroke?: string;
-    strokeWidth?: number;
-    style?: React.CSSProperties;
-};
-export declare const Circle: React.FC<CircleProps>;

package/dist/circle.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Circle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const make_circle_1 = require("./make-circle");
-const Circle = ({ width, height, fill, stroke, strokeWidth, style, }) => {
-    return ((0, jsx_runtime_1.jsx)("svg", { width: width, height: height, viewBox: `0 0 ${width} ${height}`, xmlns: "http://www.w3.org/2000/svg", style: style, "data-shape-type": "circle", children: (0, jsx_runtime_1.jsx)("path", { d: (0, make_circle_1.makeCircle)({
-                cx: 50,
-                cy: 50,
-                radius: 50,
-            }), fill: fill, stroke: stroke, strokeWidth: strokeWidth }) }));
-};
-exports.Circle = Circle;

package/dist/components/return-type.d.ts

@@ -1,5 +0,0 @@
-export declare type ShapeInfo = {
-    path: string;
-    width: string;
-    height: string;
-};

package/dist/components/return-type.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/shape-info.d.ts

@@ -1,5 +0,0 @@
-export declare type ShapeInfo = {
-    path: string;
-    width: number;
-    height: number;
-};

package/dist/components/shape-info.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/make-circle.d.ts

@@ -1,4 +0,0 @@
-export declare type MakeCircleProps = {
-    radius: number;
-};
-export declare const makeCircle: ({ radius }: MakeCircleProps) => string;

package/dist/make-circle.js

@@ -1,9 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeCircle = void 0;
-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;

package/dist/make-ellipse.d.ts

@@ -1,5 +0,0 @@
-export declare type MakeEllipseOptions = {
-    rx: number;
-    ry: number;
-};
-export declare const makeEllipse: ({ rx, ry }: MakeEllipseOptions) => string;

package/dist/make-ellipse.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeEllipse = void 0;
-const makeEllipse = ({ rx = 50, ry = 50 }) => {
-    return `M ${rx} ${0} a ${rx} ${ry} 0 1 0 1 0`;
-};
-exports.makeEllipse = makeEllipse;

package/dist/make-rect.d.ts

@@ -1,5 +0,0 @@
-export declare type MakeRectOptions = {
-    width: number;
-    height: number;
-};
-export declare const makeRect: ({ width, height }: MakeRectOptions) => string;

package/dist/make-rect.js

@@ -1,9 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeRect = void 0;
-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;

package/dist/make-triangle.d.ts

@@ -1,6 +0,0 @@
-export declare type MakeTriangleProps = {
-    width: number;
-    height: number;
-    direction: 'right' | 'left' | 'top' | 'bottom';
-};
-export declare const makeTriangle: ({ width, height, direction, }: MakeTriangleProps) => string;

package/dist/make-triangle.js

@@ -1,14 +0,0 @@
-"use strict";
-// Copied from https://stackblitz.com/edit/react-triangle-svg?file=index.js
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeTriangle = void 0;
-const makeTriangle = ({ width, height, direction = 'right', }) => {
-    const points = {
-        top: [`${width / 2} 0`, 'L', `0 ${height}`, 'L', `${width} ${height}`],
-        right: [`0 0`, 'L', `0 ${height}`, 'L', `${width} ${height / 2}`],
-        bottom: [`0 0`, 'L', `${width} 0`, 'L', `${width / 2} ${height}`],
-        left: [`${width} 0`, 'L', `${width} ${height}`, 'L', `0 ${height / 2}`],
-    };
-    return `M ${points[direction].join(' ')} z`;
-};
-exports.makeTriangle = makeTriangle;

package/dist/rect.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export declare type SquareProps = {
-    width: number;
-    height: number;
-    fill?: string;
-    style?: React.CSSProperties;
-};
-export declare const Rect: React.FC<SquareProps>;

package/dist/rect.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Rect = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const make_rect_1 = require("./make-rect");
-const Rect = ({ width, height, fill, style }) => {
-    return ((0, jsx_runtime_1.jsx)("svg", { width: width, height: height, viewBox: `0 0 ${width} ${height}`, xmlns: "http://www.w3.org/2000/svg", style: style, "data-shape-type": "rect", children: (0, jsx_runtime_1.jsx)("path", { d: (0, make_rect_1.makeRect)({
-                width,
-                height,
-            }), fill: fill }) }));
-};
-exports.Rect = Rect;

package/dist/triangle.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-export declare type TriangleProps = {
-    width: number;
-    height: number;
-    fill?: string;
-    direction: 'right' | 'left' | 'top' | 'bottom';
-    style?: React.CSSProperties;
-};
-export declare const Triangle: React.FC<TriangleProps>;

package/dist/triangle.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Triangle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const make_triangle_1 = require("./make-triangle");
-const Triangle = ({ width, height, fill, direction, style, }) => {
-    return ((0, jsx_runtime_1.jsx)("svg", { width: width, height: height, viewBox: `0 0 ${width} ${height}`, xmlns: "http://www.w3.org/2000/svg", style: style, "data-shape-type": "triangle", children: (0, jsx_runtime_1.jsx)("path", { d: (0, make_triangle_1.makeTriangle)({
-                width,
-                height,
-                direction,
-            }), fill: fill }) }));
-};
-exports.Triangle = Triangle;

package/dist/utils/instructions.d.ts

@@ -1,39 +0,0 @@
-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';
-};
-export declare const serializeInstructions: (instructions: Instruction[]) => string;
-export declare const serializeInstruction: (instruction: Instruction) => string;

package/dist/utils/instructions.js

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.serializeInstruction = exports.serializeInstructions = void 0;
-const serializeInstructions = (instructions) => {
-    return instructions.map((i) => (0, exports.serializeInstruction)(i)).join(' ');
-};
-exports.serializeInstructions = serializeInstructions;
-const serializeInstruction = (instruction) => {
-    if (instruction.type === 'M') {
-        return `M ${instruction.x} ${instruction.y}`;
-    }
-    if (instruction.type === 'L') {
-        return `L ${instruction.x} ${instruction.y}`;
-    }
-    if (instruction.type === 'C') {
-        return `C ${instruction.cp1x} ${instruction.cp1y} ${instruction.cp2x} ${instruction.cp2y} ${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;

package/dist/utils/star.d.ts

@@ -1,10 +0,0 @@
-export declare type StarProps = {
-    centerX: number;
-    centerY: number;
-    points: number;
-    innerRadius: number;
-    outerRadius: number;
-    edgeRoundness: number | null;
-    cornerRadius: number;
-};
-export declare const star: ({ centerX, centerY, points, innerRadius, outerRadius, cornerRadius, edgeRoundness, }: StarProps) => string;

package/dist/utils/star.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.star = void 0;
-const instructions_1 = require("./instructions");
-const join_points_1 = require("./join-points");
-const polarToCartesian = ({ centerX, centerY, radius, angleInDegrees, }) => {
-    const angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180.0;
-    return {
-        x: centerX + radius * Math.cos(angleInRadians),
-        y: centerY + radius * Math.sin(angleInRadians),
-    };
-};
-const star = ({ centerX, centerY, points, innerRadius, outerRadius, cornerRadius, edgeRoundness, }) => {
-    const degreeIncrement = 360 / (points * 2);
-    const d = new Array(points * 2)
-        .fill('true')
-        .map((_p, i) => {
-        const radius = i % 2 === 0 ? outerRadius : innerRadius;
-        const degrees = degreeIncrement * i;
-        const point = polarToCartesian({
-            centerX,
-            centerY,
-            radius,
-            angleInDegrees: degrees,
-        });
-        return [point.x, point.y];
-    });
-    return (0, instructions_1.serializeInstructions)((0, join_points_1.joinPoints)([...d, d[0]], {
-        edgeRoundness,
-        cornerRadius,
-        roundCornerStrategy: 'arc',
-    }));
-};
-exports.star = star;