From 2bc10652ff9d7337c15eb8b3704678d0f2c700c9 Mon Sep 17 00:00:00 2001
From: Westbrook Johnson <westbrook.johnson@gmail.com>
Date: Mon, 19 Feb 2024 19:10:55 -0500
Subject: [PATCH] fix(progress-circle): ensure size can be applied to
 non-"size" attribute bearing elements

---
 packages/button/stories/index.ts              | 44 +++++++------------
 packages/button/stories/template.ts           |  1 -
 .../progress-circle/src/progress-circle.css   |  9 ++++
 .../story-decorator/src/StoryDecorator.ts     |  1 +
 4 files changed, 25 insertions(+), 30 deletions(-)

diff --git a/packages/button/stories/index.ts b/packages/button/stories/index.ts
index 123ae314e2..a576d0fff7 100644
--- a/packages/button/stories/index.ts
+++ b/packages/button/stories/index.ts
@@ -116,35 +116,21 @@ export const makeOverBackground =
     };
 
 export function renderButton(properties: Properties): TemplateResult {
-    if (properties.variant) {
-        return html`
-            <sp-button
-                variant="${properties.variant}"
-                treatment="${properties.treatment}"
-                ?quiet="${!!properties.quiet}"
-                ?disabled=${!!properties.disabled}
-                size=${properties.size || 'm'}
-                href=${ifDefined(properties.href)}
-                target=${ifDefined(properties.target)}
-                ?warning=${properties.warning}
-                ?pending=${!!properties.pending}
-                ?icon-only=${properties.iconOnly}
-            >
-                ${properties.content || 'Click Me'}
-            </sp-button>
-        `;
-    } else {
-        return html`
-            <sp-button
-                ?quiet="${!!properties.quiet}"
-                ?disabled=${!!properties.disabled}
-                size=${properties.size}
-                ?pending=${!!properties.pending}
-            >
-                ${properties.content || 'Click Me'}
-            </sp-button>
-        `;
-    }
+    return html`
+        <sp-button
+            ?disabled=${!!properties.disabled}
+            href=${ifDefined(properties.href)}
+            ?icon-only=${properties.iconOnly}
+            ?pending=${!!properties.pending}
+            ?quiet="${!!properties.quiet}"
+            size=${properties.size}
+            target=${ifDefined(properties.target)}
+            treatment=${ifDefined(properties.treatment)}
+            variant=${ifDefined(properties.variant)}
+        >
+            ${properties.content || 'Click Me'}
+        </sp-button>
+    `;
 }
 
 export function renderButtonSet(properties: Properties): TemplateResult {
diff --git a/packages/button/stories/template.ts b/packages/button/stories/template.ts
index eda44730af..dc39df9a97 100644
--- a/packages/button/stories/template.ts
+++ b/packages/button/stories/template.ts
@@ -27,7 +27,6 @@ export interface Properties {
     size?: 's' | 'm' | 'l' | 'xl';
     href?: string;
     target?: '_blank' | '_parent' | '_self' | '_top';
-    warning?: boolean;
     iconOnly?: boolean;
 }
 
diff --git a/packages/progress-circle/src/progress-circle.css b/packages/progress-circle/src/progress-circle.css
index 2bcfe7e82c..3320308f6e 100644
--- a/packages/progress-circle/src/progress-circle.css
+++ b/packages/progress-circle/src/progress-circle.css
@@ -22,6 +22,7 @@ governing permissions and limitations under the License.
         var(--_spectrum-progress-circle-size)
     );
 
+    --spectrum-progress-circle-size: inherit;
     --spectrum-progresscircle-m-over-background-track-fill-color: var(
         --spectrum-alias-track-fill-color-overbackground
     );
@@ -78,3 +79,11 @@ slot {
         var(--_spectrum-progress-circle-size)
     );
 }
+
+/* stylelint-disable */
+:host([indeterminate]) .fills,
+:host([indeterminate]) .fillSubMask1,
+:host([indeterminate]) .fillSubMask2 {
+    animation-duration: var(--spectrum-animation-duration-2000);
+}
+/* stylelint-enable */
diff --git a/projects/story-decorator/src/StoryDecorator.ts b/projects/story-decorator/src/StoryDecorator.ts
index 473efc776f..f327e06651 100644
--- a/projects/story-decorator/src/StoryDecorator.ts
+++ b/projects/story-decorator/src/StoryDecorator.ts
@@ -89,6 +89,7 @@ const reduceMotionProperties = css`
     --spectrum-animation-duration-2000: 0ms;
     --spectrum-animation-duration-4000: 0ms;
     --spectrum-animation-duration-6000: 0ms;
+    --pending-delay: 0s;
     --spectrum-coachmark-animation-indicator-ring-duration: 0ms;
     --swc-test-duration: 1ms;
 `;