feat(progresscircle): resolving comments

Author: aramos-adobe

components/progresscircle/dist/metadata.json

@@ -1,7 +1,6 @@
 {
   "sourceFile": "index.css",
   "selectors": [
-    ".spectrum-Circle",
     ".spectrum-ProgressCircle",
     ".spectrum-ProgressCircle--indeterminate .spectrum-ProgressCircle-fill",
     ".spectrum-ProgressCircle--sizeL",
@@ -47,7 +46,6 @@
   "passthroughs": [],
   "high-contrast": [
     "--highcontrast-progress-circle-fill-border-color",
-    "--highcontrast-progress-circle-fill-border-color-over-background",
-    "--highcontrast-progressbar-track-color"
+    "--highcontrast-progress-circle-track-color"
   ]
 }

components/progresscircle/index.css

@@ -37,30 +37,6 @@ governing permissions and limitations under the License.
 	--spectrum-progress-circle-thickness: var(--spectrum-progress-circle-thickness-large);
 }
 
-.spectrum-Circle {
-	fill: none;
-}
-
-/* windows high contrast mode */
-@media (forced-colors: active) {
-	.spectrum-ProgressCircle {
-		/* fill is bright color */
-		--highcontrast-progress-circle-fill-border-color: Highlight;
-	}
-
-	.spectrum-ProgressCircle:not(.spectrum-ProgressCircle--indeterminate) {
-		.spectrum-innerCircle {
-			stroke: CanvasText;
-		}
-
-		.spectrum-outerCircle {
-			border: 1px solid;
-			border-color: CanvasText;
-			border-radius: 50%;
-		}
-	}
-}
-
 .spectrum-ProgressCircle {
 	display: inline-block;
 	inline-size: var(--mod-progress-circle-size, var(--spectrum-progress-circle-size));
@@ -92,7 +68,7 @@ governing permissions and limitations under the License.
 
 .spectrum-ProgressCircle-track {
 	stroke-width: var(--mod-progress-circle-thickness, var(--spectrum-progress-circle-thickness));
-	stroke: var(--highcontrast-progressbar-track-color, var(--mod-progress-circle-track-border-color, var(--spectrum-progress-circle-track-border-color)));
+	stroke: var(--highcontrast-progress-circle-track-color, var(--mod-progress-circle-track-border-color, var(--spectrum-progress-circle-track-border-color)));
 }
 
 /* circle progress filled */
@@ -108,8 +84,8 @@ governing permissions and limitations under the License.
 	.spectrum-ProgressCircle-fill {
 		will-change: transform;
 		animation:
-			1s cubic-bezier(.6, .1, .3, .9) infinite spectrum-fills-rotate,
-			1s cubic-bezier(.25, .1, .25, 1.3) infinite spectrum-dashoffset-animation;
+			1s cubic-bezier(0.6, 0.1, 0.3, 0.9) infinite spectrum-fills-rotate,
+			1s cubic-bezier(0.25, 0.1, 0.25, 1.3) infinite spectrum-dashoffset-animation;
 		transform-origin: center;
 	}
 }
@@ -119,8 +95,18 @@ governing permissions and limitations under the License.
 	.spectrum-ProgressCircle {
 		/* fill is bright color */
 		--highcontrast-progress-circle-fill-border-color: Highlight;
+		--highcontrast-progress-circle-track-color: Background;
+	}
+
+	.spectrum-ProgressCircle:not(.spectrum-ProgressCircle--indeterminate) {
+		.spectrum-innerCircle {
+			stroke: CanvasText;
+		}
 
-		/* fill over background is bright color */
-		--highcontrast-progress-circle-fill-border-color-over-background: Highlight;
+		.spectrum-outerCircle {
+			border: 1px solid;
+			border-color: CanvasText;
+			border-radius: 50%;
+		}
 	}
 }

components/progresscircle/stories/progresscircle.test.js

@@ -11,6 +11,10 @@ export const ProgressCircleGroup = Variants({
 			testHeading: "Static white",
 			staticColor: "white",
 		},
+		{
+			testHeading: "Static black",
+			staticColor: "black",
+		},
 	],
 	stateData: [
 		{