From fa8b70513b1b8cc7e021dd62207e18e4c050e679 Mon Sep 17 00:00:00 2001
From: Vjacheslav Trushkin <cyberalien@gmail.com>
Date: Thu, 7 Apr 2022 18:52:20 +0300
Subject: [PATCH] Optimise duplicate properties in background mode in svg
 framework

---
 packages/iconify/src/render/bg.ts | 27 ++++++++++++++++++---------
 1 file changed, 18 insertions(+), 9 deletions(-)

diff --git a/packages/iconify/src/render/bg.ts b/packages/iconify/src/render/bg.ts
index 7187549..bab0998 100644
--- a/packages/iconify/src/render/bg.ts
+++ b/packages/iconify/src/render/bg.ts
@@ -14,22 +14,31 @@ const commonProps: Record<string, string> = {
 };
 
 const monotoneProps: Record<string, string> = {
-	'-webkit-mask-image': 'var(--svg)',
-	'-webkit-mask-repeat': 'no-repeat',
-	'-webkit-mask-size': '100% 100%',
-	'mask-image': 'var(--svg)',
-	'mask-repeat': 'no-repeat',
-	'mask-size': '100% 100%',
 	'background-color': 'currentColor',
 };
 
 const coloredProps: Record<string, string> = {
-	'background-image': 'var(--svg)',
-	'background-repeat': 'no-repeat',
-	'background-size': '100% 100%',
 	'background-color': 'transparent',
 };
 
+// Dynamically add common props to variables above
+const propsToAdd: Record<string, string> = {
+	image: 'var(--svg)',
+	repeat: 'no-repeat',
+	size: '100% 100%',
+};
+const propsToAddTo: Record<string, Record<string, string>> = {
+	'-webkit-mask': monotoneProps,
+	'mask': monotoneProps,
+	'background': coloredProps,
+};
+for (const prefix in propsToAddTo) {
+	const list = propsToAddTo[prefix];
+	for (const prop in propsToAdd) {
+		list[prefix + '-' + prop] = propsToAdd[prop];
+	}
+}
+
 /**
  * Render icon as inline SVG
  */