From 267e4e048750c2c58a35fc3f27387e4e0f0bd9c5 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 8 May 2023 09:32:58 +0200
Subject: [PATCH] Ensure `repeating-conic-gradient` is detected as an image
 (#11180)

* ensure `repeating-conic-gradient` is detected as an image
* update changelog
---
 CHANGELOG.md                          | 1 +
 src/util/dataTypes.js                 | 3 ++-
 tests/arbitrary-values.oxide.test.css | 3 +++
 tests/arbitrary-values.test.css       | 3 +++
 tests/arbitrary-values.test.html      | 1 +
 5 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 192d587a1abc..0c64e55ed0f4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Fix issue where some pseudo-element variants generated the wrong selector ([#10943](https://github.com/tailwindlabs/tailwindcss/pull/10943), [#10962](https://github.com/tailwindlabs/tailwindcss/pull/10962))
 - Fix parsing of `theme()` inside `calc()` when there are no spaces around operators ([#11157](https://github.com/tailwindlabs/tailwindcss/pull/11157))
+- Ensure `repeating-conic-gradient` is detected as an image ([#11180](https://github.com/tailwindlabs/tailwindcss/pull/11180))
 
 ## [3.3.2] - 2023-04-25
 
diff --git a/src/util/dataTypes.js b/src/util/dataTypes.js
index b4e07c689b54..2f01aa3d20d0 100644
--- a/src/util/dataTypes.js
+++ b/src/util/dataTypes.js
@@ -188,11 +188,12 @@ export function image(value) {
 }
 
 let gradientTypes = new Set([
+  'conic-gradient',
   'linear-gradient',
   'radial-gradient',
+  'repeating-conic-gradient',
   'repeating-linear-gradient',
   'repeating-radial-gradient',
-  'conic-gradient',
 ])
 export function gradient(value) {
   value = normalize(value)
diff --git a/tests/arbitrary-values.oxide.test.css b/tests/arbitrary-values.oxide.test.css
index 97d838d7d452..214d086017ee 100644
--- a/tests/arbitrary-values.oxide.test.css
+++ b/tests/arbitrary-values.oxide.test.css
@@ -652,6 +652,9 @@
 .bg-\[linear-gradient\(to_left\,rgb\(var\(--green\)\)\,blue\)\] {
   background-image: linear-gradient(to left, rgb(var(--green)), blue);
 }
+.bg-\[repeating-conic-gradient\(\#F8F9FA_0\%_25\%\,_white_0\%_50\%\)\] {
+  background-image: repeating-conic-gradient(#f8f9fa 0% 25%, white 0% 50%);
+}
 .bg-\[url\(\'\/path-to-image\.png\'\)\] {
   background-image: url('/path-to-image.png');
 }
diff --git a/tests/arbitrary-values.test.css b/tests/arbitrary-values.test.css
index dee7669917e4..6f43a5277cc6 100644
--- a/tests/arbitrary-values.test.css
+++ b/tests/arbitrary-values.test.css
@@ -681,6 +681,9 @@
 .bg-\[linear-gradient\(to_left\,rgb\(var\(--green\)\)\,blue\)\] {
   background-image: linear-gradient(to left, rgb(var(--green)), blue);
 }
+.bg-\[repeating-conic-gradient\(\#F8F9FA_0\%_25\%\,_white_0\%_50\%\)\] {
+  background-image: repeating-conic-gradient(#f8f9fa 0% 25%, white 0% 50%);
+}
 .bg-\[url\(\'\/path-to-image\.png\'\)\] {
   background-image: url('/path-to-image.png');
 }
diff --git a/tests/arbitrary-values.test.html b/tests/arbitrary-values.test.html
index 7e65dbf45968..5dd6fab846d0 100644
--- a/tests/arbitrary-values.test.html
+++ b/tests/arbitrary-values.test.html
@@ -206,6 +206,7 @@
 <div class="bg-[var(--value1)_var(--value2)]"></div>
 <div class="bg-[color:var(--value1)_var(--value2)]"></div>
 <div class="bg-[linear-gradient(to_left,rgb(var(--green)),blue)]"></div>
+<div class="bg-[repeating-conic-gradient(#F8F9FA_0%_25%,_white_0%_50%)]"></div>
 
 <div class="bg-[url('/path-to-image.png')] bg-[url:var(--url)]"></div>
 <div class="bg-[linear-gradient(#eee,#fff)]"></div>