From 2fa2486a70fb6ede60e00672de806aa8d4d85d7d Mon Sep 17 00:00:00 2001
From: Patrick Yeo <patrick.yeo@liferay.com>
Date: Fri, 26 Jul 2024 16:02:23 -0700
Subject: [PATCH] fix(@clayui/css): LPD-30959 Adds $list-group Sass map for
 more customization options

---
 .../scss/cadmin/components/_list-group.scss   | 15 ++-------------
 .../scss/cadmin/variables/_list-group.scss    | 19 +++++++++++++++++++
 .../src/scss/components/_list-group.scss      | 15 ++-------------
 .../src/scss/variables/_list-group.scss       | 19 +++++++++++++++++++
 4 files changed, 42 insertions(+), 26 deletions(-)

diff --git a/packages/clay-css/src/scss/cadmin/components/_list-group.scss b/packages/clay-css/src/scss/cadmin/components/_list-group.scss
index 627288851d..d7039775b2 100644
--- a/packages/clay-css/src/scss/cadmin/components/_list-group.scss
+++ b/packages/clay-css/src/scss/cadmin/components/_list-group.scss
@@ -18,21 +18,10 @@
 }
 
 .list-group {
-	@include border-radius($cadmin-list-group-border-radius);
-	@include box-shadow($cadmin-list-group-box-shadow);
-
-	color: $cadmin-list-group-color;
-	display: flex;
-	flex-direction: column;
-	font-size: $cadmin-list-group-font-size;
-	margin-bottom: $cadmin-list-group-margin-bottom;
-	margin-top: $cadmin-list-group-margin-top;
-	padding-left: 0;
+	@include clay-css($cadmin-list-group);
 
 	.list-group {
-		@if ($cadmin-list-group-box-shadow != null) {
-			@include box-shadow(none);
-		}
+		@include clay-css(map-get($cadmin-list-group, list-group));
 	}
 }
 
diff --git a/packages/clay-css/src/scss/cadmin/variables/_list-group.scss b/packages/clay-css/src/scss/cadmin/variables/_list-group.scss
index 077685b876..0b82cf8b8b 100644
--- a/packages/clay-css/src/scss/cadmin/variables/_list-group.scss
+++ b/packages/clay-css/src/scss/cadmin/variables/_list-group.scss
@@ -208,6 +208,25 @@ $cadmin-list-group-link-color: $cadmin-gray-900 !default;
 $cadmin-list-group-link-hover-color: $cadmin-list-group-link-color !default;
 $cadmin-list-group-link-active-color: $cadmin-list-group-link-color !default;
 
+$cadmin-list-group: () !default;
+$cadmin-list-group: map-deep-merge(
+	(
+		border-radius: clay-enable-rounded($cadmin-list-group-border-radius),
+		box-shadow: clay-enable-shadows($cadmin-list-group-box-shadow),
+		color: $cadmin-list-group-color,
+		display: flex,
+		flex-direction: column,
+		font-size: $cadmin-list-group-font-size,
+		margin-bottom: $cadmin-list-group-margin-bottom,
+		margin-top: $cadmin-list-group-margin-top,
+		padding-left: 0,
+		list-group: (
+			box-shadow: if($cadmin-list-group-box-shadow != null, none, null),
+		),
+	),
+	$cadmin-list-group
+);
+
 // List Group Notification
 
 $cadmin-list-group-notification-item-border-bottom-color: $cadmin-list-group-border-color !default;
diff --git a/packages/clay-css/src/scss/components/_list-group.scss b/packages/clay-css/src/scss/components/_list-group.scss
index 26dac6e6cf..90046b4451 100644
--- a/packages/clay-css/src/scss/components/_list-group.scss
+++ b/packages/clay-css/src/scss/components/_list-group.scss
@@ -18,21 +18,10 @@
 }
 
 .list-group {
-	@include border-radius($list-group-border-radius);
-	@include box-shadow($list-group-box-shadow);
-
-	color: $list-group-color;
-	display: flex;
-	flex-direction: column;
-	font-size: $list-group-font-size;
-	margin-bottom: $list-group-margin-bottom;
-	margin-top: $list-group-margin-top;
-	padding-left: 0;
+	@include clay-css($list-group);
 
 	.list-group {
-		@if ($list-group-box-shadow != null) {
-			@include box-shadow(none);
-		}
+		@include clay-css(map-get($list-group, list-group));
 	}
 }
 
diff --git a/packages/clay-css/src/scss/variables/_list-group.scss b/packages/clay-css/src/scss/variables/_list-group.scss
index 6c7f2542cc..5dc2d52d40 100644
--- a/packages/clay-css/src/scss/variables/_list-group.scss
+++ b/packages/clay-css/src/scss/variables/_list-group.scss
@@ -172,6 +172,25 @@ $list-group-link-color: null !default;
 $list-group-link-hover-color: null !default;
 $list-group-link-active-color: $white !default;
 
+$list-group: () !default;
+$list-group: map-deep-merge(
+	(
+		border-radius: clay-enable-rounded($list-group-border-radius),
+		box-shadow: clay-enable-shadows($list-group-box-shadow),
+		color: $list-group-color,
+		display: flex,
+		flex-direction: column,
+		font-size: $list-group-font-size,
+		margin-bottom: $list-group-margin-bottom,
+		margin-top: $list-group-margin-top,
+		padding-left: 0,
+		list-group: (
+			box-shadow: if($list-group-box-shadow != null, none, null),
+		),
+	),
+	$list-group
+);
+
 // List Group Item Variants
 
 $list-group-item-theme-colors: () !default;