feat: cinematic bars, diamond, heart, and star masks

Made-with: Cursor

1 files changed, 63 insertions, 39 deletions

diff --git a/apps/web/src/lib/masks/definitions/index.ts b/apps/web/src/lib/masks/definitions/index.ts
index 49404ce1..c078ef60 100644
--- a/apps/web/src/lib/masks/definitions/index.ts
+++ b/apps/web/src/lib/masks/definitions/index.ts
@@ -1,39 +1,63 @@
-import type { BaseMaskParams, MaskDefinition } from "@/lib/masks/types";

-import { masksRegistry, type MaskIconProps } from "../registry";

-import { ellipseMaskDefinition } from "./ellipse";

-import { rectangleMaskDefinition } from "./rectangle";

-import { splitMaskDefinition } from "./split";

-import {

-	PanelRightDashedIcon,

-	SquareIcon,

-	CircleIcon,

-} from "@hugeicons/core-free-icons";

-

-function registerDefaultMask<TParams extends BaseMaskParams>({

-	definition,

-	icon,

-}: {

-	definition: MaskDefinition<TParams>;

-	icon: MaskIconProps;

-}) {

-	if (masksRegistry.has(definition.type)) {

-		return;

-	}

-

-	masksRegistry.registerMask({ definition, icon });

-}

-

-export function registerDefaultMasks(): void {

-	registerDefaultMask({

-		definition: splitMaskDefinition,

-		icon: { icon: PanelRightDashedIcon, strokeWidth: 1 },

-	});

-	registerDefaultMask({

-		definition: rectangleMaskDefinition,

-		icon: { icon: SquareIcon },

-	});

-	registerDefaultMask({

-		definition: ellipseMaskDefinition,

-		icon: { icon: CircleIcon },

-	});

-}

+import type { BaseMaskParams, MaskDefinition } from "@/lib/masks/types";
+import { masksRegistry, type MaskIconProps } from "../registry";
+import { cinematicBarsMaskDefinition } from "./cinematic-bars";
+import { diamondMaskDefinition } from "./diamond";
+import { ellipseMaskDefinition } from "./ellipse";
+import { heartMaskDefinition } from "./heart";
+import { rectangleMaskDefinition } from "./rectangle";
+import { splitMaskDefinition } from "./split";
+import { starMaskDefinition } from "./star";
+import {
+	MinusSignIcon,
+	PanelRightDashedIcon,
+	SquareIcon,
+	CircleIcon,
+	FavouriteIcon,
+	DiamondIcon,
+	StarsIcon,
+} from "@hugeicons/core-free-icons";
+
+function registerDefaultMask<TParams extends BaseMaskParams>({
+	definition,
+	icon,
+}: {
+	definition: MaskDefinition<TParams>;
+	icon: MaskIconProps;
+}) {
+	if (masksRegistry.has(definition.type)) {
+		return;
+	}
+
+	masksRegistry.registerMask({ definition, icon });
+}
+
+export function registerDefaultMasks(): void {
+	registerDefaultMask({
+		definition: splitMaskDefinition,
+		icon: { icon: PanelRightDashedIcon, strokeWidth: 1 },
+	});
+	registerDefaultMask({
+		definition: cinematicBarsMaskDefinition,
+		icon: { icon: MinusSignIcon },
+	});
+	registerDefaultMask({
+		definition: rectangleMaskDefinition,
+		icon: { icon: SquareIcon },
+	});
+	registerDefaultMask({
+		definition: ellipseMaskDefinition,
+		icon: { icon: CircleIcon },
+	});
+	registerDefaultMask({
+		definition: heartMaskDefinition,
+		icon: { icon: FavouriteIcon },
+	});
+	registerDefaultMask({
+		definition: diamondMaskDefinition,
+		icon: { icon: DiamondIcon },
+	});
+	registerDefaultMask({
+		definition: starMaskDefinition,
+		icon: { icon: StarsIcon },
+	});
+}