add fill option

CHANGELOG.md

@@ -1,3 +1,6 @@
+### v3000.1.9
+- added `fill` option to `rect()`, `circle()` and `sprite()`
+
 ### v3000.1.8
 - fixed `scale` option acting weird when width and height are defined (by @hirnsalat)
 

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "kaboom",
 	"description": "kaboom.js is a JavaScript library that helps you make games fast and fun!",
-	"version": "3000.1.8",
+	"version": "3000.1.9",
 	"license": "MIT",
 	"homepage": "https://kaboomjs.com/",
 	"repository": "github:replit/kaboom",

src/kaboom.ts

@@ -1,4 +1,4 @@
-const VERSION = "3000.1.8"
+const VERSION = "3000.1.9"
 
 import initApp from "./app"
 
@@ -125,6 +125,7 @@ import type {
 	RectComp,
 	RectCompOpt,
 	UVQuadComp,
+	CircleCompOpt,
 	CircleComp,
 	OutlineComp,
 	TimerComp,
@@ -4527,6 +4528,7 @@ export default (gopt: KaboomOpt = {}): KaboomCtx => {
 					width: this.width,
 					height: this.height,
 					radius: this.radius,
+					fill: opt.fill,
 				}))
 			},
 			renderArea() {
@@ -4558,13 +4560,14 @@ export default (gopt: KaboomOpt = {}): KaboomCtx => {
 		}
 	}
 
-	function circle(radius: number): CircleComp {
+	function circle(radius: number, opt: CircleCompOpt = {}): CircleComp {
 		return {
 			id: "circle",
 			radius: radius,
 			draw(this: GameObj<CircleComp>) {
 				drawCircle(Object.assign(getRenderProps(this), {
 					radius: this.radius,
+					fill: opt.fill,
 				}))
 			},
 			renderArea(this: GameObj<AnchorComp | CircleComp>) {

src/types.ts

@@ -4344,6 +4344,10 @@ export interface SpriteCompOpt {
 	 * The rectangular sub-area of the texture to render, default to full texture `quad(0, 0, 1, 1)`.
 	 */
 	quad?: Quad,
+	/**
+	 * If fill the sprite (useful if you only want to render outline with outline() component).
+	 */
+	fill?: boolean,
 }
 
 export interface SpriteComp extends Comp {
@@ -4512,6 +4516,10 @@ export interface RectCompOpt {
 	 * Radius of the rectangle corners.
 	 */
 	radius?: number,
+	/**
+	 * If fill the rectangle (useful if you only want to render outline with outline() component).
+	 */
+	fill?: boolean,
 }
 
 export interface RectComp extends Comp {
@@ -4533,6 +4541,13 @@ export interface RectComp extends Comp {
 	renderArea(): Rect,
 }
 
+export interface CircleCompOpt {
+	/**
+	 * If fill the circle (useful if you only want to render outline with outline() component).
+	 */
+	fill?: boolean,
+}
+
 export interface CircleComp extends Comp {
 	/**
 	 * Radius of circle.