react-confetti-burst 1.0.4 → 1.0.6

package/dist/types/index.d.ts

@@ -710,6 +710,18 @@ export interface ConfettiButtonProps extends React$1.ButtonHTMLAttributes<HTMLBu
 	/** Children elements */
 	readonly children: React$1.ReactNode;
 }
+/**
+ * Preset configuration names
+ */
+export type PresetName = "default" | "celebration" | "firework" | "snow" | "rain" | "sparkle" | "confetti" | "emoji" | "hearts" | "stars" | "money" | "pride" | "christmas" | "halloween" | "newYear" | "birthday";
+/**
+ * Preset configuration
+ */
+export interface PresetConfig {
+	readonly name: PresetName;
+	readonly options: ConfettiBurstOptions;
+	readonly description: string;
+}
 /**
  * Default vibrant color palette for confetti particles
  * Designed for high visibility on both light and dark backgrounds
@@ -742,6 +754,16 @@ export declare const DIRECTION_ANGLES: Record<Exclude<BurstDirection, "custom" |
  * Easing functions for smooth animations
  */
 export declare const EASING_FUNCTIONS: Record<EasingPreset, EasingFunction>;
+/**
+ * Sets the maximum particle pool size.
+ * Call before creating any ConfettiEngine instances.
+ * @param size - Maximum number of particles to pool (default: 500)
+ */
+export declare function setMaxPoolSize(size: number): void;
+/**
+ * Gets the current maximum particle pool size.
+ */
+export declare function getMaxPoolSize(): number;
 /**
  * Main confetti engine class
  */
@@ -900,11 +922,19 @@ export declare function ConfettiBurst({ active, origin, triggerRef, options, onC
  */
 export declare const ConfettiButton: React$1.ForwardRefExoticComponent<ConfettiButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
 /**
- * Generates a random number within a range
+ * Generates a random number within a range (inclusive min, exclusive max)
+ * @param min - Minimum value (inclusive)
+ * @param max - Maximum value (exclusive)
+ * @returns Random number in [min, max)
+ * @example randomInRange(5, 15) // e.g. 8.342
  */
 export declare function randomInRange(min: number, max: number): number;
 /**
- * Generates a random integer within a range (inclusive)
+ * Generates a random integer within a range (inclusive on both ends)
+ * @param min - Minimum integer value (inclusive)
+ * @param max - Maximum integer value (inclusive)
+ * @returns Random integer in [min, max]
+ * @example randomInt(1, 6) // e.g. 3
  */
 export declare function randomInt(min: number, max: number): number;
 /**
@@ -913,18 +943,34 @@ export declare function randomInt(min: number, max: number): number;
 export declare function randomFromArray<T>(array: readonly T[]): T;
 /**
  * Clamps a value between min and max
+ * @param value - Value to clamp
+ * @param min - Minimum bound
+ * @param max - Maximum bound
+ * @returns Clamped value in [min, max]
+ * @example clamp(15, 0, 10) // 10
  */
 export declare function clamp(value: number, min: number, max: number): number;
 /**
  * Linear interpolation between two values
+ * @param start - Start value (t=0)
+ * @param end - End value (t=1)
+ * @param t - Interpolation factor, clamped to [0, 1]
+ * @returns Interpolated value
+ * @example lerp(0, 100, 0.5) // 50
  */
 export declare function lerp(start: number, end: number, t: number): number;
 /**
  * Converts degrees to radians
+ * @param degrees - Angle in degrees
+ * @returns Angle in radians
+ * @example degToRad(180) // Math.PI
  */
 export declare function degToRad(degrees: number): number;
 /**
  * Converts radians to degrees
+ * @param radians - Angle in radians
+ * @returns Angle in degrees
+ * @example radToDeg(Math.PI) // 180
  */
 export declare function radToDeg(radians: number): number;
 /**
@@ -996,6 +1042,280 @@ export declare namespace confetti {
 	var destroyAll: () => void;
 	var getShapes: () => string[];
 }
+/**
+ * Color palettes for presets
+ */
+export declare const COLOR_PALETTES: {
+	readonly rainbow: readonly string[];
+	readonly pride: readonly [
+		"#E40303",
+		"#FF8C00",
+		"#FFED00",
+		"#008026",
+		"#24408E",
+		"#732982"
+	];
+	readonly christmas: readonly [
+		"#C41E3A",
+		"#165B33",
+		"#FFD700",
+		"#FFFFFF",
+		"#BB2528"
+	];
+	readonly halloween: readonly [
+		"#FF6600",
+		"#000000",
+		"#8B008B",
+		"#00FF00",
+		"#FFD700"
+	];
+	readonly pastel: readonly [
+		"#FFB3BA",
+		"#FFDFBA",
+		"#FFFFBA",
+		"#BAFFC9",
+		"#BAE1FF"
+	];
+	readonly neon: readonly [
+		"#FF00FF",
+		"#00FFFF",
+		"#FF0080",
+		"#80FF00",
+		"#FF8000"
+	];
+	readonly gold: readonly [
+		"#FFD700",
+		"#DAA520",
+		"#B8860B",
+		"#FFC125",
+		"#FFDF00"
+	];
+	readonly silver: readonly [
+		"#C0C0C0",
+		"#A8A8A8",
+		"#D3D3D3",
+		"#DCDCDC",
+		"#E8E8E8"
+	];
+	readonly hearts: readonly [
+		"#FF69B4",
+		"#FF1493",
+		"#FF007F",
+		"#DC143C",
+		"#FFB6C1"
+	];
+	readonly ocean: readonly [
+		"#006994",
+		"#00CED1",
+		"#20B2AA",
+		"#48D1CC",
+		"#87CEEB"
+	];
+};
+/**
+ * Emoji sets for presets
+ */
+export declare const EMOJI_SETS: {
+	readonly celebration: readonly [
+		"\uD83C\uDF89",
+		"\uD83C\uDF8A",
+		"\uD83E\uDD73",
+		"\u2728",
+		"\uD83C\uDF88"
+	];
+	readonly hearts: readonly [
+		"\u2764\uFE0F",
+		"\uD83D\uDC95",
+		"\uD83D\uDC96",
+		"\uD83D\uDC97",
+		"\uD83D\uDC93",
+		"\uD83D\uDC98"
+	];
+	readonly stars: readonly [
+		"\u2B50",
+		"\uD83C\uDF1F",
+		"\u2728",
+		"\uD83D\uDCAB",
+		"\u26A1"
+	];
+	readonly money: readonly [
+		"\uD83D\uDCB0",
+		"\uD83D\uDCB5",
+		"\uD83D\uDCB8",
+		"\uD83E\uDD11",
+		"\uD83D\uDC8E"
+	];
+	readonly christmas: readonly [
+		"\uD83C\uDF84",
+		"\uD83C\uDF85",
+		"\uD83C\uDF81",
+		"\u2744\uFE0F",
+		"\u2B50"
+	];
+	readonly halloween: readonly [
+		"\uD83C\uDF83",
+		"\uD83D\uDC7B",
+		"\uD83E\uDD87",
+		"\uD83D\uDD77\uFE0F",
+		"\uD83D\uDC80"
+	];
+	readonly birthday: readonly [
+		"\uD83C\uDF82",
+		"\uD83C\uDF81",
+		"\uD83C\uDF88",
+		"\uD83C\uDF89",
+		"\uD83E\uDD73"
+	];
+	readonly food: readonly [
+		"\uD83C\uDF55",
+		"\uD83C\uDF54",
+		"\uD83C\uDF5F",
+		"\uD83C\uDF2D",
+		"\uD83C\uDF7F"
+	];
+};
+/**
+ * Preset configurations for quick setup
+ */
+export declare const PRESETS: Record<PresetName, PresetConfig>;
+/**
+ * Get a preset configuration by name
+ */
+export declare function getPreset(name: PresetName): PresetConfig;
+/**
+ * Get all available preset names
+ */
+export declare function getPresetNames(): readonly PresetName[];
+/**
+ * Options for creating a shape from an SVG path
+ */
+export interface ShapeFromPathOptions {
+	/** SVG path string (d attribute) */
+	readonly path: string;
+	/** Optional 2D transformation matrix [a, b, c, d, e, f] */
+	readonly matrix?: readonly number[];
+	/** Fill color (optional, will use particle color if not set) */
+	readonly fillColor?: string;
+	/** Stroke color (optional) */
+	readonly strokeColor?: string;
+	/** Stroke width (optional) */
+	readonly strokeWidth?: number;
+}
+/**
+ * Options for creating a shape from text/emoji
+ */
+export interface ShapeFromTextOptions {
+	/** Text or emoji to render */
+	readonly text: string;
+	/** Scale factor for the text size. Default: 1 */
+	readonly scalar?: number;
+	/** Text color (optional, will use particle color if not set) */
+	readonly color?: string;
+	/** Font family. Default: 'serif' */
+	readonly fontFamily?: string;
+	/** Font weight. Default: 'normal' */
+	readonly fontWeight?: string | number;
+	/** Font style. Default: 'normal' */
+	readonly fontStyle?: "normal" | "italic" | "oblique";
+}
+/**
+ * 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
+ */
+export declare function shapeFromPath(options: ShapeFromPathOptions): PathShape;
+/**
+ * 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
+ */
+export declare function shapeFromText(options: ShapeFromTextOptions): TextShape;
+/**
+ * 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
+ */
+export declare function shapeFromImage(options: {
+	readonly src: string | HTMLImageElement;
+	readonly width?: number;
+	readonly height?: number;
+	readonly scalar?: number;
+}): Promise<CustomShape>;
+/**
+ * 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
+ */
+export declare function shapesFromEmoji(emojis: readonly string[], options?: Omit<ShapeFromTextOptions, "text">): TextShape[];
 
 export {
 	confetti as default,

package/package.json

@@ -1,83 +1,105 @@
-{
-  "name": "react-confetti-burst",
-  "version": "1.0.4",
-  "description": "A high-performance, zero-dependency React confetti component with directional bursts using Canvas API",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "types": "dist/types/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/types/index.d.ts",
-      "require": "./dist/cjs/index.js",
-      "import": "./dist/esm/index.js"
-    }
-  },
-  "sideEffects": false,
-  "files": [
-    "dist/cjs/index.js",
-    "dist/esm/index.js",
-    "dist/types/index.d.ts"
-  ],
-  "scripts": {
-    "build": "npm run clean && npm run build:bundle && npm run build:types",
-    "build:bundle": "node build.js",
-    "build:types": "dts-bundle-generator -o dist/types/index.d.ts src/index.ts --no-banner --no-check",
-    "build:types:fallback": "tsc -p tsconfig.json --emitDeclarationOnly --declaration --declarationDir dist/types",
-    "build:dev": "npm run build:cjs && npm run build:esm && npm run build:types:fallback",
-    "build:cjs": "tsc -p tsconfig.json",
-    "build:esm": "tsc -p tsconfig.esm.json",
-    "clean": "node -e \"fs.rmSync('dist',{recursive:true,force:true})\"",
-    "test": "jest",
-    "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage",
-    "lint": "eslint src --ext .ts,.tsx",
-    "typecheck": "tsc --noEmit",
-    "prepublishOnly": "npm run build",
-    "size": "node -e \"const f=require('fs');const e=f.statSync('dist/esm/index.js').size;const c=f.statSync('dist/cjs/index.js').size;console.log('ESM:',(e/1024).toFixed(2)+'KB','CJS:',(c/1024).toFixed(2)+'KB','Total:',((e+c)/1024).toFixed(2)+'KB')\""
-  },
-  "keywords": [
-    "react",
-    "confetti",
-    "canvas",
-    "animation",
-    "celebration",
-    "burst",
-    "directional",
-    "particles",
-    "typescript",
-    "zero-dependencies"
-  ],
-  "author": "",
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": ""
-  },
-  "bugs": {
-    "url": ""
-  },
-  "homepage": "",
-  "peerDependencies": {
-    "react": ">=17.0.0",
-    "react-dom": ">=17.0.0"
-  },
-  "devDependencies": {
-    "@testing-library/jest-dom": "^6.9.1",
-    "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.5.0",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0",
-    "dts-bundle-generator": "^9.5.1",
-    "esbuild": "^0.27.2",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "terser": "^5.44.1",
-    "ts-jest": "^29.1.0",
-    "typescript": "^5.3.0"
-  },
-  "engines": {
-    "node": ">=18.0.0"
-  }
-}
+{
+  "name": "react-confetti-burst",
+  "version": "1.0.6",
+  "description": "A high-performance, zero-dependency React confetti component with directional bursts using Canvas API",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "require": "./dist/cjs/index.js",
+      "import": "./dist/esm/index.js"
+    },
+    "./browser": "./dist/confetti.browser.js"
+  },
+  "browser": "dist/confetti.browser.js",
+  "sideEffects": false,
+  "files": [
+    "dist/cjs/index.js",
+    "dist/esm/index.js",
+    "dist/confetti.browser.js",
+    "dist/types/index.d.ts",
+    "README.md",
+    "LICENSE",
+    "CONTRIBUTING.md"
+  ],
+  "scripts": {
+    "build": "npm run clean && npm run build:bundle && npm run build:types",
+    "build:bundle": "node build.js",
+    "build:types": "dts-bundle-generator -o dist/types/index.d.ts src/index.ts --no-banner --no-check",
+    "build:types:fallback": "tsc -p tsconfig.json --emitDeclarationOnly --declaration --declarationDir dist/types",
+    "build:dev": "npm run build:cjs && npm run build:esm && npm run build:types:fallback",
+    "build:cjs": "tsc -p tsconfig.json",
+    "build:esm": "tsc -p tsconfig.esm.json",
+    "clean": "node -e \"fs.rmSync('dist',{recursive:true,force:true})\"",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "lint": "eslint src",
+    "typecheck": "tsc --noEmit",
+    "prepare": "husky",
+    "prepublishOnly": "npm run build",
+    "size": "node -e \"const f=require('fs');const e=f.statSync('dist/esm/index.js').size;const c=f.statSync('dist/cjs/index.js').size;console.log('ESM:',(e/1024).toFixed(2)+'KB','CJS:',(c/1024).toFixed(2)+'KB','Total:',((e+c)/1024).toFixed(2)+'KB')\""
+  },
+  "keywords": [
+    "react",
+    "confetti",
+    "canvas",
+    "animation",
+    "celebration",
+    "burst",
+    "directional",
+    "particles",
+    "typescript",
+    "zero-dependencies"
+  ],
+  "author": "",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "bugs": {
+    "url": ""
+  },
+  "homepage": "",
+  "peerDependencies": {
+    "react": ">=17.0.0",
+    "react-dom": ">=17.0.0"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^14.0.0",
+    "@types/jest": "^29.5.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@typescript-eslint/eslint-plugin": "^8.57.1",
+    "@typescript-eslint/parser": "^8.57.1",
+    "dts-bundle-generator": "^9.5.1",
+    "esbuild": "^0.27.2",
+    "eslint": "^9.39.4",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "husky": "^9.1.7",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "lint-staged": "^16.4.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "terser": "^5.44.1",
+    "ts-jest": "^29.1.0",
+    "typescript": "^5.3.0"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "lint-staged": {
+    "src/**/*.{ts,tsx}": [
+      "eslint --fix"
+    ]
+  },
+  "overrides": {
+    "@tootallnate/once": "3.0.1",
+    "minimatch": ">=3.1.4"
+  }
+}