react-confetti-burst 1.0.0

package/dist/cjs/shapes.js

@@ -0,0 +1,272 @@
+"use strict";
+/**
+ * Shape helper functions
+ *
+ * Provides canvas-confetti compatible shape creation utilities
+ * for custom SVG paths, text, and emoji shapes.
+ *
+ * @module shapes
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.emojiShapes = exports.pathShapes = void 0;
+exports.shapeFromPath = shapeFromPath;
+exports.shapeFromText = shapeFromText;
+exports.shapeFromImage = shapeFromImage;
+exports.shapesFromEmoji = shapesFromEmoji;
+/**
+ * Create a custom shape from an SVG path string.
+ *
+ * This is compatible with canvas-confetti's shapeFromPath function.
+ *
+ * @example
+ * ```typescript
+ * // Simple star shape
+ * const star = shapeFromPath({
+ *   path: 'M0,-1 L0.588,0.809 L-0.951,-0.309 L0.951,-0.309 L-0.588,0.809 Z'
+ * });
+ *
+ * // With transformation matrix
+ * const scaledStar = shapeFromPath({
+ *   path: 'M0,-1 L0.588,0.809 L-0.951,-0.309 L0.951,-0.309 L-0.588,0.809 Z',
+ *   matrix: [2, 0, 0, 2, 0, 0] // Scale 2x
+ * });
+ *
+ * // Usage with confetti
+ * fire({ x: 0.5, y: 0.5 }, {
+ *   particle: { shapes: [star, 'circle'] }
+ * });
+ * ```
+ *
+ * @param options - Shape configuration options
+ * @returns PathShape object for use in confetti configuration
+ */
+function shapeFromPath(options) {
+    const { path, matrix, fillColor, strokeColor, strokeWidth } = options;
+    // Parse the path to extract bounds for proper scaling
+    const bounds = getPathBounds(path);
+    return {
+        type: 'path',
+        path,
+        matrix: matrix ? [...matrix] : undefined,
+        fillColor,
+        strokeColor,
+        strokeWidth,
+        bounds,
+    };
+}
+/**
+ * Create a custom shape from text or an emoji.
+ *
+ * This is compatible with canvas-confetti's shapeFromText function.
+ *
+ * @example
+ * ```typescript
+ * // Emoji confetti
+ * const heart = shapeFromText({ text: '❤️' });
+ * const party = shapeFromText({ text: '🎉', scalar: 2 });
+ *
+ * // Custom text
+ * const yay = shapeFromText({
+ *   text: 'YAY',
+ *   fontFamily: 'Impact',
+ *   color: '#ff0000'
+ * });
+ *
+ * // Usage with confetti
+ * fire({ x: 0.5, y: 0.5 }, {
+ *   particle: { shapes: [heart, party, yay] }
+ * });
+ * ```
+ *
+ * @param options - Text shape configuration options
+ * @returns TextShape object for use in confetti configuration
+ */
+function shapeFromText(options) {
+    const { text, scalar = 1, color, fontFamily = 'serif', fontWeight = 'normal', fontStyle = 'normal', } = options;
+    return {
+        type: 'text',
+        text,
+        scalar,
+        color,
+        fontFamily,
+        fontWeight: String(fontWeight),
+        fontStyle,
+    };
+}
+/**
+ * Create a bitmap shape from an image URL or HTMLImageElement.
+ *
+ * @example
+ * ```typescript
+ * const logo = await shapeFromImage({
+ *   src: '/logo.png',
+ *   width: 32,
+ *   height: 32
+ * });
+ *
+ * fire({ x: 0.5, y: 0.5 }, {
+ *   particle: { shapes: [logo] }
+ * });
+ * ```
+ *
+ * @param options - Image shape configuration options
+ * @returns Promise resolving to a custom shape
+ */
+async function shapeFromImage(options) {
+    const { src, scalar = 1 } = options;
+    // If it's already an image element, use it directly
+    if (typeof src !== 'string') {
+        return {
+            type: 'text', // Reuse text type for simplicity in renderer
+            text: '',
+            scalar,
+            // Store image reference in a custom way
+            fontFamily: `url(${src.src})`,
+        };
+    }
+    // Load the image to validate it exists
+    await loadImage(src);
+    return {
+        type: 'text',
+        text: '',
+        scalar,
+        fontFamily: `url(${src})`,
+        color: undefined,
+    };
+}
+/**
+ * Create multiple shapes from an array of emoji.
+ *
+ * @example
+ * ```typescript
+ * const partyEmoji = shapesFromEmoji(['🎉', '🎊', '✨', '🥳']);
+ *
+ * fire({ x: 0.5, y: 0.5 }, {
+ *   particle: { shapes: partyEmoji }
+ * });
+ * ```
+ *
+ * @param emojis - Array of emoji strings
+ * @param options - Optional common options for all emoji
+ * @returns Array of TextShape objects
+ */
+function shapesFromEmoji(emojis, options = {}) {
+    return emojis.map(emoji => shapeFromText({ ...options, text: emoji }));
+}
+/**
+ * Common predefined path shapes
+ */
+exports.pathShapes = {
+    /** Five-pointed star */
+    star: shapeFromPath({
+        path: 'M0,-1 L0.588,0.809 L-0.951,-0.309 L0.951,-0.309 L-0.588,0.809 Z',
+    }),
+    /** Heart shape */
+    heart: shapeFromPath({
+        path: 'M0,0.8 C-0.5,0.4 -1,-0.2 -1,-0.6 C-1,-1 -0.5,-1.2 0,-0.8 C0.5,-1.2 1,-1 1,-0.6 C1,-0.2 0.5,0.4 0,0.8 Z',
+    }),
+    /** Diamond shape */
+    diamond: shapeFromPath({
+        path: 'M0,-1 L0.7,0 L0,1 L-0.7,0 Z',
+    }),
+    /** Hexagon shape */
+    hexagon: shapeFromPath({
+        path: 'M0.866,-0.5 L0.866,0.5 L0,1 L-0.866,0.5 L-0.866,-0.5 L0,-1 Z',
+    }),
+    /** Triangle shape */
+    triangle: shapeFromPath({
+        path: 'M0,-1 L0.866,0.5 L-0.866,0.5 Z',
+    }),
+    /** Plus/cross shape */
+    plus: shapeFromPath({
+        path: 'M-0.25,-1 L0.25,-1 L0.25,-0.25 L1,-0.25 L1,0.25 L0.25,0.25 L0.25,1 L-0.25,1 L-0.25,0.25 L-1,0.25 L-1,-0.25 L-0.25,-0.25 Z',
+    }),
+    /** Moon/crescent shape */
+    moon: shapeFromPath({
+        path: 'M0,-1 A1,1 0 1,1 0,1 A0.6,0.6 0 1,0 0,-1 Z',
+    }),
+    /** Lightning bolt */
+    lightning: shapeFromPath({
+        path: 'M0.4,-1 L-0.2,0 L0.2,0 L-0.4,1 L0,0.2 L-0.3,0.2 L0.4,-1 Z',
+    }),
+    /** Spiral shape */
+    spiral: shapeFromPath({
+        path: 'M0,0 Q0.3,-0.3 0,-0.5 Q-0.5,-0.5 -0.5,0 Q-0.5,0.7 0,0.7 Q0.7,0.7 0.7,0 Q0.7,-0.9 0,-0.9',
+    }),
+    /** Ribbon/wave shape */
+    ribbon: shapeFromPath({
+        path: 'M-1,0 Q-0.5,-0.5 0,0 Q0.5,0.5 1,0 Q0.5,-0.3 0,0 Q-0.5,0.3 -1,0 Z',
+    }),
+};
+/**
+ * Common emoji sets for quick use
+ */
+exports.emojiShapes = {
+    /** Party/celebration emoji */
+    party: shapesFromEmoji(['🎉', '🎊', '🥳', '✨', '🎈']),
+    /** Heart emoji */
+    hearts: shapesFromEmoji(['❤️', '💕', '💖', '💗', '💝']),
+    /** Star emoji */
+    stars: shapesFromEmoji(['⭐', '🌟', '✨', '💫', '🌠']),
+    /** Nature emoji */
+    nature: shapesFromEmoji(['🌸', '🌺', '🌻', '🌼', '🌷']),
+    /** Food emoji */
+    food: shapesFromEmoji(['🍕', '🍔', '🍟', '🍩', '🧁']),
+    /** Sports emoji */
+    sports: shapesFromEmoji(['⚽', '🏀', '🏈', '⚾', '🎾']),
+    /** Weather emoji */
+    weather: shapesFromEmoji(['☀️', '⛅', '🌈', '❄️', '💨']),
+    /** Money emoji */
+    money: shapesFromEmoji(['💰', '💵', '💎', '🪙', '💳']),
+    /** Animals emoji */
+    animals: shapesFromEmoji(['🦋', '🐝', '🐞', '🦄', '🐱']),
+    /** Holiday emoji */
+    holiday: shapesFromEmoji(['🎄', '🎃', '🎅', '🐰', '🦃']),
+};
+// ============================================================================
+// Internal helper functions
+// ============================================================================
+/**
+ * Parse SVG path and extract bounds for proper scaling
+ */
+function getPathBounds(path) {
+    // Simple bounds extraction - this is a basic implementation
+    // A full implementation would parse all path commands
+    const numbers = path.match(/-?\d*\.?\d+/g);
+    if (!numbers || numbers.length < 2) {
+        return { minX: -1, minY: -1, maxX: 1, maxY: 1 };
+    }
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    // Assume alternating x,y pairs (simplified)
+    for (let i = 0; i < numbers.length - 1; i += 2) {
+        const x = parseFloat(numbers[i]);
+        const y = parseFloat(numbers[i + 1]);
+        if (!isNaN(x) && !isNaN(y)) {
+            minX = Math.min(minX, x);
+            minY = Math.min(minY, y);
+            maxX = Math.max(maxX, x);
+            maxY = Math.max(maxY, y);
+        }
+    }
+    // Handle case where we couldn't parse valid bounds
+    if (!isFinite(minX)) {
+        return { minX: -1, minY: -1, maxX: 1, maxY: 1 };
+    }
+    return { minX, minY, maxX, maxY };
+}
+/**
+ * Load an image and return a promise
+ */
+function loadImage(src) {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.crossOrigin = 'anonymous';
+        img.onload = () => resolve(img);
+        img.onerror = () => reject(new Error(`Failed to load image: ${src}`));
+        img.src = src;
+    });
+}
+//# sourceMappingURL=shapes.js.map

package/dist/cjs/shapes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shapes.js","sourceRoot":"","sources":["../../src/shapes.ts"],"names":[],"mappings":"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"}