@spectrum-web-components/progress-circle 0.6.0 → 0.7.1

package/README.md

@@ -51,9 +51,9 @@ An `<sp-progress-circle>` is used to visually show the progression of a system o
 </div>
 ```
 
-### Over background
+### Static
 
-When a loader needs to be placed on top of a colored background, use the over background loader as signified by `[over-background]`. This loader uses a white opaque color no matter the background. Make sure the background offers enough contrast for the loader to be legible.
+If you display your `<sp-progress-cicle>` element over the top of other content, e.g. an image or an alternate background color, it may become appropariate to update the colors with which the circle and loading progress indicator are delivered. To do this, leverage the `static` attribute with the value of `white` to ensure the content of your page is being delivered accessibly.
 
 ```html
 <div
@@ -62,18 +62,18 @@ When a loader needs to be placed on top of a colored background, use the over ba
     <sp-progress-circle
         label="A small representation of a partially completed action"
         progress="42"
-        over-background
+        static="white"
         size="s"
     ></sp-progress-circle>
     <sp-progress-circle
         label="A medium representation of a barely started action"
         progress="7"
-        over-background
+        static="white"
     ></sp-progress-circle>
     <sp-progress-circle
         label="A large representation of a somewhat completed action"
         progress="68"
-        over-background
+        static="white"
         size="l"
     ></sp-progress-circle>
 </div>

package/custom-elements.json

@@ -58,6 +58,16 @@
               "attribute": "over-background",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "static",
+              "type": {
+                "text": "'white' | undefined"
+              },
+              "privacy": "public",
+              "attribute": "static",
+              "reflects": true
+            },
             {
               "kind": "field",
               "name": "progress",
@@ -112,6 +122,13 @@
               "default": "false",
               "fieldName": "overBackground"
             },
+            {
+              "name": "static",
+              "type": {
+                "text": "'white' | undefined"
+              },
+              "fieldName": "static"
+            },
             {
               "name": "progress",
               "type": {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/progress-circle",
-    "version": "0.6.0",
+    "version": "0.7.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.7.0",
-        "tslib": "^2.0.0"
+        "@spectrum-web-components/base": "^0.7.1"
     },
     "devDependencies": {
-        "@spectrum-css/progresscircle": "^1.0.23"
+        "@spectrum-css/progresscircle": "^2.0.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
@@ -69,5 +68,5 @@
         "./sp-*.js",
         "./**/*.dev.js"
     ],
-    "gitHead": "05c81318844160db3f8156144106e643507fef97"
+    "gitHead": "8bd87724e91e23df83dbf63a434bbbe10b8daaa6"
 }

package/sp-progress-circle.dev.js

@@ -1,3 +1,4 @@
+"use strict";
 import { ProgressCircle } from "./src/ProgressCircle.dev.js";
 customElements.define("sp-progress-circle", ProgressCircle);
 //# sourceMappingURL=sp-progress-circle.dev.js.map

package/sp-progress-circle.dev.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["sp-progress-circle.ts"],
   "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { ProgressCircle } from './src/ProgressCircle.dev.js'\n\ncustomElements.define('sp-progress-circle', ProgressCircle);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-progress-circle': ProgressCircle;\n    }\n}\n"],
-  "mappings": "AAYA;AAEA,eAAe,OAAO,sBAAsB,cAAc;",
+  "mappings": ";AAYA,SAAS,sBAAsB;AAE/B,eAAe,OAAO,sBAAsB,cAAc;",
   "names": []
 }

package/sp-progress-circle.js

@@ -1,2 +1,2 @@
-import{ProgressCircle as e}from"./src/ProgressCircle.js";customElements.define("sp-progress-circle",e);
+"use strict";import{ProgressCircle as e}from"./src/ProgressCircle.js";customElements.define("sp-progress-circle",e);
 //# sourceMappingURL=sp-progress-circle.js.map

package/sp-progress-circle.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["sp-progress-circle.ts"],
   "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { ProgressCircle } from './src/ProgressCircle.js';\n\ncustomElements.define('sp-progress-circle', ProgressCircle);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-progress-circle': ProgressCircle;\n    }\n}\n"],
-  "mappings": "AAYA,yDAEA,eAAe,OAAO,qBAAsB,CAAc",
-  "names": []
+  "mappings": "aAYA,OAAS,kBAAAA,MAAsB,0BAE/B,eAAe,OAAO,qBAAsBA,CAAc",
+  "names": ["ProgressCircle"]
 }

package/src/ProgressCircle.d.ts

@@ -11,8 +11,10 @@ export declare class ProgressCircle extends ProgressCircle_base {
     indeterminate: boolean;
     label: string;
     overBackground: boolean;
+    static?: 'white';
     progress: number;
     private makeRotation;
+    protected willUpdate(changes: PropertyValues<this>): void;
     protected render(): TemplateResult;
     protected firstUpdated(changes: PropertyValues): void;
     protected updated(changes: PropertyValues): void;

package/src/ProgressCircle.dev.js

@@ -1,3 +1,4 @@
+"use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
@@ -33,16 +34,34 @@ export class ProgressCircle extends SizedMixin(SpectrumElement, {
   makeRotation(rotation) {
     return this.indeterminate ? void 0 : `transform: rotate(${rotation}deg);`;
   }
+  willUpdate(changes) {
+    if (changes.has("overBackground")) {
+      this.static = this.overBackground ? "white" : this.static || void 0;
+      if (true) {
+        if (this.overBackground) {
+          window.__swc.warn(
+            this,
+            `<${this.localName}> element will stop accepting the "over-background" attribute, and its related "overBackground" property in a future release. Use the "static" attribute/property with a value of "white" instead.`,
+            "https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#static",
+            { level: "deprecation" }
+          );
+        }
+      }
+    }
+  }
   render() {
     const styles = [
       this.makeRotation(-180 + 180 / 50 * Math.min(this.progress, 50)),
-      this.makeRotation(-180 + 180 / 50 * Math.max(this.progress - 50, 0))
+      this.makeRotation(
+        -180 + 180 / 50 * Math.max(this.progress - 50, 0)
+      )
     ];
     const masks = ["Mask1", "Mask2"];
     return html`
             <div class="track"></div>
             <div class="fills">
-                ${masks.map((mask, index) => html`
+                ${masks.map(
+      (mask, index) => html`
                         <div class="fill${mask}">
                             <div
                                 class="fillSub${mask}"
@@ -51,7 +70,8 @@ export class ProgressCircle extends SizedMixin(SpectrumElement, {
                                 <div class="fill"></div>
                             </div>
                         </div>
-                    `)}
+                    `
+    )}
             </div>
         `;
   }
@@ -73,14 +93,19 @@ export class ProgressCircle extends SizedMixin(SpectrumElement, {
     }
     if (true) {
       if (!this.label && !this.getAttribute("aria-label") && !this.getAttribute("aria-labelledby")) {
-        window.__swc.warn(this, "<sp-progress-circle> elements will not be accessible to screen readers without one of the following:", "https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility", {
-          type: "accessibility",
-          issues: [
-            'value supplied to the "label" attribute, which will be displayed visually as part of the element, or',
-            'value supplied to the "aria-label" attribute, which will only be provided to screen readers, or',
-            'an element ID reference supplied to the "aria-labelledby" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.'
-          ]
-        });
+        window.__swc.warn(
+          this,
+          "<sp-progress-circle> elements will not be accessible to screen readers without one of the following:",
+          "https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility",
+          {
+            type: "accessibility",
+            issues: [
+              'value supplied to the "label" attribute, which will be displayed visually as part of the element, or',
+              'value supplied to the "aria-label" attribute, which will only be provided to screen readers, or',
+              'an element ID reference supplied to the "aria-labelledby" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.'
+            ]
+          }
+        );
       }
     }
   }
@@ -94,6 +119,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean, reflect: true, attribute: "over-background" })
 ], ProgressCircle.prototype, "overBackground", 2);
+__decorateClass([
+  property({ reflect: true })
+], ProgressCircle.prototype, "static", 2);
 __decorateClass([
   property({ type: Number })
 ], ProgressCircle.prototype, "progress", 2);

package/src/ProgressCircle.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["ProgressCircle.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    html,\n    PropertyValues,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport progressCircleStyles from './progress-circle.css.js';\n\n/**\n * @element sp-progress-circle\n */\nexport class ProgressCircle extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm', 'l'],\n}) {\n    public static override get styles(): CSSResultArray {\n        return [progressCircleStyles];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public indeterminate = false;\n\n    @property({ type: String })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n    public overBackground = false;\n\n    @property({ type: Number })\n    public progress = 0;\n\n    private makeRotation(rotation: number): string | undefined {\n        return this.indeterminate\n            ? undefined\n            : `transform: rotate(${rotation}deg);`;\n    }\n\n    protected override render(): TemplateResult {\n        const styles = [\n            this.makeRotation(-180 + (180 / 50) * Math.min(this.progress, 50)),\n            this.makeRotation(\n                -180 + (180 / 50) * Math.max(this.progress - 50, 0)\n            ),\n        ];\n        const masks = ['Mask1', 'Mask2'];\n        return html`\n            <div class=\"track\"></div>\n            <div class=\"fills\">\n                ${masks.map(\n                    (mask, index) => html`\n                        <div class=\"fill${mask}\">\n                            <div\n                                class=\"fillSub${mask}\"\n                                style=${ifDefined(styles[index])}\n                            >\n                                <div class=\"fill\"></div>\n                            </div>\n                        </div>\n                    `\n                )}\n            </div>\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        if (!this.hasAttribute('role')) {\n            this.setAttribute('role', 'progressbar');\n        }\n    }\n\n    protected override updated(changes: PropertyValues): void {\n        super.updated(changes);\n        if (!this.indeterminate && changes.has('progress')) {\n            this.setAttribute('aria-valuenow', '' + this.progress);\n        } else if (this.hasAttribute('aria-valuenow')) {\n            this.removeAttribute('aria-valuenow');\n        }\n        if (this.label && changes.has('label')) {\n            this.setAttribute('aria-label', this.label);\n        }\n\n        if (window.__swc.DEBUG) {\n            if (\n                !this.label &&\n                !this.getAttribute('aria-label') &&\n                !this.getAttribute('aria-labelledby')\n            ) {\n                window.__swc.warn(\n                    this,\n                    '<sp-progress-circle> elements will not be accessible to screen readers without one of the following:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility',\n                    {\n                        type: 'accessibility',\n                        issues: [\n                            'value supplied to the \"label\" attribute, which will be displayed visually as part of the element, or',\n                            'value supplied to the \"aria-label\" attribute, which will only be provided to screen readers, or',\n                            'an element ID reference supplied to the \"aria-labelledby\" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.',\n                        ]\n                    },\n                );\n            }\n        }\n    }\n}\n"],
-  "mappings": ";;;;;;;;;;;AAYA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAEA;AAKO,aAAM,uBAAuB,WAAW,iBAAiB;AAAA,EAC5D,YAAY,CAAC,KAAK,KAAK,GAAG;AAC9B,CAAC,EAAE;AAAA,EAFI;AAAA;AAQI,yBAAgB;AAGhB,iBAAQ;AAGR,0BAAiB;AAGjB,oBAAW;AAAA;AAAA,aAdS,SAAyB;AAChD,WAAO,CAAC,oBAAoB;AAAA,EAChC;AAAA,EAcQ,aAAa,UAAsC;AACvD,WAAO,KAAK,gBACN,SACA,qBAAqB;AAAA,EAC/B;AAAA,EAEmB,SAAyB;AACxC,UAAM,SAAS;AAAA,MACX,KAAK,aAAa,OAAQ,MAAM,KAAM,KAAK,IAAI,KAAK,UAAU,EAAE,CAAC;AAAA,MACjE,KAAK,aACD,OAAQ,MAAM,KAAM,KAAK,IAAI,KAAK,WAAW,IAAI,CAAC,CACtD;AAAA,IACJ;AACA,UAAM,QAAQ,CAAC,SAAS,OAAO;AAC/B,WAAO;AAAA;AAAA;AAAA,kBAGG,MAAM,IACJ,CAAC,MAAM,UAAU;AAAA,0CACK;AAAA;AAAA,gDAEM;AAAA,wCACR,UAAU,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,qBAM/C;AAAA;AAAA;AAAA,EAGZ;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,QAAI,CAAC,KAAK,aAAa,MAAM,GAAG;AAC5B,WAAK,aAAa,QAAQ,aAAa;AAAA,IAC3C;AAAA,EACJ;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,CAAC,KAAK,iBAAiB,QAAQ,IAAI,UAAU,GAAG;AAChD,WAAK,aAAa,iBAAiB,KAAK,KAAK,QAAQ;AAAA,IACzD,WAAW,KAAK,aAAa,eAAe,GAAG;AAC3C,WAAK,gBAAgB,eAAe;AAAA,IACxC;AACA,QAAI,KAAK,SAAS,QAAQ,IAAI,OAAO,GAAG;AACpC,WAAK,aAAa,cAAc,KAAK,KAAK;AAAA,IAC9C;AAEA,QAAI,MAAoB;AACpB,UACI,CAAC,KAAK,SACN,CAAC,KAAK,aAAa,YAAY,KAC/B,CAAC,KAAK,aAAa,iBAAiB,GACtC;AACE,eAAO,MAAM,KACT,MACA,wGACA,kGACA;AAAA,UACI,MAAM;AAAA,UACN,QAAQ;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,UACJ;AAAA,QACJ,CACJ;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;AApFW;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GACnC,AARJ,eAQI;AAGA;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GACnB,AAXJ,eAWI;AAGA;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,kBAAkB,CAAC;AAAA,GACjE,AAdJ,eAcI;AAGA;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GACnB,AAjBJ,eAiBI;",
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    html,\n    PropertyValues,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport progressCircleStyles from './progress-circle.css.js';\n\n/**\n * @element sp-progress-circle\n */\nexport class ProgressCircle extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm', 'l'],\n}) {\n    public static override get styles(): CSSResultArray {\n        return [progressCircleStyles];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public indeterminate = false;\n\n    @property({ type: String })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n    public overBackground = false;\n\n    @property({ reflect: true })\n    public static?: 'white';\n\n    @property({ type: Number })\n    public progress = 0;\n\n    private makeRotation(rotation: number): string | undefined {\n        return this.indeterminate\n            ? undefined\n            : `transform: rotate(${rotation}deg);`;\n    }\n\n    protected override willUpdate(changes: PropertyValues<this>): void {\n        if (changes.has('overBackground')) {\n            // Apply \"static\" from \"overBackground\", preferring \"static\",\n            // until the deprecation period is over.\n            this.static = this.overBackground\n                ? 'white'\n                : this.static || undefined;\n            if (window.__swc.DEBUG) {\n                if (this.overBackground) {\n                    window.__swc.warn(\n                        this,\n                        `<${this.localName}> element will stop accepting the \"over-background\" attribute, and its related \"overBackground\" property in a future release. Use the \"static\" attribute/property with a value of \"white\" instead.`,\n                        'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#static',\n                        { level: 'deprecation' }\n                    );\n                }\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        const styles = [\n            this.makeRotation(-180 + (180 / 50) * Math.min(this.progress, 50)),\n            this.makeRotation(\n                -180 + (180 / 50) * Math.max(this.progress - 50, 0)\n            ),\n        ];\n        const masks = ['Mask1', 'Mask2'];\n        return html`\n            <div class=\"track\"></div>\n            <div class=\"fills\">\n                ${masks.map(\n                    (mask, index) => html`\n                        <div class=\"fill${mask}\">\n                            <div\n                                class=\"fillSub${mask}\"\n                                style=${ifDefined(styles[index])}\n                            >\n                                <div class=\"fill\"></div>\n                            </div>\n                        </div>\n                    `\n                )}\n            </div>\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        if (!this.hasAttribute('role')) {\n            this.setAttribute('role', 'progressbar');\n        }\n    }\n\n    protected override updated(changes: PropertyValues): void {\n        super.updated(changes);\n        if (!this.indeterminate && changes.has('progress')) {\n            this.setAttribute('aria-valuenow', '' + this.progress);\n        } else if (this.hasAttribute('aria-valuenow')) {\n            this.removeAttribute('aria-valuenow');\n        }\n        if (this.label && changes.has('label')) {\n            this.setAttribute('aria-label', this.label);\n        }\n\n        if (window.__swc.DEBUG) {\n            if (\n                !this.label &&\n                !this.getAttribute('aria-label') &&\n                !this.getAttribute('aria-labelledby')\n            ) {\n                window.__swc.warn(\n                    this,\n                    '<sp-progress-circle> elements will not be accessible to screen readers without one of the following:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility',\n                    {\n                        type: 'accessibility',\n                        issues: [\n                            'value supplied to the \"label\" attribute, which will be displayed visually as part of the element, or',\n                            'value supplied to the \"aria-label\" attribute, which will only be provided to screen readers, or',\n                            'an element ID reference supplied to the \"aria-labelledby\" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.',\n                        ],\n                    }\n                );\n            }\n        }\n    }\n}\n"],
+  "mappings": ";;;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAE1B,OAAO,0BAA0B;AAK1B,aAAM,uBAAuB,WAAW,iBAAiB;AAAA,EAC5D,YAAY,CAAC,KAAK,KAAK,GAAG;AAC9B,CAAC,EAAE;AAAA,EAFI;AAAA;AAQH,SAAO,gBAAgB;AAGvB,SAAO,QAAQ;AAGf,SAAO,iBAAiB;AAMxB,SAAO,WAAW;AAAA;AAAA,EAjBlB,WAA2B,SAAyB;AAChD,WAAO,CAAC,oBAAoB;AAAA,EAChC;AAAA,EAiBQ,aAAa,UAAsC;AACvD,WAAO,KAAK,gBACN,SACA,qBAAqB;AAAA,EAC/B;AAAA,EAEmB,WAAW,SAAqC;AAC/D,QAAI,QAAQ,IAAI,gBAAgB,GAAG;AAG/B,WAAK,SAAS,KAAK,iBACb,UACA,KAAK,UAAU;AACrB,UAAI,MAAoB;AACpB,YAAI,KAAK,gBAAgB;AACrB,iBAAO,MAAM;AAAA,YACT;AAAA,YACA,IAAI,KAAK;AAAA,YACT;AAAA,YACA,EAAE,OAAO,cAAc;AAAA,UAC3B;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,UAAM,SAAS;AAAA,MACX,KAAK,aAAa,OAAQ,MAAM,KAAM,KAAK,IAAI,KAAK,UAAU,EAAE,CAAC;AAAA,MACjE,KAAK;AAAA,QACD,OAAQ,MAAM,KAAM,KAAK,IAAI,KAAK,WAAW,IAAI,CAAC;AAAA,MACtD;AAAA,IACJ;AACA,UAAM,QAAQ,CAAC,SAAS,OAAO;AAC/B,WAAO;AAAA;AAAA;AAAA,kBAGG,MAAM;AAAA,MACJ,CAAC,MAAM,UAAU;AAAA,0CACK;AAAA;AAAA,gDAEM;AAAA,wCACR,UAAU,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAM/C;AAAA;AAAA;AAAA,EAGZ;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,QAAI,CAAC,KAAK,aAAa,MAAM,GAAG;AAC5B,WAAK,aAAa,QAAQ,aAAa;AAAA,IAC3C;AAAA,EACJ;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,CAAC,KAAK,iBAAiB,QAAQ,IAAI,UAAU,GAAG;AAChD,WAAK,aAAa,iBAAiB,KAAK,KAAK,QAAQ;AAAA,IACzD,WAAW,KAAK,aAAa,eAAe,GAAG;AAC3C,WAAK,gBAAgB,eAAe;AAAA,IACxC;AACA,QAAI,KAAK,SAAS,QAAQ,IAAI,OAAO,GAAG;AACpC,WAAK,aAAa,cAAc,KAAK,KAAK;AAAA,IAC9C;AAEA,QAAI,MAAoB;AACpB,UACI,CAAC,KAAK,SACN,CAAC,KAAK,aAAa,YAAY,KAC/B,CAAC,KAAK,aAAa,iBAAiB,GACtC;AACE,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,YACI,MAAM;AAAA,YACN,QAAQ;AAAA,cACJ;AAAA,cACA;AAAA,cACA;AAAA,YACJ;AAAA,UACJ;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;AA3GW;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAPjC,eAQF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAVjB,eAWF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,kBAAkB,CAAC;AAAA,GAb/D,eAcF;AAGA;AAAA,EADN,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAhBlB,eAiBF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAnBjB,eAoBF;",
   "names": []
 }

package/src/ProgressCircle.js

@@ -1,16 +1,16 @@
-var n=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var r=(l,e,s,i)=>{for(var t=i>1?void 0:i?u(e,s):e,o=l.length-1,d;o>=0;o--)(d=l[o])&&(t=(i?d(e,s,t):d(t))||t);return i&&t&&n(e,s,t),t};import{html as p,SizedMixin as b,SpectrumElement as c}from"@spectrum-web-components/base";import{property as a}from"@spectrum-web-components/base/src/decorators.js";import{ifDefined as h}from"@spectrum-web-components/base/src/directives.js";import m from"./progress-circle.css.js";export class ProgressCircle extends b(c,{validSizes:["s","m","l"]}){constructor(){super(...arguments);this.indeterminate=!1;this.label="";this.overBackground=!1;this.progress=0}static get styles(){return[m]}makeRotation(e){return this.indeterminate?void 0:`transform: rotate(${e}deg);`}render(){const e=[this.makeRotation(-180+3.6*Math.min(this.progress,50)),this.makeRotation(-180+3.6*Math.max(this.progress-50,0))];return p`
+"use strict";var p=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var i=(o,r,e,s)=>{for(var t=s>1?void 0:s?u(r,e):r,a=o.length-1,d;a>=0;a--)(d=o[a])&&(t=(s?d(r,e,t):d(t))||t);return s&&t&&p(r,e,t),t};import{html as n,SizedMixin as c,SpectrumElement as b}from"@spectrum-web-components/base";import{property as l}from"@spectrum-web-components/base/src/decorators.js";import{ifDefined as h}from"@spectrum-web-components/base/src/directives.js";import m from"./progress-circle.css.js";export class ProgressCircle extends c(b,{validSizes:["s","m","l"]}){constructor(){super(...arguments);this.indeterminate=!1;this.label="";this.overBackground=!1;this.progress=0}static get styles(){return[m]}makeRotation(e){return this.indeterminate?void 0:`transform: rotate(${e}deg);`}willUpdate(e){e.has("overBackground")&&(this.static=this.overBackground?"white":this.static||void 0)}render(){const e=[this.makeRotation(-180+3.6*Math.min(this.progress,50)),this.makeRotation(-180+3.6*Math.max(this.progress-50,0))];return n`
             <div class="track"></div>
             <div class="fills">
-                ${["Mask1","Mask2"].map((i,t)=>p`
-                        <div class="fill${i}">
+                ${["Mask1","Mask2"].map((t,a)=>n`
+                        <div class="fill${t}">
                             <div
-                                class="fillSub${i}"
-                                style=${h(e[t])}
+                                class="fillSub${t}"
+                                style=${h(e[a])}
                             >
                                 <div class="fill"></div>
                             </div>
                         </div>
                     `)}
             </div>
-        `}firstUpdated(e){super.firstUpdated(e),this.hasAttribute("role")||this.setAttribute("role","progressbar")}updated(e){super.updated(e),!this.indeterminate&&e.has("progress")?this.setAttribute("aria-valuenow",""+this.progress):this.hasAttribute("aria-valuenow")&&this.removeAttribute("aria-valuenow"),this.label&&e.has("label")&&this.setAttribute("aria-label",this.label)}}r([a({type:Boolean,reflect:!0})],ProgressCircle.prototype,"indeterminate",2),r([a({type:String})],ProgressCircle.prototype,"label",2),r([a({type:Boolean,reflect:!0,attribute:"over-background"})],ProgressCircle.prototype,"overBackground",2),r([a({type:Number})],ProgressCircle.prototype,"progress",2);
+        `}firstUpdated(e){super.firstUpdated(e),this.hasAttribute("role")||this.setAttribute("role","progressbar")}updated(e){super.updated(e),!this.indeterminate&&e.has("progress")?this.setAttribute("aria-valuenow",""+this.progress):this.hasAttribute("aria-valuenow")&&this.removeAttribute("aria-valuenow"),this.label&&e.has("label")&&this.setAttribute("aria-label",this.label)}}i([l({type:Boolean,reflect:!0})],ProgressCircle.prototype,"indeterminate",2),i([l({type:String})],ProgressCircle.prototype,"label",2),i([l({type:Boolean,reflect:!0,attribute:"over-background"})],ProgressCircle.prototype,"overBackground",2),i([l({reflect:!0})],ProgressCircle.prototype,"static",2),i([l({type:Number})],ProgressCircle.prototype,"progress",2);
 //# sourceMappingURL=ProgressCircle.js.map

package/src/ProgressCircle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["ProgressCircle.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    html,\n    PropertyValues,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport progressCircleStyles from './progress-circle.css.js';\n\n/**\n * @element sp-progress-circle\n */\nexport class ProgressCircle extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm', 'l'],\n}) {\n    public static override get styles(): CSSResultArray {\n        return [progressCircleStyles];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public indeterminate = false;\n\n    @property({ type: String })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n    public overBackground = false;\n\n    @property({ type: Number })\n    public progress = 0;\n\n    private makeRotation(rotation: number): string | undefined {\n        return this.indeterminate\n            ? undefined\n            : `transform: rotate(${rotation}deg);`;\n    }\n\n    protected override render(): TemplateResult {\n        const styles = [\n            this.makeRotation(-180 + (180 / 50) * Math.min(this.progress, 50)),\n            this.makeRotation(\n                -180 + (180 / 50) * Math.max(this.progress - 50, 0)\n            ),\n        ];\n        const masks = ['Mask1', 'Mask2'];\n        return html`\n            <div class=\"track\"></div>\n            <div class=\"fills\">\n                ${masks.map(\n                    (mask, index) => html`\n                        <div class=\"fill${mask}\">\n                            <div\n                                class=\"fillSub${mask}\"\n                                style=${ifDefined(styles[index])}\n                            >\n                                <div class=\"fill\"></div>\n                            </div>\n                        </div>\n                    `\n                )}\n            </div>\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        if (!this.hasAttribute('role')) {\n            this.setAttribute('role', 'progressbar');\n        }\n    }\n\n    protected override updated(changes: PropertyValues): void {\n        super.updated(changes);\n        if (!this.indeterminate && changes.has('progress')) {\n            this.setAttribute('aria-valuenow', '' + this.progress);\n        } else if (this.hasAttribute('aria-valuenow')) {\n            this.removeAttribute('aria-valuenow');\n        }\n        if (this.label && changes.has('label')) {\n            this.setAttribute('aria-label', this.label);\n        }\n\n        if (window.__swc.DEBUG) {\n            if (\n                !this.label &&\n                !this.getAttribute('aria-label') &&\n                !this.getAttribute('aria-labelledby')\n            ) {\n                window.__swc.warn(\n                    this,\n                    '<sp-progress-circle> elements will not be accessible to screen readers without one of the following:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility',\n                    {\n                        type: 'accessibility',\n                        issues: [\n                            'value supplied to the \"label\" attribute, which will be displayed visually as part of the element, or',\n                            'value supplied to the \"aria-label\" attribute, which will only be provided to screen readers, or',\n                            'an element ID reference supplied to the \"aria-labelledby\" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.',\n                        ]\n                    },\n                );\n            }\n        }\n    }\n}\n"],
-  "mappings": "wMAYA,0FAQA,2EACA,4EAEA,wCAKO,aAAM,sBAAuB,GAAW,EAAiB,CAC5D,WAAY,CAAC,IAAK,IAAK,GAAG,CAC9B,CAAC,CAAE,CAFI,kCAQI,mBAAgB,GAGhB,WAAQ,GAGR,oBAAiB,GAGjB,cAAW,YAdS,SAAyB,CAChD,MAAO,CAAC,CAAoB,CAChC,CAcQ,aAAa,EAAsC,CACvD,MAAO,MAAK,cACN,OACA,qBAAqB,QAC/B,CAEmB,QAAyB,CACxC,KAAM,GAAS,CACX,KAAK,aAAa,KAAQ,IAAY,KAAK,IAAI,KAAK,SAAU,EAAE,CAAC,EACjE,KAAK,aACD,KAAQ,IAAY,KAAK,IAAI,KAAK,SAAW,GAAI,CAAC,CACtD,CACJ,EAEA,MAAO;AAAA;AAAA;AAAA,kBAGG,AAJI,CAAC,QAAS,OAAO,EAIf,IACJ,CAAC,EAAM,IAAU;AAAA,0CACK;AAAA;AAAA,gDAEM;AAAA,wCACR,EAAU,EAAO,EAAM;AAAA;AAAA;AAAA;AAAA;AAAA,qBAM/C;AAAA;AAAA,SAGZ,CAEmB,aAAa,EAA+B,CAC3D,MAAM,aAAa,CAAO,EACrB,KAAK,aAAa,MAAM,GACzB,KAAK,aAAa,OAAQ,aAAa,CAE/C,CAEmB,QAAQ,EAA+B,CACtD,MAAM,QAAQ,CAAO,EACrB,AAAI,CAAC,KAAK,eAAiB,EAAQ,IAAI,UAAU,EAC7C,KAAK,aAAa,gBAAiB,GAAK,KAAK,QAAQ,EAC9C,KAAK,aAAa,eAAe,GACxC,KAAK,gBAAgB,eAAe,EAEpC,KAAK,OAAS,EAAQ,IAAI,OAAO,GACjC,KAAK,aAAa,aAAc,KAAK,KAAK,CAwBlD,CACJ,CApFW,GADP,AAAC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GACnC,AARJ,eAQI,6BAGA,GADP,AAAC,EAAS,CAAE,KAAM,MAAO,CAAC,GACnB,AAXJ,eAWI,qBAGA,GADP,AAAC,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,iBAAkB,CAAC,GACjE,AAdJ,eAcI,8BAGA,GADP,AAAC,EAAS,CAAE,KAAM,MAAO,CAAC,GACnB,AAjBJ,eAiBI",
-  "names": []
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    html,\n    PropertyValues,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\nimport progressCircleStyles from './progress-circle.css.js';\n\n/**\n * @element sp-progress-circle\n */\nexport class ProgressCircle extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm', 'l'],\n}) {\n    public static override get styles(): CSSResultArray {\n        return [progressCircleStyles];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public indeterminate = false;\n\n    @property({ type: String })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n    public overBackground = false;\n\n    @property({ reflect: true })\n    public static?: 'white';\n\n    @property({ type: Number })\n    public progress = 0;\n\n    private makeRotation(rotation: number): string | undefined {\n        return this.indeterminate\n            ? undefined\n            : `transform: rotate(${rotation}deg);`;\n    }\n\n    protected override willUpdate(changes: PropertyValues<this>): void {\n        if (changes.has('overBackground')) {\n            // Apply \"static\" from \"overBackground\", preferring \"static\",\n            // until the deprecation period is over.\n            this.static = this.overBackground\n                ? 'white'\n                : this.static || undefined;\n            if (window.__swc.DEBUG) {\n                if (this.overBackground) {\n                    window.__swc.warn(\n                        this,\n                        `<${this.localName}> element will stop accepting the \"over-background\" attribute, and its related \"overBackground\" property in a future release. Use the \"static\" attribute/property with a value of \"white\" instead.`,\n                        'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#static',\n                        { level: 'deprecation' }\n                    );\n                }\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        const styles = [\n            this.makeRotation(-180 + (180 / 50) * Math.min(this.progress, 50)),\n            this.makeRotation(\n                -180 + (180 / 50) * Math.max(this.progress - 50, 0)\n            ),\n        ];\n        const masks = ['Mask1', 'Mask2'];\n        return html`\n            <div class=\"track\"></div>\n            <div class=\"fills\">\n                ${masks.map(\n                    (mask, index) => html`\n                        <div class=\"fill${mask}\">\n                            <div\n                                class=\"fillSub${mask}\"\n                                style=${ifDefined(styles[index])}\n                            >\n                                <div class=\"fill\"></div>\n                            </div>\n                        </div>\n                    `\n                )}\n            </div>\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        if (!this.hasAttribute('role')) {\n            this.setAttribute('role', 'progressbar');\n        }\n    }\n\n    protected override updated(changes: PropertyValues): void {\n        super.updated(changes);\n        if (!this.indeterminate && changes.has('progress')) {\n            this.setAttribute('aria-valuenow', '' + this.progress);\n        } else if (this.hasAttribute('aria-valuenow')) {\n            this.removeAttribute('aria-valuenow');\n        }\n        if (this.label && changes.has('label')) {\n            this.setAttribute('aria-label', this.label);\n        }\n\n        if (window.__swc.DEBUG) {\n            if (\n                !this.label &&\n                !this.getAttribute('aria-label') &&\n                !this.getAttribute('aria-labelledby')\n            ) {\n                window.__swc.warn(\n                    this,\n                    '<sp-progress-circle> elements will not be accessible to screen readers without one of the following:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/progress-circle/#accessibility',\n                    {\n                        type: 'accessibility',\n                        issues: [\n                            'value supplied to the \"label\" attribute, which will be displayed visually as part of the element, or',\n                            'value supplied to the \"aria-label\" attribute, which will only be provided to screen readers, or',\n                            'an element ID reference supplied to the \"aria-labelledby\" attribute, which will be provided by screen readers and will need to be managed manually by the parent application.',\n                        ],\n                    }\n                );\n            }\n        }\n    }\n}\n"],
+  "mappings": "qNAYA,OAEI,QAAAA,EAEA,cAAAC,EACA,mBAAAC,MAEG,gCACP,OAAS,YAAAC,MAAgB,kDACzB,OAAS,aAAAC,MAAiB,kDAE1B,OAAOC,MAA0B,2BAK1B,aAAM,uBAAuBJ,EAAWC,EAAiB,CAC5D,WAAY,CAAC,IAAK,IAAK,GAAG,CAC9B,CAAC,CAAE,CAFI,kCAQH,KAAO,cAAgB,GAGvB,KAAO,MAAQ,GAGf,KAAO,eAAiB,GAMxB,KAAO,SAAW,EAjBlB,WAA2B,QAAyB,CAChD,MAAO,CAACG,CAAoB,CAChC,CAiBQ,aAAaC,EAAsC,CACvD,OAAO,KAAK,cACN,OACA,qBAAqBA,QAC/B,CAEmB,WAAWC,EAAqC,CAC3DA,EAAQ,IAAI,gBAAgB,IAG5B,KAAK,OAAS,KAAK,eACb,QACA,KAAK,QAAU,OAY7B,CAEmB,QAAyB,CACxC,MAAMC,EAAS,CACX,KAAK,aAAa,KAAQ,IAAY,KAAK,IAAI,KAAK,SAAU,EAAE,CAAC,EACjE,KAAK,aACD,KAAQ,IAAY,KAAK,IAAI,KAAK,SAAW,GAAI,CAAC,CACtD,CACJ,EAEA,OAAOR;AAAA;AAAA;AAAA,kBADO,CAAC,QAAS,OAAO,EAIf,IACJ,CAACS,EAAMC,IAAUV;AAAA,0CACKS;AAAA;AAAA,gDAEMA;AAAA,wCACRL,EAAUI,EAAOE,EAAM;AAAA;AAAA;AAAA;AAAA;AAAA,qBAM/C;AAAA;AAAA,SAGZ,CAEmB,aAAaH,EAA+B,CAC3D,MAAM,aAAaA,CAAO,EACrB,KAAK,aAAa,MAAM,GACzB,KAAK,aAAa,OAAQ,aAAa,CAE/C,CAEmB,QAAQA,EAA+B,CACtD,MAAM,QAAQA,CAAO,EACjB,CAAC,KAAK,eAAiBA,EAAQ,IAAI,UAAU,EAC7C,KAAK,aAAa,gBAAiB,GAAK,KAAK,QAAQ,EAC9C,KAAK,aAAa,eAAe,GACxC,KAAK,gBAAgB,eAAe,EAEpC,KAAK,OAASA,EAAQ,IAAI,OAAO,GACjC,KAAK,aAAa,aAAc,KAAK,KAAK,CAwBlD,CACJ,CA3GWI,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAPjC,eAQF,6BAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,MAAO,CAAC,GAVjB,eAWF,qBAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,iBAAkB,CAAC,GAb/D,eAcF,8BAGAQ,EAAA,CADNR,EAAS,CAAE,QAAS,EAAK,CAAC,GAhBlB,eAiBF,sBAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,MAAO,CAAC,GAnBjB,eAoBF",
+  "names": ["html", "SizedMixin", "SpectrumElement", "property", "ifDefined", "progressCircleStyles", "rotation", "changes", "styles", "mask", "index", "__decorateClass"]
 }

package/src/index.dev.js

@@ -1,2 +1,3 @@
+"use strict";
 export * from "./ProgressCircle.dev.js";
 //# sourceMappingURL=index.dev.js.map

package/src/index.dev.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["index.ts"],
   "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nexport * from './ProgressCircle.dev.js'\n"],
-  "mappings": "AAYA;",
+  "mappings": ";AAYA,cAAc;",
   "names": []
 }

package/src/index.js

@@ -1,2 +1,2 @@
-export*from"./ProgressCircle.js";
+"use strict";export*from"./ProgressCircle.js";
 //# sourceMappingURL=index.js.map

package/src/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["index.ts"],
   "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nexport * from './ProgressCircle.js';\n"],
-  "mappings": "AAYA",
+  "mappings": "aAYA,WAAc",
   "names": []
 }

package/src/progress-circle.css.dev.js

@@ -1,70 +1,65 @@
+"use strict";
 import { css } from "@spectrum-web-components/base";
 const styles = css`
-.fill-submask-2{animation:spectrum-fill-mask-2 1s linear infinite}@keyframes spectrum-fill-mask-1{0%{transform:rotate(90deg)}1.69%{transform:rotate(72.3deg)}3.39%{transform:rotate(55.5deg)}5.08%{transform:rotate(40.3deg)}6.78%{transform:rotate(25deg)}8.47%{transform:rotate(10.6deg)}10.17%{transform:rotate(0deg)}11.86%{transform:rotate(0deg)}13.56%{transform:rotate(0deg)}15.25%{transform:rotate(0deg)}16.95%{transform:rotate(0deg)}18.64%{transform:rotate(0deg)}20.34%{transform:rotate(0deg)}22.03%{transform:rotate(0deg)}23.73%{transform:rotate(0deg)}25.42%{transform:rotate(0deg)}27.12%{transform:rotate(0deg)}28.81%{transform:rotate(0deg)}30.51%{transform:rotate(0deg)}32.2%{transform:rotate(0deg)}33.9%{transform:rotate(0deg)}35.59%{transform:rotate(0deg)}37.29%{transform:rotate(0deg)}38.98%{transform:rotate(0deg)}40.68%{transform:rotate(0deg)}42.37%{transform:rotate(5.3deg)}44.07%{transform:rotate(13.4deg)}45.76%{transform:rotate(20.6deg)}47.46%{transform:rotate(29deg)}49.15%{transform:rotate(36.5deg)}50.85%{transform:rotate(42.6deg)}52.54%{transform:rotate(48.8deg)}54.24%{transform:rotate(54.2deg)}55.93%{transform:rotate(59.4deg)}57.63%{transform:rotate(63.2deg)}59.32%{transform:rotate(67.2deg)}61.02%{transform:rotate(70.8deg)}62.71%{transform:rotate(73.8deg)}64.41%{transform:rotate(76.2deg)}66.1%{transform:rotate(78.7deg)}67.8%{transform:rotate(80.6deg)}69.49%{transform:rotate(82.6deg)}71.19%{transform:rotate(83.7deg)}72.88%{transform:rotate(85deg)}74.58%{transform:rotate(86.3deg)}76.27%{transform:rotate(87deg)}77.97%{transform:rotate(87.7deg)}79.66%{transform:rotate(88.3deg)}81.36%{transform:rotate(88.6deg)}83.05%{transform:rotate(89.2deg)}84.75%{transform:rotate(89.2deg)}86.44%{transform:rotate(89.5deg)}88.14%{transform:rotate(89.9deg)}89.83%{transform:rotate(89.7deg)}91.53%{transform:rotate(90.1deg)}93.22%{transform:rotate(90.2deg)}94.92%{transform:rotate(90.1deg)}96.61%{transform:rotate(90deg)}98.31%{transform:rotate(89.8deg)}to{transform:rotate(90deg)}}@keyframes spectrum-fill-mask-2{0%{transform:rotate(180deg)}1.69%{transform:rotate(180deg)}3.39%{transform:rotate(180deg)}5.08%{transform:rotate(180deg)}6.78%{transform:rotate(180deg)}8.47%{transform:rotate(180deg)}10.17%{transform:rotate(179.2deg)}11.86%{transform:rotate(164deg)}13.56%{transform:rotate(151.8deg)}15.25%{transform:rotate(140.8deg)}16.95%{transform:rotate(130.3deg)}18.64%{transform:rotate(120.4deg)}20.34%{transform:rotate(110.8deg)}22.03%{transform:rotate(101.6deg)}23.73%{transform:rotate(93.5deg)}25.42%{transform:rotate(85.4deg)}27.12%{transform:rotate(78.1deg)}28.81%{transform:rotate(71.2deg)}30.51%{transform:rotate(89.1deg)}32.2%{transform:rotate(105.5deg)}33.9%{transform:rotate(121.3deg)}35.59%{transform:rotate(135.5deg)}37.29%{transform:rotate(148.4deg)}38.98%{transform:rotate(161deg)}40.68%{transform:rotate(173.5deg)}42.37%{transform:rotate(180deg)}44.07%{transform:rotate(180deg)}45.76%{transform:rotate(180deg)}47.46%{transform:rotate(180deg)}49.15%{transform:rotate(180deg)}50.85%{transform:rotate(180deg)}52.54%{transform:rotate(180deg)}54.24%{transform:rotate(180deg)}55.93%{transform:rotate(180deg)}57.63%{transform:rotate(180deg)}59.32%{transform:rotate(180deg)}61.02%{transform:rotate(180deg)}62.71%{transform:rotate(180deg)}64.41%{transform:rotate(180deg)}66.1%{transform:rotate(180deg)}67.8%{transform:rotate(180deg)}69.49%{transform:rotate(180deg)}71.19%{transform:rotate(180deg)}72.88%{transform:rotate(180deg)}74.58%{transform:rotate(180deg)}76.27%{transform:rotate(180deg)}77.97%{transform:rotate(180deg)}79.66%{transform:rotate(180deg)}81.36%{transform:rotate(180deg)}83.05%{transform:rotate(180deg)}84.75%{transform:rotate(180deg)}86.44%{transform:rotate(180deg)}88.14%{transform:rotate(180deg)}89.83%{transform:rotate(180deg)}91.53%{transform:rotate(180deg)}93.22%{transform:rotate(180deg)}94.92%{transform:rotate(180deg)}96.61%{transform:rotate(180deg)}98.31%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes spectrum-fills-rotate{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host{direction:ltr;display:inline-block;height:var(
---spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)
-);position:relative;transform:translateZ(0);width:var(
---spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)
-)}.track{border-radius:var(
---spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)
-);border-style:solid;border-width:var(--spectrum-progresscircle-m-border-size);box-sizing:border-box;height:var(
---spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)
-);width:var(
---spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)
-)}:host([dir=ltr]) .fills{left:0}:host([dir=rtl]) .fills{right:0}.fills{height:100%;position:absolute;top:0;width:100%}.fill{border-radius:var(
---spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)
-);border-style:solid;border-width:var(--spectrum-progresscircle-m-border-size);box-sizing:border-box;height:var(
---spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)
-);width:var(
---spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)
-)}.fillMask1,.fillMask2{height:100%;overflow:hidden;position:absolute;transform:rotate(180deg);transform-origin:100% center;width:50%}.fillSubMask1,.fillSubMask2{height:100%;overflow:hidden;transform:rotate(-180deg);transform-origin:100% center;width:100%}.fillMask2{transform:rotate(0deg)}:host([size=s]){height:var(
---spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)
-);width:var(
---spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)
-)}:host([size=s]) .track{border-radius:var(
---spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)
-);border-style:solid;border-width:var(--spectrum-progresscircle-s-border-size);height:var(
---spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)
-);width:var(
---spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)
-)}:host([size=s]) .fill{border-radius:var(
---spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)
-);border-style:solid;border-width:var(--spectrum-progresscircle-s-border-size);height:var(
---spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)
-);width:var(
---spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)
-)}:host([size=l]){height:var(
---spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)
-);width:var(
---spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)
-)}:host([size=l]) .track{border-radius:var(
---spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)
+.fill-submask-2{animation:spectrum-fill-mask-2 1s linear infinite}@keyframes spectrum-fill-mask-1{0%{transform:rotate(90deg)}1.69%{transform:rotate(72.3deg)}3.39%{transform:rotate(55.5deg)}5.08%{transform:rotate(40.3deg)}6.78%{transform:rotate(25deg)}8.47%{transform:rotate(10.6deg)}10.17%{transform:rotate(0deg)}11.86%{transform:rotate(0deg)}13.56%{transform:rotate(0deg)}15.25%{transform:rotate(0deg)}16.95%{transform:rotate(0deg)}18.64%{transform:rotate(0deg)}20.34%{transform:rotate(0deg)}22.03%{transform:rotate(0deg)}23.73%{transform:rotate(0deg)}25.42%{transform:rotate(0deg)}27.12%{transform:rotate(0deg)}28.81%{transform:rotate(0deg)}30.51%{transform:rotate(0deg)}32.2%{transform:rotate(0deg)}33.9%{transform:rotate(0deg)}35.59%{transform:rotate(0deg)}37.29%{transform:rotate(0deg)}38.98%{transform:rotate(0deg)}40.68%{transform:rotate(0deg)}42.37%{transform:rotate(5.3deg)}44.07%{transform:rotate(13.4deg)}45.76%{transform:rotate(20.6deg)}47.46%{transform:rotate(29deg)}49.15%{transform:rotate(36.5deg)}50.85%{transform:rotate(42.6deg)}52.54%{transform:rotate(48.8deg)}54.24%{transform:rotate(54.2deg)}55.93%{transform:rotate(59.4deg)}57.63%{transform:rotate(63.2deg)}59.32%{transform:rotate(67.2deg)}61.02%{transform:rotate(70.8deg)}62.71%{transform:rotate(73.8deg)}64.41%{transform:rotate(76.2deg)}66.1%{transform:rotate(78.7deg)}67.8%{transform:rotate(80.6deg)}69.49%{transform:rotate(82.6deg)}71.19%{transform:rotate(83.7deg)}72.88%{transform:rotate(85deg)}74.58%{transform:rotate(86.3deg)}76.27%{transform:rotate(87deg)}77.97%{transform:rotate(87.7deg)}79.66%{transform:rotate(88.3deg)}81.36%{transform:rotate(88.6deg)}83.05%{transform:rotate(89.2deg)}84.75%{transform:rotate(89.2deg)}86.44%{transform:rotate(89.5deg)}88.14%{transform:rotate(89.9deg)}89.83%{transform:rotate(89.7deg)}91.53%{transform:rotate(90.1deg)}93.22%{transform:rotate(90.2deg)}94.92%{transform:rotate(90.1deg)}96.61%{transform:rotate(90deg)}98.31%{transform:rotate(89.8deg)}to{transform:rotate(90deg)}}@keyframes spectrum-fill-mask-2{0%{transform:rotate(180deg)}1.69%{transform:rotate(180deg)}3.39%{transform:rotate(180deg)}5.08%{transform:rotate(180deg)}6.78%{transform:rotate(180deg)}8.47%{transform:rotate(180deg)}10.17%{transform:rotate(179.2deg)}11.86%{transform:rotate(164deg)}13.56%{transform:rotate(151.8deg)}15.25%{transform:rotate(140.8deg)}16.95%{transform:rotate(130.3deg)}18.64%{transform:rotate(120.4deg)}20.34%{transform:rotate(110.8deg)}22.03%{transform:rotate(101.6deg)}23.73%{transform:rotate(93.5deg)}25.42%{transform:rotate(85.4deg)}27.12%{transform:rotate(78.1deg)}28.81%{transform:rotate(71.2deg)}30.51%{transform:rotate(89.1deg)}32.2%{transform:rotate(105.5deg)}33.9%{transform:rotate(121.3deg)}35.59%{transform:rotate(135.5deg)}37.29%{transform:rotate(148.4deg)}38.98%{transform:rotate(161deg)}40.68%{transform:rotate(173.5deg)}42.37%{transform:rotate(180deg)}44.07%{transform:rotate(180deg)}45.76%{transform:rotate(180deg)}47.46%{transform:rotate(180deg)}49.15%{transform:rotate(180deg)}50.85%{transform:rotate(180deg)}52.54%{transform:rotate(180deg)}54.24%{transform:rotate(180deg)}55.93%{transform:rotate(180deg)}57.63%{transform:rotate(180deg)}59.32%{transform:rotate(180deg)}61.02%{transform:rotate(180deg)}62.71%{transform:rotate(180deg)}64.41%{transform:rotate(180deg)}66.1%{transform:rotate(180deg)}67.8%{transform:rotate(180deg)}69.49%{transform:rotate(180deg)}71.19%{transform:rotate(180deg)}72.88%{transform:rotate(180deg)}74.58%{transform:rotate(180deg)}76.27%{transform:rotate(180deg)}77.97%{transform:rotate(180deg)}79.66%{transform:rotate(180deg)}81.36%{transform:rotate(180deg)}83.05%{transform:rotate(180deg)}84.75%{transform:rotate(180deg)}86.44%{transform:rotate(180deg)}88.14%{transform:rotate(180deg)}89.83%{transform:rotate(180deg)}91.53%{transform:rotate(180deg)}93.22%{transform:rotate(180deg)}94.92%{transform:rotate(180deg)}96.61%{transform:rotate(180deg)}98.31%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes spectrum-fills-rotate{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host{--spectrum-progress-circle-track-border-color:var(
+--spectrum-gray-300
+);--spectrum-progress-circle-fill-border-color:var(--spectrum-blue-900);--spectrum-progress-circle-track-border-color-over-background:var(
+--spectrum-transparent-white-300
+);--spectrum-progress-circle-fill-border-color-over-background:var(
+--spectrum-transparent-white-900
+);--spectrum-progress-circle-size:var(
+--spectrum-progress-circle-size-medium
+);--spectrum-progress-circle-thickness:var(
+--spectrum-progress-circle-thickness-medium
+);--spectrum-progress-circle-track-border-style:solid}:host([size=s]){--spectrum-progress-circle-size:var(
+--spectrum-progress-circle-size-small
+);--spectrum-progress-circle-thickness:var(
+--spectrum-progress-circle-thickness-small
+)}.spectrum-ProgressCircle--medium{--spectrum-progress-circle-size:var(
+--spectrum-progress-circle-size-medium
+);--spectrum-progress-circle-thickness:var(
+--spectrum-progress-circle-thickness-medium
+)}:host([size=l]){--spectrum-progress-circle-size:var(
+--spectrum-progress-circle-size-large
+);--spectrum-progress-circle-thickness:var(
+--spectrum-progress-circle-thickness-large
+)}@media (forced-colors:active){:host{--highcontrast-progress-circle-fill-border-color:Highlight;--highcontrast-progress-circle-fill-border-color-over-background:Highlight}.track{--spectrum-progress-circle-track-border-style:double}}:host{block-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+);direction:ltr;display:inline-block;inline-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+);position:relative;transform:translateZ(0)}.track{block-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+);border-color:var(
+--mod-progress-circle-track-border-color,var(--spectrum-progress-circle-track-border-color)
+);border-radius:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+);border-style:var(
+--highcontrast-progress-circle-track-border-style,var(
+--mod-progress-circle-track-border-style,var(--spectrum-progress-circle-track-border-style)
+)
+);border-width:var(
+--mod-progress-circle-thickness,var(--spectrum-progress-circle-thickness)
+);box-sizing:border-box;inline-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+)}.fills{block-size:100%;inline-size:100%;inset-block-start:0;inset-inline-start:0;position:absolute}.fill{block-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+);border-color:var(
+--highcontrast-progress-circle-fill-border-color,var(
+--mod-progress-circle-fill-border-color,var(--spectrum-progress-circle-fill-border-color)
+)
+);border-radius:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
 );border-style:solid;border-width:var(
---spectrum-progresscircle-l-border-size,var(--spectrum-global-dimension-size-50)
-);height:var(
---spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)
-);width:var(
---spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)
-)}:host([size=l]) .fill{border-radius:var(
---spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)
-);border-style:solid;border-width:var(
---spectrum-progresscircle-l-border-size,var(--spectrum-global-dimension-size-50)
-);height:var(
---spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)
-);width:var(
---spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)
-)}:host([indeterminate]) .fills{animation:spectrum-fills-rotate 1s cubic-bezier(.25,.78,.48,.89) infinite;transform:translateZ(0);transform-origin:center;will-change:transform}:host([indeterminate]) .fillSubMask1{animation:spectrum-fill-mask-1 1s linear infinite;transform:translateZ(0);will-change:transform}:host([indeterminate]) .fillSubMask2{animation:spectrum-fill-mask-2 1s linear infinite;transform:translateZ(0);will-change:transform}.track{border-color:var(
---spectrum-progresscircle-m-track-color,var(--spectrum-alias-track-color-default)
-)}.fill{border-color:var(
---spectrum-progresscircle-m-track-fill-color,var(--spectrum-semantic-informative-color-default)
-)}:host([over-background]) .track{border-color:var(
---spectrum-progresscircle-m-over-background-track-color
-)}:host([over-background]) .fill{border-color:var(
---spectrum-progresscircle-m-over-background-track-fill-color
-)}:host([indeterminate][over-background]) .track{border-color:var(
---spectrum-progresscircle-m-over-background-track-color
-)}:host([indeterminate][over-background]) .fill{border-color:var(
---spectrum-progresscircle-m-over-background-track-fill-color
-)}@media (forced-colors:active){.fill{--spectrum-progresscircle-m-track-fill-color:Highlight}}:host{--spectrum-progresscircle-m-over-background-track-fill-color:var(
+--mod-progress-circle-thickness,var(--spectrum-progress-circle-thickness)
+);box-sizing:border-box;inline-size:var(
+--mod-progress-circle-size,var(--spectrum-progress-circle-size)
+)}:host([static=white]) .track{border-color:var(
+--mod-progress-circle-track-border-color-over-background,var(--spectrum-progress-circle-track-border-color-over-background)
+)}:host([static=white]) .fill{border-color:var(
+--highcontrast-progress-circle-fill-border-color-over-background,var(
+--mod-progress-circle-fill-border-color-over-background,var(--spectrum-progress-circle-fill-border-color-over-background)
+)
+)}.fillMask1,.fillMask2{block-size:100%;inline-size:50%;overflow:hidden;position:absolute;transform:rotate(180deg);transform-origin:100% center}.fillSubMask1,.fillSubMask2{block-size:100%;inline-size:100%;overflow:hidden;transform:rotate(-180deg);transform-origin:100% center}.fillMask2{transform:rotate(0deg)}:host([indeterminate]) .fills{animation:spectrum-fills-rotate 1s cubic-bezier(.25,.78,.48,.89) infinite;transform:translateZ(0);transform-origin:center;will-change:transform}:host([indeterminate]) .fillSubMask1{animation:spectrum-fill-mask-1 1s linear infinite;transform:translateZ(0);will-change:transform}:host([indeterminate]) .fillSubMask2{animation:spectrum-fill-mask-2 1s linear infinite;transform:translateZ(0);will-change:transform}:host{--spectrum-progresscircle-m-over-background-track-fill-color:var(
 --spectrum-alias-track-fill-color-overbackground
 )}
 `;

package/src/progress-circle.css.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["progress-circle.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n.fill-submask-2{animation:spectrum-fill-mask-2 1s linear infinite}@keyframes spectrum-fill-mask-1{0%{transform:rotate(90deg)}1.69%{transform:rotate(72.3deg)}3.39%{transform:rotate(55.5deg)}5.08%{transform:rotate(40.3deg)}6.78%{transform:rotate(25deg)}8.47%{transform:rotate(10.6deg)}10.17%{transform:rotate(0deg)}11.86%{transform:rotate(0deg)}13.56%{transform:rotate(0deg)}15.25%{transform:rotate(0deg)}16.95%{transform:rotate(0deg)}18.64%{transform:rotate(0deg)}20.34%{transform:rotate(0deg)}22.03%{transform:rotate(0deg)}23.73%{transform:rotate(0deg)}25.42%{transform:rotate(0deg)}27.12%{transform:rotate(0deg)}28.81%{transform:rotate(0deg)}30.51%{transform:rotate(0deg)}32.2%{transform:rotate(0deg)}33.9%{transform:rotate(0deg)}35.59%{transform:rotate(0deg)}37.29%{transform:rotate(0deg)}38.98%{transform:rotate(0deg)}40.68%{transform:rotate(0deg)}42.37%{transform:rotate(5.3deg)}44.07%{transform:rotate(13.4deg)}45.76%{transform:rotate(20.6deg)}47.46%{transform:rotate(29deg)}49.15%{transform:rotate(36.5deg)}50.85%{transform:rotate(42.6deg)}52.54%{transform:rotate(48.8deg)}54.24%{transform:rotate(54.2deg)}55.93%{transform:rotate(59.4deg)}57.63%{transform:rotate(63.2deg)}59.32%{transform:rotate(67.2deg)}61.02%{transform:rotate(70.8deg)}62.71%{transform:rotate(73.8deg)}64.41%{transform:rotate(76.2deg)}66.1%{transform:rotate(78.7deg)}67.8%{transform:rotate(80.6deg)}69.49%{transform:rotate(82.6deg)}71.19%{transform:rotate(83.7deg)}72.88%{transform:rotate(85deg)}74.58%{transform:rotate(86.3deg)}76.27%{transform:rotate(87deg)}77.97%{transform:rotate(87.7deg)}79.66%{transform:rotate(88.3deg)}81.36%{transform:rotate(88.6deg)}83.05%{transform:rotate(89.2deg)}84.75%{transform:rotate(89.2deg)}86.44%{transform:rotate(89.5deg)}88.14%{transform:rotate(89.9deg)}89.83%{transform:rotate(89.7deg)}91.53%{transform:rotate(90.1deg)}93.22%{transform:rotate(90.2deg)}94.92%{transform:rotate(90.1deg)}96.61%{transform:rotate(90deg)}98.31%{transform:rotate(89.8deg)}to{transform:rotate(90deg)}}@keyframes spectrum-fill-mask-2{0%{transform:rotate(180deg)}1.69%{transform:rotate(180deg)}3.39%{transform:rotate(180deg)}5.08%{transform:rotate(180deg)}6.78%{transform:rotate(180deg)}8.47%{transform:rotate(180deg)}10.17%{transform:rotate(179.2deg)}11.86%{transform:rotate(164deg)}13.56%{transform:rotate(151.8deg)}15.25%{transform:rotate(140.8deg)}16.95%{transform:rotate(130.3deg)}18.64%{transform:rotate(120.4deg)}20.34%{transform:rotate(110.8deg)}22.03%{transform:rotate(101.6deg)}23.73%{transform:rotate(93.5deg)}25.42%{transform:rotate(85.4deg)}27.12%{transform:rotate(78.1deg)}28.81%{transform:rotate(71.2deg)}30.51%{transform:rotate(89.1deg)}32.2%{transform:rotate(105.5deg)}33.9%{transform:rotate(121.3deg)}35.59%{transform:rotate(135.5deg)}37.29%{transform:rotate(148.4deg)}38.98%{transform:rotate(161deg)}40.68%{transform:rotate(173.5deg)}42.37%{transform:rotate(180deg)}44.07%{transform:rotate(180deg)}45.76%{transform:rotate(180deg)}47.46%{transform:rotate(180deg)}49.15%{transform:rotate(180deg)}50.85%{transform:rotate(180deg)}52.54%{transform:rotate(180deg)}54.24%{transform:rotate(180deg)}55.93%{transform:rotate(180deg)}57.63%{transform:rotate(180deg)}59.32%{transform:rotate(180deg)}61.02%{transform:rotate(180deg)}62.71%{transform:rotate(180deg)}64.41%{transform:rotate(180deg)}66.1%{transform:rotate(180deg)}67.8%{transform:rotate(180deg)}69.49%{transform:rotate(180deg)}71.19%{transform:rotate(180deg)}72.88%{transform:rotate(180deg)}74.58%{transform:rotate(180deg)}76.27%{transform:rotate(180deg)}77.97%{transform:rotate(180deg)}79.66%{transform:rotate(180deg)}81.36%{transform:rotate(180deg)}83.05%{transform:rotate(180deg)}84.75%{transform:rotate(180deg)}86.44%{transform:rotate(180deg)}88.14%{transform:rotate(180deg)}89.83%{transform:rotate(180deg)}91.53%{transform:rotate(180deg)}93.22%{transform:rotate(180deg)}94.92%{transform:rotate(180deg)}96.61%{transform:rotate(180deg)}98.31%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes spectrum-fills-rotate{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host{direction:ltr;display:inline-block;height:var(\n--spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)\n);position:relative;transform:translateZ(0);width:var(\n--spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)\n)}.track{border-radius:var(\n--spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)\n);border-style:solid;border-width:var(--spectrum-progresscircle-m-border-size);box-sizing:border-box;height:var(\n--spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)\n);width:var(\n--spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)\n)}:host([dir=ltr]) .fills{left:0}:host([dir=rtl]) .fills{right:0}.fills{height:100%;position:absolute;top:0;width:100%}.fill{border-radius:var(\n--spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)\n);border-style:solid;border-width:var(--spectrum-progresscircle-m-border-size);box-sizing:border-box;height:var(\n--spectrum-progresscircle-m-height,var(--spectrum-global-dimension-size-400)\n);width:var(\n--spectrum-progresscircle-m-width,var(--spectrum-global-dimension-size-400)\n)}.fillMask1,.fillMask2{height:100%;overflow:hidden;position:absolute;transform:rotate(180deg);transform-origin:100% center;width:50%}.fillSubMask1,.fillSubMask2{height:100%;overflow:hidden;transform:rotate(-180deg);transform-origin:100% center;width:100%}.fillMask2{transform:rotate(0deg)}:host([size=s]){height:var(\n--spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)\n);width:var(\n--spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)\n)}:host([size=s]) .track{border-radius:var(\n--spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)\n);border-style:solid;border-width:var(--spectrum-progresscircle-s-border-size);height:var(\n--spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)\n);width:var(\n--spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)\n)}:host([size=s]) .fill{border-radius:var(\n--spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)\n);border-style:solid;border-width:var(--spectrum-progresscircle-s-border-size);height:var(\n--spectrum-progresscircle-s-height,var(--spectrum-global-dimension-size-200)\n);width:var(\n--spectrum-progresscircle-s-width,var(--spectrum-global-dimension-size-200)\n)}:host([size=l]){height:var(\n--spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)\n);width:var(\n--spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)\n)}:host([size=l]) .track{border-radius:var(\n--spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)\n);border-style:solid;border-width:var(\n--spectrum-progresscircle-l-border-size,var(--spectrum-global-dimension-size-50)\n);height:var(\n--spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)\n);width:var(\n--spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)\n)}:host([size=l]) .fill{border-radius:var(\n--spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)\n);border-style:solid;border-width:var(\n--spectrum-progresscircle-l-border-size,var(--spectrum-global-dimension-size-50)\n);height:var(\n--spectrum-progresscircle-l-height,var(--spectrum-global-dimension-size-800)\n);width:var(\n--spectrum-progresscircle-l-width,var(--spectrum-global-dimension-size-800)\n)}:host([indeterminate]) .fills{animation:spectrum-fills-rotate 1s cubic-bezier(.25,.78,.48,.89) infinite;transform:translateZ(0);transform-origin:center;will-change:transform}:host([indeterminate]) .fillSubMask1{animation:spectrum-fill-mask-1 1s linear infinite;transform:translateZ(0);will-change:transform}:host([indeterminate]) .fillSubMask2{animation:spectrum-fill-mask-2 1s linear infinite;transform:translateZ(0);will-change:transform}.track{border-color:var(\n--spectrum-progresscircle-m-track-color,var(--spectrum-alias-track-color-default)\n)}.fill{border-color:var(\n--spectrum-progresscircle-m-track-fill-color,var(--spectrum-semantic-informative-color-default)\n)}:host([over-background]) .track{border-color:var(\n--spectrum-progresscircle-m-over-background-track-color\n)}:host([over-background]) .fill{border-color:var(\n--spectrum-progresscircle-m-over-background-track-fill-color\n)}:host([indeterminate][over-background]) .track{border-color:var(\n--spectrum-progresscircle-m-over-background-track-color\n)}:host([indeterminate][over-background]) .fill{border-color:var(\n--spectrum-progresscircle-m-over-background-track-fill-color\n)}@media (forced-colors:active){.fill{--spectrum-progresscircle-m-track-fill-color:Highlight}}:host{--spectrum-progresscircle-m-over-background-track-fill-color:var(\n--spectrum-alias-track-fill-color-overbackground\n)}\n`;\nexport default styles;"],
-  "mappings": "AAWA;AACA,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqEf,eAAe;",
+  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n.fill-submask-2{animation:spectrum-fill-mask-2 1s linear infinite}@keyframes spectrum-fill-mask-1{0%{transform:rotate(90deg)}1.69%{transform:rotate(72.3deg)}3.39%{transform:rotate(55.5deg)}5.08%{transform:rotate(40.3deg)}6.78%{transform:rotate(25deg)}8.47%{transform:rotate(10.6deg)}10.17%{transform:rotate(0deg)}11.86%{transform:rotate(0deg)}13.56%{transform:rotate(0deg)}15.25%{transform:rotate(0deg)}16.95%{transform:rotate(0deg)}18.64%{transform:rotate(0deg)}20.34%{transform:rotate(0deg)}22.03%{transform:rotate(0deg)}23.73%{transform:rotate(0deg)}25.42%{transform:rotate(0deg)}27.12%{transform:rotate(0deg)}28.81%{transform:rotate(0deg)}30.51%{transform:rotate(0deg)}32.2%{transform:rotate(0deg)}33.9%{transform:rotate(0deg)}35.59%{transform:rotate(0deg)}37.29%{transform:rotate(0deg)}38.98%{transform:rotate(0deg)}40.68%{transform:rotate(0deg)}42.37%{transform:rotate(5.3deg)}44.07%{transform:rotate(13.4deg)}45.76%{transform:rotate(20.6deg)}47.46%{transform:rotate(29deg)}49.15%{transform:rotate(36.5deg)}50.85%{transform:rotate(42.6deg)}52.54%{transform:rotate(48.8deg)}54.24%{transform:rotate(54.2deg)}55.93%{transform:rotate(59.4deg)}57.63%{transform:rotate(63.2deg)}59.32%{transform:rotate(67.2deg)}61.02%{transform:rotate(70.8deg)}62.71%{transform:rotate(73.8deg)}64.41%{transform:rotate(76.2deg)}66.1%{transform:rotate(78.7deg)}67.8%{transform:rotate(80.6deg)}69.49%{transform:rotate(82.6deg)}71.19%{transform:rotate(83.7deg)}72.88%{transform:rotate(85deg)}74.58%{transform:rotate(86.3deg)}76.27%{transform:rotate(87deg)}77.97%{transform:rotate(87.7deg)}79.66%{transform:rotate(88.3deg)}81.36%{transform:rotate(88.6deg)}83.05%{transform:rotate(89.2deg)}84.75%{transform:rotate(89.2deg)}86.44%{transform:rotate(89.5deg)}88.14%{transform:rotate(89.9deg)}89.83%{transform:rotate(89.7deg)}91.53%{transform:rotate(90.1deg)}93.22%{transform:rotate(90.2deg)}94.92%{transform:rotate(90.1deg)}96.61%{transform:rotate(90deg)}98.31%{transform:rotate(89.8deg)}to{transform:rotate(90deg)}}@keyframes spectrum-fill-mask-2{0%{transform:rotate(180deg)}1.69%{transform:rotate(180deg)}3.39%{transform:rotate(180deg)}5.08%{transform:rotate(180deg)}6.78%{transform:rotate(180deg)}8.47%{transform:rotate(180deg)}10.17%{transform:rotate(179.2deg)}11.86%{transform:rotate(164deg)}13.56%{transform:rotate(151.8deg)}15.25%{transform:rotate(140.8deg)}16.95%{transform:rotate(130.3deg)}18.64%{transform:rotate(120.4deg)}20.34%{transform:rotate(110.8deg)}22.03%{transform:rotate(101.6deg)}23.73%{transform:rotate(93.5deg)}25.42%{transform:rotate(85.4deg)}27.12%{transform:rotate(78.1deg)}28.81%{transform:rotate(71.2deg)}30.51%{transform:rotate(89.1deg)}32.2%{transform:rotate(105.5deg)}33.9%{transform:rotate(121.3deg)}35.59%{transform:rotate(135.5deg)}37.29%{transform:rotate(148.4deg)}38.98%{transform:rotate(161deg)}40.68%{transform:rotate(173.5deg)}42.37%{transform:rotate(180deg)}44.07%{transform:rotate(180deg)}45.76%{transform:rotate(180deg)}47.46%{transform:rotate(180deg)}49.15%{transform:rotate(180deg)}50.85%{transform:rotate(180deg)}52.54%{transform:rotate(180deg)}54.24%{transform:rotate(180deg)}55.93%{transform:rotate(180deg)}57.63%{transform:rotate(180deg)}59.32%{transform:rotate(180deg)}61.02%{transform:rotate(180deg)}62.71%{transform:rotate(180deg)}64.41%{transform:rotate(180deg)}66.1%{transform:rotate(180deg)}67.8%{transform:rotate(180deg)}69.49%{transform:rotate(180deg)}71.19%{transform:rotate(180deg)}72.88%{transform:rotate(180deg)}74.58%{transform:rotate(180deg)}76.27%{transform:rotate(180deg)}77.97%{transform:rotate(180deg)}79.66%{transform:rotate(180deg)}81.36%{transform:rotate(180deg)}83.05%{transform:rotate(180deg)}84.75%{transform:rotate(180deg)}86.44%{transform:rotate(180deg)}88.14%{transform:rotate(180deg)}89.83%{transform:rotate(180deg)}91.53%{transform:rotate(180deg)}93.22%{transform:rotate(180deg)}94.92%{transform:rotate(180deg)}96.61%{transform:rotate(180deg)}98.31%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes spectrum-fills-rotate{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host{--spectrum-progress-circle-track-border-color:var(\n--spectrum-gray-300\n);--spectrum-progress-circle-fill-border-color:var(--spectrum-blue-900);--spectrum-progress-circle-track-border-color-over-background:var(\n--spectrum-transparent-white-300\n);--spectrum-progress-circle-fill-border-color-over-background:var(\n--spectrum-transparent-white-900\n);--spectrum-progress-circle-size:var(\n--spectrum-progress-circle-size-medium\n);--spectrum-progress-circle-thickness:var(\n--spectrum-progress-circle-thickness-medium\n);--spectrum-progress-circle-track-border-style:solid}:host([size=s]){--spectrum-progress-circle-size:var(\n--spectrum-progress-circle-size-small\n);--spectrum-progress-circle-thickness:var(\n--spectrum-progress-circle-thickness-small\n)}.spectrum-ProgressCircle--medium{--spectrum-progress-circle-size:var(\n--spectrum-progress-circle-size-medium\n);--spectrum-progress-circle-thickness:var(\n--spectrum-progress-circle-thickness-medium\n)}:host([size=l]){--spectrum-progress-circle-size:var(\n--spectrum-progress-circle-size-large\n);--spectrum-progress-circle-thickness:var(\n--spectrum-progress-circle-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-progress-circle-fill-border-color:Highlight;--highcontrast-progress-circle-fill-border-color-over-background:Highlight}.track{--spectrum-progress-circle-track-border-style:double}}:host{block-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);direction:ltr;display:inline-block;inline-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);position:relative;transform:translateZ(0)}.track{block-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);border-color:var(\n--mod-progress-circle-track-border-color,var(--spectrum-progress-circle-track-border-color)\n);border-radius:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);border-style:var(\n--highcontrast-progress-circle-track-border-style,var(\n--mod-progress-circle-track-border-style,var(--spectrum-progress-circle-track-border-style)\n)\n);border-width:var(\n--mod-progress-circle-thickness,var(--spectrum-progress-circle-thickness)\n);box-sizing:border-box;inline-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n)}.fills{block-size:100%;inline-size:100%;inset-block-start:0;inset-inline-start:0;position:absolute}.fill{block-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);border-color:var(\n--highcontrast-progress-circle-fill-border-color,var(\n--mod-progress-circle-fill-border-color,var(--spectrum-progress-circle-fill-border-color)\n)\n);border-radius:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n);border-style:solid;border-width:var(\n--mod-progress-circle-thickness,var(--spectrum-progress-circle-thickness)\n);box-sizing:border-box;inline-size:var(\n--mod-progress-circle-size,var(--spectrum-progress-circle-size)\n)}:host([static=white]) .track{border-color:var(\n--mod-progress-circle-track-border-color-over-background,var(--spectrum-progress-circle-track-border-color-over-background)\n)}:host([static=white]) .fill{border-color:var(\n--highcontrast-progress-circle-fill-border-color-over-background,var(\n--mod-progress-circle-fill-border-color-over-background,var(--spectrum-progress-circle-fill-border-color-over-background)\n)\n)}.fillMask1,.fillMask2{block-size:100%;inline-size:50%;overflow:hidden;position:absolute;transform:rotate(180deg);transform-origin:100% center}.fillSubMask1,.fillSubMask2{block-size:100%;inline-size:100%;overflow:hidden;transform:rotate(-180deg);transform-origin:100% center}.fillMask2{transform:rotate(0deg)}:host([indeterminate]) .fills{animation:spectrum-fills-rotate 1s cubic-bezier(.25,.78,.48,.89) infinite;transform:translateZ(0);transform-origin:center;will-change:transform}:host([indeterminate]) .fillSubMask1{animation:spectrum-fill-mask-1 1s linear infinite;transform:translateZ(0);will-change:transform}:host([indeterminate]) .fillSubMask2{animation:spectrum-fill-mask-2 1s linear infinite;transform:translateZ(0);will-change:transform}:host{--spectrum-progresscircle-m-over-background-track-fill-color:var(\n--spectrum-alias-track-fill-color-overbackground\n)}\n`;\nexport default styles;"],
+  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+Df,eAAe;",
   "names": []
 }