@spectrum-web-components/progress-bar 0.49.0-beta.0 → 0.49.0-beta.1
Sign up to get free protection for your applications and to get access to all the features.
- package/package.json +6 -6
- package/src/ProgressBar.d.ts +4 -0
- package/src/ProgressBar.dev.js +14 -0
- package/src/ProgressBar.dev.js.map +2 -2
- package/src/ProgressBar.js +7 -7
- package/src/ProgressBar.js.map +2 -2
- package/src/progress-bar.css.dev.js +1 -1
- package/src/progress-bar.css.dev.js.map +1 -1
- package/src/progress-bar.css.js +1 -1
- package/src/progress-bar.css.js.map +1 -1
- package/src/spectrum-config.js +1 -1
- package/src/spectrum-progress-bar.css.dev.js +1 -1
- package/src/spectrum-progress-bar.css.dev.js.map +1 -1
- package/src/spectrum-progress-bar.css.js +1 -1
- package/src/spectrum-progress-bar.css.js.map +1 -1
- package/stories/progress-bar.stories.js +8 -5
- package/stories/progress-bar.stories.js.map +2 -2
- package/test/progress-bar.test.js +50 -19
- package/test/progress-bar.test.js.map +2 -2
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@spectrum-web-components/progress-bar",
|
3
|
-
"version": "0.49.0-beta.
|
3
|
+
"version": "0.49.0-beta.1",
|
4
4
|
"publishConfig": {
|
5
5
|
"access": "public"
|
6
6
|
},
|
@@ -57,10 +57,10 @@
|
|
57
57
|
"lit-html"
|
58
58
|
],
|
59
59
|
"dependencies": {
|
60
|
-
"@spectrum-web-components/base": "^0.49.0-beta.
|
61
|
-
"@spectrum-web-components/field-label": "^0.49.0-beta.
|
62
|
-
"@spectrum-web-components/reactive-controllers": "^0.49.0-beta.
|
63
|
-
"@spectrum-web-components/shared": "^0.49.0-beta.
|
60
|
+
"@spectrum-web-components/base": "^0.49.0-beta.1",
|
61
|
+
"@spectrum-web-components/field-label": "^0.49.0-beta.1",
|
62
|
+
"@spectrum-web-components/reactive-controllers": "^0.49.0-beta.1",
|
63
|
+
"@spectrum-web-components/shared": "^0.49.0-beta.1"
|
64
64
|
},
|
65
65
|
"devDependencies": {
|
66
66
|
"@spectrum-css/progressbar": "^4.1.5"
|
@@ -71,5 +71,5 @@
|
|
71
71
|
"./sp-*.js",
|
72
72
|
"./**/*.dev.js"
|
73
73
|
],
|
74
|
-
"gitHead": "
|
74
|
+
"gitHead": "74ee2c5b1276e8e4f768566a1c3c4e263a7eb8b3"
|
75
75
|
}
|
package/src/ProgressBar.d.ts
CHANGED
@@ -18,7 +18,11 @@ export declare class ProgressBar extends ProgressBar_base {
|
|
18
18
|
overBackground: boolean;
|
19
19
|
sideLabel: boolean;
|
20
20
|
progress: number;
|
21
|
+
/**
|
22
|
+
* @deprecated Use `staticColor` instead.
|
23
|
+
*/
|
21
24
|
static: 'white' | undefined;
|
25
|
+
staticColor?: 'white';
|
22
26
|
private slotEl;
|
23
27
|
protected render(): TemplateResult;
|
24
28
|
protected handleSlotchange(): void;
|
package/src/ProgressBar.dev.js
CHANGED
@@ -89,6 +89,17 @@ export class ProgressBar extends SizedMixin(
|
|
89
89
|
}
|
90
90
|
updated(changes) {
|
91
91
|
super.updated(changes);
|
92
|
+
if (changes.has("static") && (this.static !== void 0 || changes.get("static") !== void 0)) {
|
93
|
+
this.staticColor = this.static;
|
94
|
+
if (true) {
|
95
|
+
window.__swc.warn(
|
96
|
+
this,
|
97
|
+
`The "static" attribute of <${this.localName}> has been deprecated. Use "static-color" with the same values instead. "static" will be removed in a future release.`,
|
98
|
+
"https://opensource.adobe.com/spectrum-web-components/components/progress-bar/api/",
|
99
|
+
{ level: "deprecation" }
|
100
|
+
);
|
101
|
+
}
|
102
|
+
}
|
92
103
|
if (changes.has("indeterminate")) {
|
93
104
|
if (this.indeterminate) {
|
94
105
|
this.removeAttribute("aria-valuemin");
|
@@ -147,6 +158,9 @@ __decorateClass([
|
|
147
158
|
__decorateClass([
|
148
159
|
property({ type: String, reflect: true })
|
149
160
|
], ProgressBar.prototype, "static", 2);
|
161
|
+
__decorateClass([
|
162
|
+
property({ reflect: true, attribute: "static-color" })
|
163
|
+
], ProgressBar.prototype, "staticColor", 2);
|
150
164
|
__decorateClass([
|
151
165
|
query("slot")
|
152
166
|
], ProgressBar.prototype, "slotEl", 2);
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["ProgressBar.ts"],
|
4
|
-
"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 nothing,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { getLabelFromSlot } from '@spectrum-web-components/shared/src/get-label-from-slot.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { LanguageResolutionController } from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport styles from './progress-bar.css.js';\n\n/**\n * @element sp-progress-bar\n */\nexport class ProgressBar extends SizedMixin(\n ObserveSlotText(SpectrumElement, ''),\n {\n noDefaultSize: true,\n }\n) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: String, reflect: true })\n public label = '';\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n public overBackground = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n public sideLabel = false;\n\n @property({ type: Number })\n public progress = 0;\n\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n protected override render(): TemplateResult {\n return html`\n ${this.slotHasContent || this.label\n ? html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? html`` : this.label}\n\n <slot @slotchange=${this.handleSlotchange}></slot>\n </sp-field-label>\n `\n : html``}\n ${this.label\n ? html`\n ${this.indeterminate\n ? nothing\n : html`\n <sp-field-label\n size=${this.size}\n class=\"percentage\"\n >\n ${new Intl.NumberFormat(\n this.languageResolver.language,\n {\n style: 'percent',\n unitDisplay: 'narrow',\n }\n ).format(this.progress / 100)}\n </sp-field-label>\n `}\n `\n : nothing}\n <div class=\"track\">\n <div\n class=\"fill\"\n style=\"transform: scaleX(calc(${this.progress} / 100));\"\n ></div>\n </div>\n `;\n }\n\n protected handleSlotchange(): void {\n const labelFromSlot = getLabelFromSlot(this.label, this.slotEl);\n if (labelFromSlot) {\n this.label = labelFromSlot;\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 (changes.has('indeterminate')) {\n if (this.indeterminate) {\n this.removeAttribute('aria-valuemin');\n this.removeAttribute('aria-valuemax');\n this.removeAttribute('aria-valuenow');\n } else {\n this.setAttribute('aria-valuemin', '0');\n this.setAttribute('aria-valuemax', '100');\n }\n }\n if (!this.indeterminate && changes.has('progress')) {\n this.setAttribute('aria-valuenow', '' + this.progress);\n }\n if (changes.has('label')) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else if (\n changes.get('label') === this.getAttribute('aria-label')\n ) {\n this.removeAttribute('aria-label');\n }\n }\n\n if (window.__swc.DEBUG) {\n if (\n !this.label &&\n !this.getAttribute('aria-label') &&\n !this.getAttribute('aria-labelledby') &&\n !this.slotHasContent\n ) {\n window.__swc.warn(\n this,\n '<sp-progress-bar> elements need one of the following to be accessible:',\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/#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 'text content supplied directly to the <sp-progress-circle> 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"],
|
5
|
-
"mappings": ";;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,oCAAoC;AAC7C,OAAO;AACP,OAAO,YAAY;AAKZ,aAAM,oBAAoB;AAAA,EAC7B,gBAAgB,iBAAiB,EAAE;AAAA,EACnC;AAAA,IACI,eAAe;AAAA,EACnB;AACJ,EAAE;AAAA,EALK;AAAA;AAWH,SAAO,gBAAgB;AAGvB,SAAO,QAAQ;AAEf,SAAQ,mBAAmB,IAAI,6BAA6B,IAAI;AAGhE,SAAO,iBAAiB;AAGxB,SAAO,YAAY;AAGnB,SAAO,WAAW;AAAA;AAAA,EAnBlB,WAA2B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,
|
4
|
+
"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 nothing,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { getLabelFromSlot } from '@spectrum-web-components/shared/src/get-label-from-slot.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { LanguageResolutionController } from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport styles from './progress-bar.css.js';\n\n/**\n * @element sp-progress-bar\n */\nexport class ProgressBar extends SizedMixin(\n ObserveSlotText(SpectrumElement, ''),\n {\n noDefaultSize: true,\n }\n) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: String, reflect: true })\n public label = '';\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n public overBackground = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n public sideLabel = false;\n\n @property({ type: Number })\n public progress = 0;\n\n /**\n * @deprecated Use `staticColor` instead.\n */\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n @property({ reflect: true, attribute: 'static-color' })\n public staticColor?: 'white';\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n protected override render(): TemplateResult {\n return html`\n ${this.slotHasContent || this.label\n ? html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? html`` : this.label}\n\n <slot @slotchange=${this.handleSlotchange}></slot>\n </sp-field-label>\n `\n : html``}\n ${this.label\n ? html`\n ${this.indeterminate\n ? nothing\n : html`\n <sp-field-label\n size=${this.size}\n class=\"percentage\"\n >\n ${new Intl.NumberFormat(\n this.languageResolver.language,\n {\n style: 'percent',\n unitDisplay: 'narrow',\n }\n ).format(this.progress / 100)}\n </sp-field-label>\n `}\n `\n : nothing}\n <div class=\"track\">\n <div\n class=\"fill\"\n style=\"transform: scaleX(calc(${this.progress} / 100));\"\n ></div>\n </div>\n `;\n }\n\n protected handleSlotchange(): void {\n const labelFromSlot = getLabelFromSlot(this.label, this.slotEl);\n if (labelFromSlot) {\n this.label = labelFromSlot;\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 (\n changes.has('static') &&\n (this.static !== undefined || changes.get('static') !== undefined)\n ) {\n this.staticColor = this.static;\n if (window.__swc.DEBUG) {\n window.__swc.warn(\n this,\n `The \"static\" attribute of <${this.localName}> has been deprecated. Use \"static-color\" with the same values instead. \"static\" will be removed in a future release.`,\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/api/',\n { level: 'deprecation' }\n );\n }\n }\n if (changes.has('indeterminate')) {\n if (this.indeterminate) {\n this.removeAttribute('aria-valuemin');\n this.removeAttribute('aria-valuemax');\n this.removeAttribute('aria-valuenow');\n } else {\n this.setAttribute('aria-valuemin', '0');\n this.setAttribute('aria-valuemax', '100');\n }\n }\n if (!this.indeterminate && changes.has('progress')) {\n this.setAttribute('aria-valuenow', '' + this.progress);\n }\n if (changes.has('label')) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else if (\n changes.get('label') === this.getAttribute('aria-label')\n ) {\n this.removeAttribute('aria-label');\n }\n }\n\n if (window.__swc.DEBUG) {\n if (\n !this.label &&\n !this.getAttribute('aria-label') &&\n !this.getAttribute('aria-labelledby') &&\n !this.slotHasContent\n ) {\n window.__swc.warn(\n this,\n '<sp-progress-bar> elements need one of the following to be accessible:',\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/#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 'text content supplied directly to the <sp-progress-circle> 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"],
|
5
|
+
"mappings": "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",
|
6
6
|
"names": []
|
7
7
|
}
|
package/src/ProgressBar.js
CHANGED
@@ -1,13 +1,13 @@
|
|
1
|
-
"use strict";var b=Object.defineProperty;var
|
2
|
-
${this.slotHasContent||this.label?
|
1
|
+
"use strict";var b=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var t=(o,a,e,r)=>{for(var i=r>1?void 0:r?c(a,e):a,n=o.length-1,p;n>=0;n--)(p=o[n])&&(i=(r?p(a,e,i):p(i))||i);return r&&i&&b(a,e,i),i};import{html as s,nothing as u,SizedMixin as d,SpectrumElement as h}from"@spectrum-web-components/base";import{property as l,query as m}from"@spectrum-web-components/base/src/decorators.js";import{getLabelFromSlot as f}from"@spectrum-web-components/shared/src/get-label-from-slot.js";import{ObserveSlotText as v}from"@spectrum-web-components/shared/src/observe-slot-text.js";import{LanguageResolutionController as w}from"@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";import"@spectrum-web-components/field-label/sp-field-label.js";import y from"./progress-bar.css.js";export class ProgressBar extends d(v(h,""),{noDefaultSize:!0}){constructor(){super(...arguments);this.indeterminate=!1;this.label="";this.languageResolver=new w(this);this.overBackground=!1;this.sideLabel=!1;this.progress=0}static get styles(){return[y]}render(){return s`
|
2
|
+
${this.slotHasContent||this.label?s`
|
3
3
|
<sp-field-label size=${this.size} class="label">
|
4
|
-
${this.slotHasContent?
|
4
|
+
${this.slotHasContent?s``:this.label}
|
5
5
|
|
6
6
|
<slot @slotchange=${this.handleSlotchange}></slot>
|
7
7
|
</sp-field-label>
|
8
|
-
`:
|
9
|
-
${this.label?
|
10
|
-
${this.indeterminate?u:
|
8
|
+
`:s``}
|
9
|
+
${this.label?s`
|
10
|
+
${this.indeterminate?u:s`
|
11
11
|
<sp-field-label
|
12
12
|
size=${this.size}
|
13
13
|
class="percentage"
|
@@ -22,5 +22,5 @@
|
|
22
22
|
style="transform: scaleX(calc(${this.progress} / 100));"
|
23
23
|
></div>
|
24
24
|
</div>
|
25
|
-
`}handleSlotchange(){const e=f(this.label,this.slotEl);e&&(this.label=e)}firstUpdated(e){super.firstUpdated(e),this.hasAttribute("role")||this.setAttribute("role","progressbar")}updated(e){super.updated(e),e.has("indeterminate")&&(this.indeterminate?(this.removeAttribute("aria-valuemin"),this.removeAttribute("aria-valuemax"),this.removeAttribute("aria-valuenow")):(this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax","100"))),!this.indeterminate&&e.has("progress")&&this.setAttribute("aria-valuenow",""+this.progress),e.has("label")&&(this.label.length?this.setAttribute("aria-label",this.label):e.get("label")===this.getAttribute("aria-label")&&this.removeAttribute("aria-label"))}}t([
|
25
|
+
`}handleSlotchange(){const e=f(this.label,this.slotEl);e&&(this.label=e)}firstUpdated(e){super.firstUpdated(e),this.hasAttribute("role")||this.setAttribute("role","progressbar")}updated(e){super.updated(e),e.has("static")&&(this.static!==void 0||e.get("static")!==void 0)&&(this.staticColor=this.static),e.has("indeterminate")&&(this.indeterminate?(this.removeAttribute("aria-valuemin"),this.removeAttribute("aria-valuemax"),this.removeAttribute("aria-valuenow")):(this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax","100"))),!this.indeterminate&&e.has("progress")&&this.setAttribute("aria-valuenow",""+this.progress),e.has("label")&&(this.label.length?this.setAttribute("aria-label",this.label):e.get("label")===this.getAttribute("aria-label")&&this.removeAttribute("aria-label"))}}t([l({type:Boolean,reflect:!0})],ProgressBar.prototype,"indeterminate",2),t([l({type:String,reflect:!0})],ProgressBar.prototype,"label",2),t([l({type:Boolean,reflect:!0,attribute:"over-background"})],ProgressBar.prototype,"overBackground",2),t([l({type:Boolean,reflect:!0,attribute:"side-label"})],ProgressBar.prototype,"sideLabel",2),t([l({type:Number})],ProgressBar.prototype,"progress",2),t([l({type:String,reflect:!0})],ProgressBar.prototype,"static",2),t([l({reflect:!0,attribute:"static-color"})],ProgressBar.prototype,"staticColor",2),t([m("slot")],ProgressBar.prototype,"slotEl",2);
|
26
26
|
//# sourceMappingURL=ProgressBar.js.map
|
package/src/ProgressBar.js.map
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["ProgressBar.ts"],
|
4
|
-
"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 nothing,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { getLabelFromSlot } from '@spectrum-web-components/shared/src/get-label-from-slot.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { LanguageResolutionController } from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport styles from './progress-bar.css.js';\n\n/**\n * @element sp-progress-bar\n */\nexport class ProgressBar extends SizedMixin(\n ObserveSlotText(SpectrumElement, ''),\n {\n noDefaultSize: true,\n }\n) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: String, reflect: true })\n public label = '';\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n public overBackground = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n public sideLabel = false;\n\n @property({ type: Number })\n public progress = 0;\n\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n protected override render(): TemplateResult {\n return html`\n ${this.slotHasContent || this.label\n ? html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? html`` : this.label}\n\n <slot @slotchange=${this.handleSlotchange}></slot>\n </sp-field-label>\n `\n : html``}\n ${this.label\n ? html`\n ${this.indeterminate\n ? nothing\n : html`\n <sp-field-label\n size=${this.size}\n class=\"percentage\"\n >\n ${new Intl.NumberFormat(\n this.languageResolver.language,\n {\n style: 'percent',\n unitDisplay: 'narrow',\n }\n ).format(this.progress / 100)}\n </sp-field-label>\n `}\n `\n : nothing}\n <div class=\"track\">\n <div\n class=\"fill\"\n style=\"transform: scaleX(calc(${this.progress} / 100));\"\n ></div>\n </div>\n `;\n }\n\n protected handleSlotchange(): void {\n const labelFromSlot = getLabelFromSlot(this.label, this.slotEl);\n if (labelFromSlot) {\n this.label = labelFromSlot;\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 (changes.has('indeterminate')) {\n if (this.indeterminate) {\n this.removeAttribute('aria-valuemin');\n this.removeAttribute('aria-valuemax');\n this.removeAttribute('aria-valuenow');\n } else {\n this.setAttribute('aria-valuemin', '0');\n this.setAttribute('aria-valuemax', '100');\n }\n }\n if (!this.indeterminate && changes.has('progress')) {\n this.setAttribute('aria-valuenow', '' + this.progress);\n }\n if (changes.has('label')) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else if (\n changes.get('label') === this.getAttribute('aria-label')\n ) {\n this.removeAttribute('aria-label');\n }\n }\n\n if (window.__swc.DEBUG) {\n if (\n !this.label &&\n !this.getAttribute('aria-label') &&\n !this.getAttribute('aria-labelledby') &&\n !this.slotHasContent\n ) {\n window.__swc.warn(\n this,\n '<sp-progress-bar> elements need one of the following to be accessible:',\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/#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 'text content supplied directly to the <sp-progress-circle> 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"],
|
5
|
-
"mappings": "qNAYA,OAEI,QAAAA,EACA,WAAAC,EAEA,cAAAC,EACA,mBAAAC,MAEG,gCACP,OACI,YAAAC,EACA,SAAAC,MACG,kDAEP,OAAS,oBAAAC,MAAwB,6DACjC,OAAS,mBAAAC,MAAuB,2DAChC,OAAS,gCAAAC,MAAoC,0EAC7C,MAAO,yDACP,OAAOC,MAAY,wBAKZ,aAAM,oBAAoBP,EAC7BK,EAAgBJ,EAAiB,EAAE,EACnC,CACI,cAAe,EACnB,CACJ,CAAE,CALK,kCAWH,KAAO,cAAgB,GAGvB,KAAO,MAAQ,GAEf,KAAQ,iBAAmB,IAAIK,EAA6B,IAAI,EAGhE,KAAO,eAAiB,GAGxB,KAAO,UAAY,GAGnB,KAAO,SAAW,EAnBlB,WAA2B,QAAyB,CAChD,MAAO,CAACC,CAAM,CAClB,
|
4
|
+
"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 nothing,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { getLabelFromSlot } from '@spectrum-web-components/shared/src/get-label-from-slot.js';\nimport { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';\nimport { LanguageResolutionController } from '@spectrum-web-components/reactive-controllers/src/LanguageResolution.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport styles from './progress-bar.css.js';\n\n/**\n * @element sp-progress-bar\n */\nexport class ProgressBar extends SizedMixin(\n ObserveSlotText(SpectrumElement, ''),\n {\n noDefaultSize: true,\n }\n) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public indeterminate = false;\n\n @property({ type: String, reflect: true })\n public label = '';\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'over-background' })\n public overBackground = false;\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n public sideLabel = false;\n\n @property({ type: Number })\n public progress = 0;\n\n /**\n * @deprecated Use `staticColor` instead.\n */\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n @property({ reflect: true, attribute: 'static-color' })\n public staticColor?: 'white';\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n protected override render(): TemplateResult {\n return html`\n ${this.slotHasContent || this.label\n ? html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? html`` : this.label}\n\n <slot @slotchange=${this.handleSlotchange}></slot>\n </sp-field-label>\n `\n : html``}\n ${this.label\n ? html`\n ${this.indeterminate\n ? nothing\n : html`\n <sp-field-label\n size=${this.size}\n class=\"percentage\"\n >\n ${new Intl.NumberFormat(\n this.languageResolver.language,\n {\n style: 'percent',\n unitDisplay: 'narrow',\n }\n ).format(this.progress / 100)}\n </sp-field-label>\n `}\n `\n : nothing}\n <div class=\"track\">\n <div\n class=\"fill\"\n style=\"transform: scaleX(calc(${this.progress} / 100));\"\n ></div>\n </div>\n `;\n }\n\n protected handleSlotchange(): void {\n const labelFromSlot = getLabelFromSlot(this.label, this.slotEl);\n if (labelFromSlot) {\n this.label = labelFromSlot;\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 (\n changes.has('static') &&\n (this.static !== undefined || changes.get('static') !== undefined)\n ) {\n this.staticColor = this.static;\n if (window.__swc.DEBUG) {\n window.__swc.warn(\n this,\n `The \"static\" attribute of <${this.localName}> has been deprecated. Use \"static-color\" with the same values instead. \"static\" will be removed in a future release.`,\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/api/',\n { level: 'deprecation' }\n );\n }\n }\n if (changes.has('indeterminate')) {\n if (this.indeterminate) {\n this.removeAttribute('aria-valuemin');\n this.removeAttribute('aria-valuemax');\n this.removeAttribute('aria-valuenow');\n } else {\n this.setAttribute('aria-valuemin', '0');\n this.setAttribute('aria-valuemax', '100');\n }\n }\n if (!this.indeterminate && changes.has('progress')) {\n this.setAttribute('aria-valuenow', '' + this.progress);\n }\n if (changes.has('label')) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else if (\n changes.get('label') === this.getAttribute('aria-label')\n ) {\n this.removeAttribute('aria-label');\n }\n }\n\n if (window.__swc.DEBUG) {\n if (\n !this.label &&\n !this.getAttribute('aria-label') &&\n !this.getAttribute('aria-labelledby') &&\n !this.slotHasContent\n ) {\n window.__swc.warn(\n this,\n '<sp-progress-bar> elements need one of the following to be accessible:',\n 'https://opensource.adobe.com/spectrum-web-components/components/progress-bar/#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 'text content supplied directly to the <sp-progress-circle> 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"],
|
5
|
+
"mappings": "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",
|
6
6
|
"names": ["html", "nothing", "SizedMixin", "SpectrumElement", "property", "query", "getLabelFromSlot", "ObserveSlotText", "LanguageResolutionController", "styles", "labelFromSlot", "changes", "__decorateClass"]
|
7
7
|
}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
"use strict";
|
2
2
|
import { css } from "@spectrum-web-components/base";
|
3
3
|
const styles = css`
|
4
|
-
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
|
4
|
+
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
|
5
5
|
`;
|
6
6
|
export default styles;
|
7
7
|
//# sourceMappingURL=progress-bar.css.dev.js.map
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["progress-bar.css.ts"],
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
|
5
5
|
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
|
6
6
|
"names": []
|
7
7
|
}
|
package/src/progress-bar.css.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
1
|
"use strict";import{css as r}from"@spectrum-web-components/base";const e=r`
|
2
|
-
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
|
2
|
+
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
|
3
3
|
`;export default e;
|
4
4
|
//# sourceMappingURL=progress-bar.css.js.map
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["progress-bar.css.ts"],
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
|
5
5
|
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
|
6
6
|
"names": ["css", "styles"]
|
7
7
|
}
|
package/src/spectrum-config.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
"use strict";
|
2
2
|
import { css } from "@spectrum-web-components/base";
|
3
3
|
const styles = css`
|
4
|
-
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}
|
4
|
+
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}
|
5
5
|
`;
|
6
6
|
export default styles;
|
7
7
|
//# sourceMappingURL=spectrum-progress-bar.css.dev.js.map
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["spectrum-progress-bar.css.ts"],
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}\n`;\nexport default styles;"],
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}\n`;\nexport default styles;"],
|
5
5
|
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
|
6
6
|
"names": []
|
7
7
|
}
|
@@ -1,4 +1,4 @@
|
|
1
1
|
"use strict";import{css as r}from"@spectrum-web-components/base";const e=r`
|
2
|
-
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}
|
2
|
+
:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}
|
3
3
|
`;export default e;
|
4
4
|
//# sourceMappingURL=spectrum-progress-bar.css.js.map
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["spectrum-progress-bar.css.ts"],
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static=white]) .fill,:host([static=white]) .label,:host([static=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}\n`;\nexport default styles;"],
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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 :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--spectrum-animation-ease-in-out);--spectrum-progressbar-animation-duration-indeterminate:var(--spectrum-animation-duration-2000);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-medium);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(--spectrum-spacing-75);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(--spectrum-neutral-content-color-default);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(--spectrum-positive-visual-color);--spectrum-progressbar-fill-color-notice:var(--spectrum-notice-visual-color);--spectrum-progressbar-fill-color-negative:var(--spectrum-negative-visual-color);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(--spectrum-transparent-white-300);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-small);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-75)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-200)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(--spectrum-progress-bar-thickness-extra-large);--spectrum-progressbar-spacing-top-to-text:var(--spectrum-component-top-to-text-300)}.spectrum-Meter{--spectrum-progressbar-size-default:var(--mod-meter-inline-size,var(--spectrum-meter-inline-size));--spectrum-progressbar-max-size:var(--mod-meter-max-width,var(--spectrum-meter-max-width));--spectrum-progressbar-min-size:var(--mod-meter-min-width,var(--spectrum-meter-min-width))}:host([positive]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)))}:host([notice]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)))}:host([negative]) .spectrum-Meter .fill{background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)))}:host{font-size:var(--mod-progressbar-font-size,var(--spectrum-progressbar-font-size));vertical-align:top;inline-size:var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default));max-inline-size:var(--mod-progressbar-max-size,var(--spectrum-progressbar-max-size));min-inline-size:var(--mod-progressbar-min-size,var(--spectrum-progressbar-min-size));flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}.label,.percentage{text-align:start;line-height:var(--mod-progressbar-line-height,var(--spectrum-progressbar-line-height));color:var(--mod-progressbar-text-color,var(--spectrum-progressbar-text-color));margin-block-start:var(--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text));margin-block-end:var(--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar))}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk))}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}.track{inline-size:100%;block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));border-radius:var(--spectrum-progressbar-corner-radius);background:var(--highcontrast-progressbar-track-color,var(--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)));overflow:hidden}.fill{block-size:var(--mod-progressbar-thickness,var(--spectrum-progressbar-thickness));background:var(--highcontrast-progressbar-fill-color,var(--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)));border:none;transition:width 1s}:host([indeterminate]) .fill{inline-size:var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate));animation-timing-function:var(--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate));will-change:transform;position:relative}:host([side-label]){flex-flow:row;justify-content:space-between;display:inline-flex}:host([side-label]) .track{flex:1 1 var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text))}:host([static-color=white]) .fill{background:var(--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white))}:host([static-color=white]) .fill,:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white))}:host([static-color=white]) .track{background:var(--spectrum-progressbar-track-color-white)}:host([indeterminate]) .fill{animation:indeterminate-loop-ltr var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate))infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate))*-1))}to{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)))}to{transform:translate(calc(var(--mod-progressbar-size-default,var(--spectrum-progressbar-size-default))*-1))}}@media (forced-colors:active){.track{forced-color-adjust:none;--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText}}\n`;\nexport default styles;"],
|
5
5
|
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
|
6
6
|
"names": ["css", "styles"]
|
7
7
|
}
|
@@ -53,7 +53,10 @@ const makeOverBackground = (variant) => (story) => {
|
|
53
53
|
export const staticWhite = () => {
|
54
54
|
return makeOverBackground("white")(
|
55
55
|
() => html`
|
56
|
-
<sp-progress-bar
|
56
|
+
<sp-progress-bar
|
57
|
+
progress="50"
|
58
|
+
static-color="white"
|
59
|
+
></sp-progress-bar>
|
57
60
|
`
|
58
61
|
);
|
59
62
|
};
|
@@ -63,7 +66,7 @@ export const staticWhiteLabel = () => {
|
|
63
66
|
<sp-progress-bar
|
64
67
|
label="Loading"
|
65
68
|
progress="50"
|
66
|
-
static="white"
|
69
|
+
static-color="white"
|
67
70
|
></sp-progress-bar>
|
68
71
|
`
|
69
72
|
);
|
@@ -74,7 +77,7 @@ export const staticWhiteIndeterminate = () => {
|
|
74
77
|
<sp-progress-bar
|
75
78
|
label="Loading"
|
76
79
|
indeterminate
|
77
|
-
static="white"
|
80
|
+
static-color="white"
|
78
81
|
></sp-progress-bar>
|
79
82
|
`
|
80
83
|
);
|
@@ -85,7 +88,7 @@ export const staticWhiteSideLabel = () => {
|
|
85
88
|
<sp-progress-bar
|
86
89
|
label="Loading"
|
87
90
|
progress="50"
|
88
|
-
static="white"
|
91
|
+
static-color="white"
|
89
92
|
side-label
|
90
93
|
></sp-progress-bar>
|
91
94
|
`
|
@@ -97,7 +100,7 @@ export const staticWhiteSideLabelIndeterminate = () => {
|
|
97
100
|
<sp-progress-bar
|
98
101
|
label="Loading"
|
99
102
|
indeterminate
|
100
|
-
static="white"
|
103
|
+
static-color="white"
|
101
104
|
side-label
|
102
105
|
></sp-progress-bar>
|
103
106
|
`
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["progress-bar.stories.ts"],
|
4
|
-
"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 { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/progress-bar/sp-progress-bar.js';\n\nexport default {\n title: 'Progress Bar',\n component: 'sp-progress-bar',\n};\n\nexport const label = (): TemplateResult => {\n return html`\n <sp-progress-bar label=\"Loading\" progress=\"50\"></sp-progress-bar>\n `;\n};\n\nexport const indeterminate = (): TemplateResult => {\n return html`\n <sp-progress-bar label=\"Loading\" indeterminate></sp-progress-bar>\n `;\n};\n\nexport const sideLabel = (): TemplateResult => {\n return html`\n <sp-progress-bar\n side-label\n label=\"Loading\"\n progress=\"50\"\n ></sp-progress-bar>\n `;\n};\n\nexport const sideIndeterminate = (): TemplateResult => {\n return html`\n <sp-progress-bar\n side-label\n label=\"Loading\"\n indeterminate\n ></sp-progress-bar>\n `;\n};\n\nconst makeOverBackground =\n (variant?: 'white' | 'black') =>\n (story: () => TemplateResult): TemplateResult => {\n const color =\n variant === 'black'\n ? 'rgb(181, 209, 211)'\n : 'var(--spectrum-seafoam-900)';\n return html`\n <div\n style=\"\n --mod-actionbutton-static-content-color: ${color};\n --mod-button-static-content-color: ${color};\n background-color: ${color};\n color: ${color};\n padding: calc(var(--swc-scale-factor) * 14px) calc(var(--swc-scale-factor) * 20px);\n display: inline-block;\n \"\n >\n ${story()}\n </div>\n `;\n };\n\nexport const staticWhite = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar
|
5
|
-
"mappings": ";AAYA,SAAS,YAA4B;AAErC,OAAO;AAEP,eAAe;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AACf;AAEO,aAAM,QAAQ,MAAsB;AACvC,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,gBAAgB,MAAsB;AAC/C,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,YAAY,MAAsB;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOX;AAEO,aAAM,oBAAoB,MAAsB;AACnD,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOX;AAEA,MAAM,qBACF,CAAC,YACD,CAAC,UAAgD;AAC7C,QAAM,QACF,YAAY,UACN,uBACA;AACV,SAAO;AAAA;AAAA;AAAA,+DAGgD,KAAK;AAAA,yDACX,KAAK;AAAA,wCACtB,KAAK;AAAA,6BAChB,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKhB,MAAM,CAAC;AAAA;AAAA;AAGrB;AAEG,aAAM,cAAc,MAAsB;AAC7C,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA,
|
4
|
+
"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 { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/progress-bar/sp-progress-bar.js';\n\nexport default {\n title: 'Progress Bar',\n component: 'sp-progress-bar',\n};\n\nexport const label = (): TemplateResult => {\n return html`\n <sp-progress-bar label=\"Loading\" progress=\"50\"></sp-progress-bar>\n `;\n};\n\nexport const indeterminate = (): TemplateResult => {\n return html`\n <sp-progress-bar label=\"Loading\" indeterminate></sp-progress-bar>\n `;\n};\n\nexport const sideLabel = (): TemplateResult => {\n return html`\n <sp-progress-bar\n side-label\n label=\"Loading\"\n progress=\"50\"\n ></sp-progress-bar>\n `;\n};\n\nexport const sideIndeterminate = (): TemplateResult => {\n return html`\n <sp-progress-bar\n side-label\n label=\"Loading\"\n indeterminate\n ></sp-progress-bar>\n `;\n};\n\nconst makeOverBackground =\n (variant?: 'white' | 'black') =>\n (story: () => TemplateResult): TemplateResult => {\n const color =\n variant === 'black'\n ? 'rgb(181, 209, 211)'\n : 'var(--spectrum-seafoam-900)';\n return html`\n <div\n style=\"\n --mod-actionbutton-static-content-color: ${color};\n --mod-button-static-content-color: ${color};\n background-color: ${color};\n color: ${color};\n padding: calc(var(--swc-scale-factor) * 14px) calc(var(--swc-scale-factor) * 20px);\n display: inline-block;\n \"\n >\n ${story()}\n </div>\n `;\n };\n\nexport const staticWhite = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar\n progress=\"50\"\n static-color=\"white\"\n ></sp-progress-bar>\n `\n );\n};\n\nexport const staticWhiteLabel = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar\n label=\"Loading\"\n progress=\"50\"\n static-color=\"white\"\n ></sp-progress-bar>\n `\n );\n};\n\nexport const staticWhiteIndeterminate = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar\n label=\"Loading\"\n indeterminate\n static-color=\"white\"\n ></sp-progress-bar>\n `\n );\n};\n\nexport const staticWhiteSideLabel = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar\n label=\"Loading\"\n progress=\"50\"\n static-color=\"white\"\n side-label\n ></sp-progress-bar>\n `\n );\n};\n\nexport const staticWhiteSideLabelIndeterminate = (): TemplateResult => {\n return makeOverBackground('white')(\n () => html`\n <sp-progress-bar\n label=\"Loading\"\n indeterminate\n static-color=\"white\"\n side-label\n ></sp-progress-bar>\n `\n );\n};\n"],
|
5
|
+
"mappings": ";AAYA,SAAS,YAA4B;AAErC,OAAO;AAEP,eAAe;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AACf;AAEO,aAAM,QAAQ,MAAsB;AACvC,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,gBAAgB,MAAsB;AAC/C,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,YAAY,MAAsB;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOX;AAEO,aAAM,oBAAoB,MAAsB;AACnD,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOX;AAEA,MAAM,qBACF,CAAC,YACD,CAAC,UAAgD;AAC7C,QAAM,QACF,YAAY,UACN,uBACA;AACV,SAAO;AAAA;AAAA;AAAA,+DAGgD,KAAK;AAAA,yDACX,KAAK;AAAA,wCACtB,KAAK;AAAA,6BAChB,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKhB,MAAM,CAAC;AAAA;AAAA;AAGrB;AAEG,aAAM,cAAc,MAAsB;AAC7C,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMV;AACJ;AAEO,aAAM,mBAAmB,MAAsB;AAClD,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOV;AACJ;AAEO,aAAM,2BAA2B,MAAsB;AAC1D,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOV;AACJ;AAEO,aAAM,uBAAuB,MAAsB;AACtD,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQV;AACJ;AAEO,aAAM,oCAAoC,MAAsB;AACnE,SAAO,mBAAmB,OAAO;AAAA,IAC7B,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQV;AACJ;",
|
6
6
|
"names": []
|
7
7
|
}
|
@@ -105,26 +105,57 @@ describe("ProgressBar", () => {
|
|
105
105
|
await elementUpdated(el);
|
106
106
|
expect(el.hasAttribute("aria-valuenow")).to.be.false;
|
107
107
|
});
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
108
|
+
describe("dev mode", () => {
|
109
|
+
let consoleWarnStub;
|
110
|
+
before(() => {
|
111
|
+
window.__swc.verbose = true;
|
112
|
+
consoleWarnStub = stub(console, "warn");
|
113
|
+
});
|
114
|
+
afterEach(() => {
|
115
|
+
consoleWarnStub.resetHistory();
|
116
|
+
});
|
117
|
+
after(() => {
|
118
|
+
window.__swc.verbose = false;
|
119
|
+
consoleWarnStub.restore();
|
120
|
+
});
|
121
|
+
it("warns in Dev Mode when accessible attributes are not leveraged", async () => {
|
122
|
+
const el = await fixture(html`
|
123
|
+
<sp-progress-bar progress="50"></sp-progress-bar>
|
124
|
+
`);
|
125
|
+
await elementUpdated(el);
|
126
|
+
expect(consoleWarnStub.called).to.be.true;
|
127
|
+
const spyCall = consoleWarnStub.getCall(0);
|
128
|
+
expect(
|
129
|
+
spyCall.args.at(0).includes("accessible"),
|
130
|
+
"confirm accessibility-centric message"
|
131
|
+
).to.be.true;
|
132
|
+
expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
|
133
|
+
data: {
|
134
|
+
localName: "sp-progress-bar",
|
135
|
+
type: "accessibility",
|
136
|
+
level: "default"
|
137
|
+
}
|
138
|
+
});
|
139
|
+
});
|
140
|
+
it("warns in devMode when white/black static is provided", async () => {
|
141
|
+
const el = await fixture(html`
|
142
|
+
<sp-progress-bar progress="50" static="white"></sp-progress-bar>
|
143
|
+
`);
|
144
|
+
await elementUpdated(el);
|
145
|
+
expect(consoleWarnStub.called).to.be.true;
|
146
|
+
const spyCall = consoleWarnStub.getCall(0);
|
147
|
+
expect(
|
148
|
+
spyCall.args.at(0).includes("deprecated"),
|
149
|
+
"confirm deprecated static warning"
|
150
|
+
).to.be.true;
|
151
|
+
expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
|
152
|
+
data: {
|
153
|
+
localName: "sp-progress-bar",
|
154
|
+
type: "api",
|
155
|
+
level: "deprecation"
|
156
|
+
}
|
157
|
+
});
|
126
158
|
});
|
127
|
-
consoleWarnStub.restore();
|
128
159
|
});
|
129
160
|
it("resolves a language (en-US)", async () => {
|
130
161
|
var _a;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["progress-bar.test.ts"],
|
4
|
-
"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 { elementUpdated, expect, fixture, html } from '@open-wc/testing';\n\nimport '@spectrum-web-components/progress-bar/sp-progress-bar.js';\nimport { ProgressBar } from '@spectrum-web-components/progress-bar';\nimport { stub } from 'sinon';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { createLanguageContext } from '../../../tools/reactive-controllers/test/helpers.js';\n\ndescribe('ProgressBar', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Loading\"></sp-progress-bar>\n `)\n );\n it('loads default progress-bar accessibly', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n\n it('accepts label from `slot`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar role=\"progressbar\">\n Label From Slot\n </sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('Label From Slot');\n });\n\n it('handles label attribute changes', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"label\" indeterminate>\n content\n </sp-progress-bar>\n `);\n\n await elementUpdated(el);\n el.setAttribute('label', '');\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('');\n el.setAttribute('label', 'label1');\n await elementUpdated(el);\n expect(el.getAttribute('label')).to.equal('label1');\n });\n\n it('renders label when content is absent', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"myLabel\" indeterminate></sp-progress-bar>\n `);\n expect(el.getAttribute('label')).to.equal('myLabel');\n });\n\n it('renders nothing when both content and label is absent', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"myLabel\" indeterminate></sp-progress-bar>\n `);\n el.removeAttribute('label');\n el.shadowRoot.textContent = '';\n expect(el.getAttribute('label')).to.equal(null);\n expect(el.shadowRoot.textContent?.trim()).to.equal('');\n });\n\n it('accepts a changing progress', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Changing value\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n it('loads - [indeterminate]', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar indeterminate label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n it('accepts user `role`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar\n role=\"progressbar\"\n label=\"With user role\"\n ></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('role')).to.equal('progressbar');\n });\n it('returns to indeterminate', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar\n progress=\"50\"\n label=\"Sometimes indeterminate\"\n ></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.indeterminate = true;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.false;\n });\n it('warns in Dev Mode when accessible attributes are not leveraged', async () => {\n
|
5
|
-
"mappings": "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
|
4
|
+
"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 { elementUpdated, expect, fixture, html } from '@open-wc/testing';\n\nimport '@spectrum-web-components/progress-bar/sp-progress-bar.js';\nimport { ProgressBar } from '@spectrum-web-components/progress-bar';\nimport { stub } from 'sinon';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { createLanguageContext } from '../../../tools/reactive-controllers/test/helpers.js';\n\ndescribe('ProgressBar', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Loading\"></sp-progress-bar>\n `)\n );\n it('loads default progress-bar accessibly', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n\n it('accepts label from `slot`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar role=\"progressbar\">\n Label From Slot\n </sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('Label From Slot');\n });\n\n it('handles label attribute changes', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"label\" indeterminate>\n content\n </sp-progress-bar>\n `);\n\n await elementUpdated(el);\n el.setAttribute('label', '');\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('');\n el.setAttribute('label', 'label1');\n await elementUpdated(el);\n expect(el.getAttribute('label')).to.equal('label1');\n });\n\n it('renders label when content is absent', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"myLabel\" indeterminate></sp-progress-bar>\n `);\n expect(el.getAttribute('label')).to.equal('myLabel');\n });\n\n it('renders nothing when both content and label is absent', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"myLabel\" indeterminate></sp-progress-bar>\n `);\n el.removeAttribute('label');\n el.shadowRoot.textContent = '';\n expect(el.getAttribute('label')).to.equal(null);\n expect(el.shadowRoot.textContent?.trim()).to.equal('');\n });\n\n it('accepts a changing progress', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Changing value\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n it('loads - [indeterminate]', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar indeterminate label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n it('accepts user `role`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar\n role=\"progressbar\"\n label=\"With user role\"\n ></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('role')).to.equal('progressbar');\n });\n it('returns to indeterminate', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar\n progress=\"50\"\n label=\"Sometimes indeterminate\"\n ></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.indeterminate = true;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.false;\n });\n\n describe('dev mode', () => {\n let consoleWarnStub!: ReturnType<typeof stub>;\n before(() => {\n window.__swc.verbose = true;\n consoleWarnStub = stub(console, 'warn');\n });\n afterEach(() => {\n consoleWarnStub.resetHistory();\n });\n after(() => {\n window.__swc.verbose = false;\n consoleWarnStub.restore();\n });\n\n it('warns in Dev Mode when accessible attributes are not leveraged', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar progress=\"50\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(consoleWarnStub.called).to.be.true;\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('accessible'),\n 'confirm accessibility-centric message'\n ).to.be.true;\n expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n data: {\n localName: 'sp-progress-bar',\n type: 'accessibility',\n level: 'default',\n },\n });\n });\n\n it('warns in devMode when white/black static is provided', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar progress=\"50\" static=\"white\"></sp-progress-bar>\n `);\n await elementUpdated(el);\n expect(consoleWarnStub.called).to.be.true;\n\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('deprecated'),\n 'confirm deprecated static warning'\n ).to.be.true;\n expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n data: {\n localName: 'sp-progress-bar',\n type: 'api',\n level: 'deprecation',\n },\n });\n });\n });\n\n it('resolves a language (en-US)', async () => {\n const [languageContext] = createLanguageContext('en-US');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-progress-bar\n label=\"Changing Value\"\n progress=\"45\"\n ></sp-progress-bar>\n </div>\n `);\n const el = test.querySelector('sp-progress-bar') as ProgressBar;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('%')).to.not.equal(-1);\n });\n\n it('resolves a language (ar-sa)', async () => {\n const [languageContext] = createLanguageContext('ar-sa');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-progress-bar\n label=\"Changing Value\"\n progress=\"45\"\n ></sp-progress-bar>\n </div>\n `);\n const el = test.querySelector('sp-progress-bar') as ProgressBar;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('\u066A')).to.not.equal(-1);\n });\n\n it('accepts `aria-label`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar aria-label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-label')).to.be.true;\n expect(el.getAttribute('aria-label')).to.equal('Loading');\n });\n it('sets `aria-label` to equal `label` if `label` is set', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-label')).to.be.true;\n expect(el.getAttribute('aria-label')).to.equal('Loading');\n });\n it('does not remove `aria-label` if set independently of `label`', async () => {\n const el = await fixture<ProgressBar>(html`\n <sp-progress-bar label=\"\" aria-label=\"Loading\"></sp-progress-bar>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-label')).to.be.true;\n expect(el.getAttribute('aria-label')).to.equal('Loading');\n });\n});\n"],
|
5
|
+
"mappings": "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",
|
6
6
|
"names": []
|
7
7
|
}
|