@spectrum-web-components/progress-bar 0.0.0-20241209155954

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md ADDED
@@ -0,0 +1,149 @@
1
+ ## Description
2
+
3
+ An `<sp-progress-bar>` shows the progression of a system operation such as downloading, uploading, processing, etc. in a visual way. It can represent determinate or indeterminate progress.
4
+
5
+ ### Usage
6
+
7
+ [![See it on NPM!](https://img.shields.io/npm/v/@spectrum-web-components/progress-bar?style=for-the-badge)](https://www.npmjs.com/package/@spectrum-web-components/progress-bar)
8
+ [![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@spectrum-web-components/progress-bar?style=for-the-badge)](https://bundlephobia.com/result?p=@spectrum-web-components/progress-bar)
9
+ [![Try it on webcomponents.dev](https://img.shields.io/badge/Try%20it%20on-webcomponents.dev-green?style=for-the-badge)](https://webcomponents.dev/edit/collection/fO75441E1Q5ZlI0e9pgq/WjcwSATAB2ZGd0FopIyP/src/index.ts)
10
+
11
+ ```
12
+ yarn add @spectrum-web-components/progress-bar
13
+ ```
14
+
15
+ Import the side effectful registration of `<sp-progress-bar>` via:
16
+
17
+ ```
18
+ import '@spectrum-web-components/progress-bar/sp-progress-bar.js';
19
+ ```
20
+
21
+ When looking to leverage the `ProgressBar` base class as a type and/or for extension purposes, do so via:
22
+
23
+ ```
24
+ import { ProgressBar } from '@spectrum-web-components/progress-bar';
25
+ ```
26
+
27
+ ## Sizes
28
+
29
+ <sp-tabs selected="m" auto label="Size Attribute Options">
30
+ <sp-tab value="s">Small</sp-tab>
31
+ <sp-tab-panel value="s">
32
+
33
+ ```html
34
+ <div
35
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
36
+ >
37
+ <sp-progress-bar
38
+ size="s"
39
+ label="Loaded a little"
40
+ progress="22"
41
+ ></sp-progress-bar>
42
+ </div>
43
+ ```
44
+
45
+ </sp-tab-panel>
46
+ <sp-tab value="m">Medium</sp-tab>
47
+ <sp-tab-panel value="m">
48
+
49
+ ```html
50
+ <div
51
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
52
+ >
53
+ <sp-progress-bar
54
+ size="m"
55
+ label="Loaded a little"
56
+ progress="22"
57
+ ></sp-progress-bar>
58
+ </div>
59
+ ```
60
+
61
+ </sp-tab-panel>
62
+ <sp-tab value="l">Large</sp-tab>
63
+ <sp-tab-panel value="l">
64
+
65
+ ```html
66
+ <div
67
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
68
+ >
69
+ <sp-progress-bar
70
+ size="l"
71
+ label="Loaded a little"
72
+ progress="22"
73
+ ></sp-progress-bar>
74
+ </div>
75
+ ```
76
+
77
+ </sp-tab-panel>
78
+ <sp-tab value="xl">Extra Large</sp-tab>
79
+ <sp-tab-panel value="xl">
80
+
81
+ ```html
82
+ <div
83
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
84
+ >
85
+ <sp-progress-bar
86
+ size="xl"
87
+ label="Loaded a little"
88
+ progress="22"
89
+ ></sp-progress-bar>
90
+ </div>
91
+ ```
92
+
93
+ </sp-tab-panel>
94
+ </sp-tabs>
95
+
96
+ ## Variants
97
+
98
+ ### Over background
99
+
100
+ When a progress bar needs to be placed on top of a colored background, use the over background progres bar as signified by `[over-background]`. This progress bar uses a white opaque color no matter the background. Make sure the background offers enough contrast for the loader to be legible.
101
+
102
+ ```html
103
+ <div
104
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around; background-color: var(--spectrum-transparent-black-400);"
105
+ >
106
+ <sp-progress-bar
107
+ label="Loaded a large amount"
108
+ progress="77"
109
+ over-background
110
+ ></sp-progress-bar>
111
+ </div>
112
+ ```
113
+
114
+ ### Indeterminate
115
+
116
+ A progress bar can be either determinate or indeterminate as signified by `[indeterminate]`. By default, loaders are determinate. Use a determinate loader when progress can be calculated against a specific goal (e.g., downloading a file of a known size). Use an indeterminate loader when progress is happening but the time or effort to completion can’t be determined (e.g., attempting to reconnect to a server).
117
+
118
+ ```html
119
+ <div
120
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
121
+ >
122
+ <sp-progress-bar
123
+ aria-label="Loaded an unclear amount"
124
+ indeterminate
125
+ ></sp-progress-bar>
126
+ </div>
127
+ ```
128
+
129
+ The above `sp-progress-bar` also leverages the `aria-label` attribute in place of the `label` attribute in ensure that the element is labelled correctly without that label appearing visibly in the UI.
130
+
131
+ ### Side Label
132
+
133
+ A progress bar can be delivered with its labeling displayed above its visual indicator or to either side. Use the boolean `[side-label]` attribute to define where this content should appear.
134
+
135
+ ```html
136
+ <div
137
+ style="width: 240px; height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: space-around;"
138
+ >
139
+ <sp-progress-bar
140
+ side-label
141
+ indeterminate
142
+ label="Label Beside"
143
+ ></sp-progress-bar>
144
+ </div>
145
+ ```
146
+
147
+ ## Accessibility
148
+
149
+ An `sp-progress-bar` element will register itself as a `role="progressbar"` element in the accessibility tree. Any value applied to the `label` attribute will be used both to visibly label the element and to set the `aria-label` attribute on the host. In cases where a visible label is not desired, be sure to include an `aria-label` attribute manually to ensure that the `sp-progress-bar` correctly fulfills its responsibilities to visitors of you site of all abilities.
package/package.json ADDED
@@ -0,0 +1,75 @@
1
+ {
2
+ "name": "@spectrum-web-components/progress-bar",
3
+ "version": "0.0.0-20241209155954",
4
+ "publishConfig": {
5
+ "access": "public"
6
+ },
7
+ "description": "",
8
+ "license": "Apache-2.0",
9
+ "repository": {
10
+ "type": "git",
11
+ "url": "https://github.com/adobe/spectrum-web-components.git",
12
+ "directory": "packages/progress-bar"
13
+ },
14
+ "author": "",
15
+ "homepage": "https://opensource.adobe.com/spectrum-web-components/components/progress-bar",
16
+ "bugs": {
17
+ "url": "https://github.com/adobe/spectrum-web-components/issues"
18
+ },
19
+ "main": "src/index.js",
20
+ "module": "src/index.js",
21
+ "type": "module",
22
+ "exports": {
23
+ ".": {
24
+ "development": "./src/index.dev.js",
25
+ "default": "./src/index.js"
26
+ },
27
+ "./package.json": "./package.json",
28
+ "./src/ProgressBar.js": {
29
+ "development": "./src/ProgressBar.dev.js",
30
+ "default": "./src/ProgressBar.js"
31
+ },
32
+ "./src/index.js": {
33
+ "development": "./src/index.dev.js",
34
+ "default": "./src/index.js"
35
+ },
36
+ "./src/progress-bar-overrides.css.js": "./src/progress-bar-overrides.css.js",
37
+ "./src/progress-bar.css.js": "./src/progress-bar.css.js",
38
+ "./sp-progress-bar.js": {
39
+ "development": "./sp-progress-bar.dev.js",
40
+ "default": "./sp-progress-bar.js"
41
+ }
42
+ },
43
+ "scripts": {
44
+ "test": "echo \"Error: run tests from mono-repo root.\" && exit 1"
45
+ },
46
+ "files": [
47
+ "**/*.d.ts",
48
+ "**/*.js",
49
+ "**/*.js.map",
50
+ "custom-elements.json",
51
+ "!stories/",
52
+ "!test/"
53
+ ],
54
+ "keywords": [
55
+ "spectrum css",
56
+ "web components",
57
+ "lit-element",
58
+ "lit-html"
59
+ ],
60
+ "dependencies": {
61
+ "@spectrum-web-components/base": "0.0.0-20241209155954",
62
+ "@spectrum-web-components/field-label": "0.0.0-20241209155954",
63
+ "@spectrum-web-components/reactive-controllers": "0.0.0-20241209155954",
64
+ "@spectrum-web-components/shared": "0.0.0-20241209155954"
65
+ },
66
+ "devDependencies": {
67
+ "@spectrum-css/progressbar": "^5.0.0-s2-foundations.19"
68
+ },
69
+ "types": "./src/index.d.ts",
70
+ "customElements": "custom-elements.json",
71
+ "sideEffects": [
72
+ "./sp-*.js",
73
+ "./**/*.dev.js"
74
+ ]
75
+ }
@@ -0,0 +1,6 @@
1
+ import { ProgressBar } from './src/ProgressBar.js';
2
+ declare global {
3
+ interface HTMLElementTagNameMap {
4
+ 'sp-progress-bar': ProgressBar;
5
+ }
6
+ }
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ import { ProgressBar } from "./src/ProgressBar.dev.js";
3
+ import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
4
+ defineElement("sp-progress-bar", ProgressBar);
5
+ //# sourceMappingURL=sp-progress-bar.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["sp-progress-bar.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 { ProgressBar } from './src/ProgressBar.dev.js'\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-progress-bar', ProgressBar);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-progress-bar': ProgressBar;\n }\n}\n"],
5
+ "mappings": ";AAYA,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAE9B,cAAc,mBAAmB,WAAW;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";import{ProgressBar as r}from"./src/ProgressBar.js";import{defineElement as e}from"@spectrum-web-components/base/src/define-element.js";e("sp-progress-bar",r);
2
+ //# sourceMappingURL=sp-progress-bar.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["sp-progress-bar.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 { ProgressBar } from './src/ProgressBar.js';\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-progress-bar', ProgressBar);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-progress-bar': ProgressBar;\n }\n}\n"],
5
+ "mappings": "aAYA,OAAS,eAAAA,MAAmB,uBAC5B,OAAS,iBAAAC,MAAqB,sDAE9BA,EAAc,kBAAmBD,CAAW",
6
+ "names": ["ProgressBar", "defineElement"]
7
+ }
@@ -0,0 +1,28 @@
1
+ import { CSSResultArray, PropertyValues, SpectrumElement, TemplateResult } from '@spectrum-web-components/base';
2
+ import '@spectrum-web-components/field-label/sp-field-label.js';
3
+ declare const ProgressBar_base: typeof SpectrumElement & {
4
+ new (...args: any[]): import("@spectrum-web-components/shared/src/observe-slot-text.js").SlotTextObservingInterface;
5
+ prototype: import("@spectrum-web-components/shared/src/observe-slot-text.js").SlotTextObservingInterface;
6
+ } & {
7
+ new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
8
+ prototype: import("@spectrum-web-components/base").SizedElementInterface;
9
+ };
10
+ /**
11
+ * @element sp-progress-bar
12
+ */
13
+ export declare class ProgressBar extends ProgressBar_base {
14
+ static get styles(): CSSResultArray;
15
+ indeterminate: boolean;
16
+ label: string;
17
+ private languageResolver;
18
+ overBackground: boolean;
19
+ sideLabel: boolean;
20
+ progress: number;
21
+ staticColor?: 'white';
22
+ private slotEl;
23
+ protected render(): TemplateResult;
24
+ protected handleSlotchange(): void;
25
+ protected firstUpdated(changes: PropertyValues): void;
26
+ protected updated(changes: PropertyValues): void;
27
+ }
28
+ export {};
@@ -0,0 +1,153 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __decorateClass = (decorators, target, key, kind) => {
5
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
6
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
7
+ if (decorator = decorators[i])
8
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
9
+ if (kind && result) __defProp(target, key, result);
10
+ return result;
11
+ };
12
+ import {
13
+ html,
14
+ nothing,
15
+ SizedMixin,
16
+ SpectrumElement
17
+ } from "@spectrum-web-components/base";
18
+ import {
19
+ property,
20
+ query
21
+ } from "@spectrum-web-components/base/src/decorators.js";
22
+ import { getLabelFromSlot } from "@spectrum-web-components/shared/src/get-label-from-slot.js";
23
+ import { ObserveSlotText } from "@spectrum-web-components/shared/src/observe-slot-text.js";
24
+ import { LanguageResolutionController } from "@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";
25
+ import "@spectrum-web-components/field-label/sp-field-label.js";
26
+ import styles from "./progress-bar.css.js";
27
+ export class ProgressBar extends SizedMixin(
28
+ ObserveSlotText(SpectrumElement, ""),
29
+ {
30
+ noDefaultSize: true
31
+ }
32
+ ) {
33
+ constructor() {
34
+ super(...arguments);
35
+ this.indeterminate = false;
36
+ this.label = "";
37
+ this.languageResolver = new LanguageResolutionController(this);
38
+ this.overBackground = false;
39
+ this.sideLabel = false;
40
+ this.progress = 0;
41
+ }
42
+ static get styles() {
43
+ return [styles];
44
+ }
45
+ render() {
46
+ return html`
47
+ ${this.slotHasContent || this.label ? html`
48
+ <sp-field-label size=${this.size} class="label">
49
+ ${this.slotHasContent ? html`` : this.label}
50
+
51
+ <slot @slotchange=${this.handleSlotchange}></slot>
52
+ </sp-field-label>
53
+ ` : html``}
54
+ ${this.label ? html`
55
+ ${this.indeterminate ? nothing : html`
56
+ <sp-field-label
57
+ size=${this.size}
58
+ class="percentage"
59
+ >
60
+ ${new Intl.NumberFormat(
61
+ this.languageResolver.language,
62
+ {
63
+ style: "percent",
64
+ unitDisplay: "narrow"
65
+ }
66
+ ).format(this.progress / 100)}
67
+ </sp-field-label>
68
+ `}
69
+ ` : nothing}
70
+ <div class="track">
71
+ <div
72
+ class="fill"
73
+ style="transform: scaleX(calc(${this.progress} / 100));"
74
+ ></div>
75
+ </div>
76
+ `;
77
+ }
78
+ handleSlotchange() {
79
+ const labelFromSlot = getLabelFromSlot(this.label, this.slotEl);
80
+ if (labelFromSlot) {
81
+ this.label = labelFromSlot;
82
+ }
83
+ }
84
+ firstUpdated(changes) {
85
+ super.firstUpdated(changes);
86
+ if (!this.hasAttribute("role")) {
87
+ this.setAttribute("role", "progressbar");
88
+ }
89
+ }
90
+ updated(changes) {
91
+ super.updated(changes);
92
+ if (changes.has("indeterminate")) {
93
+ if (this.indeterminate) {
94
+ this.removeAttribute("aria-valuemin");
95
+ this.removeAttribute("aria-valuemax");
96
+ this.removeAttribute("aria-valuenow");
97
+ } else {
98
+ this.setAttribute("aria-valuemin", "0");
99
+ this.setAttribute("aria-valuemax", "100");
100
+ }
101
+ }
102
+ if (!this.indeterminate && changes.has("progress")) {
103
+ this.setAttribute("aria-valuenow", "" + this.progress);
104
+ }
105
+ if (changes.has("label")) {
106
+ if (this.label.length) {
107
+ this.setAttribute("aria-label", this.label);
108
+ } else if (changes.get("label") === this.getAttribute("aria-label")) {
109
+ this.removeAttribute("aria-label");
110
+ }
111
+ }
112
+ if (true) {
113
+ if (!this.label && !this.getAttribute("aria-label") && !this.getAttribute("aria-labelledby") && !this.slotHasContent) {
114
+ window.__swc.warn(
115
+ this,
116
+ "<sp-progress-bar> elements need one of the following to be accessible:",
117
+ "https://opensource.adobe.com/spectrum-web-components/components/progress-bar/#accessibility",
118
+ {
119
+ type: "accessibility",
120
+ issues: [
121
+ 'value supplied to the "label" attribute, which will be displayed visually as part of the element, or',
122
+ "text content supplied directly to the <sp-progress-circle> element, or",
123
+ 'value supplied to the "aria-label" attribute, which will only be provided to screen readers, or',
124
+ '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.'
125
+ ]
126
+ }
127
+ );
128
+ }
129
+ }
130
+ }
131
+ }
132
+ __decorateClass([
133
+ property({ type: Boolean, reflect: true })
134
+ ], ProgressBar.prototype, "indeterminate", 2);
135
+ __decorateClass([
136
+ property({ type: String, reflect: true })
137
+ ], ProgressBar.prototype, "label", 2);
138
+ __decorateClass([
139
+ property({ type: Boolean, reflect: true, attribute: "over-background" })
140
+ ], ProgressBar.prototype, "overBackground", 2);
141
+ __decorateClass([
142
+ property({ type: Boolean, reflect: true, attribute: "side-label" })
143
+ ], ProgressBar.prototype, "sideLabel", 2);
144
+ __decorateClass([
145
+ property({ type: Number })
146
+ ], ProgressBar.prototype, "progress", 2);
147
+ __decorateClass([
148
+ property({ reflect: true, attribute: "static-color" })
149
+ ], ProgressBar.prototype, "staticColor", 2);
150
+ __decorateClass([
151
+ query("slot")
152
+ ], ProgressBar.prototype, "slotEl", 2);
153
+ //# sourceMappingURL=ProgressBar.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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({ 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 (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,EAyBmB,SAAyB;AACxC,WAAO;AAAA,cACD,KAAK,kBAAkB,KAAK,QACxB;AAAA,6CAC2B,KAAK,IAAI;AAAA,4BAC1B,KAAK,iBAAiB,SAAS,KAAK,KAAK;AAAA;AAAA,8CAEvB,KAAK,gBAAgB;AAAA;AAAA,sBAGjD,MAAM;AAAA,cACV,KAAK,QACD;AAAA,wBACM,KAAK,gBACD,UACA;AAAA;AAAA,2CAEe,KAAK,IAAI;AAAA;AAAA;AAAA,sCAGd,IAAI,KAAK;AAAA,MACP,KAAK,iBAAiB;AAAA,MACtB;AAAA,QACI,OAAO;AAAA,QACP,aAAa;AAAA,MACjB;AAAA,IACJ,EAAE,OAAO,KAAK,WAAW,GAAG,CAAC;AAAA;AAAA,6BAEpC;AAAA,sBAEX,OAAO;AAAA;AAAA;AAAA;AAAA,oDAI2B,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA,EAI7D;AAAA,EAEU,mBAAyB;AAC/B,UAAM,gBAAgB,iBAAiB,KAAK,OAAO,KAAK,MAAM;AAC9D,QAAI,eAAe;AACf,WAAK,QAAQ;AAAA,IACjB;AAAA,EACJ;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,QAAI,CAAC,KAAK,aAAa,MAAM,GAAG;AAC5B,WAAK,aAAa,QAAQ,aAAa;AAAA,IAC3C;AAAA,EACJ;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,QAAQ,IAAI,eAAe,GAAG;AAC9B,UAAI,KAAK,eAAe;AACpB,aAAK,gBAAgB,eAAe;AACpC,aAAK,gBAAgB,eAAe;AACpC,aAAK,gBAAgB,eAAe;AAAA,MACxC,OAAO;AACH,aAAK,aAAa,iBAAiB,GAAG;AACtC,aAAK,aAAa,iBAAiB,KAAK;AAAA,MAC5C;AAAA,IACJ;AACA,QAAI,CAAC,KAAK,iBAAiB,QAAQ,IAAI,UAAU,GAAG;AAChD,WAAK,aAAa,iBAAiB,KAAK,KAAK,QAAQ;AAAA,IACzD;AACA,QAAI,QAAQ,IAAI,OAAO,GAAG;AACtB,UAAI,KAAK,MAAM,QAAQ;AACnB,aAAK,aAAa,cAAc,KAAK,KAAK;AAAA,MAC9C,WACI,QAAQ,IAAI,OAAO,MAAM,KAAK,aAAa,YAAY,GACzD;AACE,aAAK,gBAAgB,YAAY;AAAA,MACrC;AAAA,IACJ;AAEA,QAAI,MAAoB;AACpB,UACI,CAAC,KAAK,SACN,CAAC,KAAK,aAAa,YAAY,KAC/B,CAAC,KAAK,aAAa,iBAAiB,KACpC,CAAC,KAAK,gBACR;AACE,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,YACI,MAAM;AAAA,YACN,QAAQ;AAAA,cACJ;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,YACJ;AAAA,UACJ;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;AA7HW;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAVjC,YAWF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAbhC,YAcF;AAKA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,kBAAkB,CAAC;AAAA,GAlB/D,YAmBF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,aAAa,CAAC;AAAA,GArB1D,YAsBF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAxBjB,YAyBF;AAGA;AAAA,EADN,SAAS,EAAE,SAAS,MAAM,WAAW,eAAe,CAAC;AAAA,GA3B7C,YA4BF;AAGC;AAAA,EADP,MAAM,MAAM;AAAA,GA9BJ,YA+BD;",
6
+ "names": []
7
+ }
@@ -0,0 +1,26 @@
1
+ "use strict";var u=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var t=(o,a,e,s)=>{for(var l=s>1?void 0:s?d(a,e):a,n=o.length-1,p;n>=0;n--)(p=o[n])&&(l=(s?p(a,e,l):p(l))||l);return s&&l&&u(a,e,l),l};import{html as i,nothing as b,SizedMixin as h,SpectrumElement as c}from"@spectrum-web-components/base";import{property as r,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 y}from"@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";import"@spectrum-web-components/field-label/sp-field-label.js";import g from"./progress-bar.css.js";export class ProgressBar extends h(v(c,""),{noDefaultSize:!0}){constructor(){super(...arguments);this.indeterminate=!1;this.label="";this.languageResolver=new y(this);this.overBackground=!1;this.sideLabel=!1;this.progress=0}static get styles(){return[g]}render(){return i`
2
+ ${this.slotHasContent||this.label?i`
3
+ <sp-field-label size=${this.size} class="label">
4
+ ${this.slotHasContent?i``:this.label}
5
+
6
+ <slot @slotchange=${this.handleSlotchange}></slot>
7
+ </sp-field-label>
8
+ `:i``}
9
+ ${this.label?i`
10
+ ${this.indeterminate?b:i`
11
+ <sp-field-label
12
+ size=${this.size}
13
+ class="percentage"
14
+ >
15
+ ${new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.progress/100)}
16
+ </sp-field-label>
17
+ `}
18
+ `:b}
19
+ <div class="track">
20
+ <div
21
+ class="fill"
22
+ style="transform: scaleX(calc(${this.progress} / 100));"
23
+ ></div>
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([r({type:Boolean,reflect:!0})],ProgressBar.prototype,"indeterminate",2),t([r({type:String,reflect:!0})],ProgressBar.prototype,"label",2),t([r({type:Boolean,reflect:!0,attribute:"over-background"})],ProgressBar.prototype,"overBackground",2),t([r({type:Boolean,reflect:!0,attribute:"side-label"})],ProgressBar.prototype,"sideLabel",2),t([r({type:Number})],ProgressBar.prototype,"progress",2),t([r({reflect:!0,attribute:"static-color"})],ProgressBar.prototype,"staticColor",2),t([m("slot")],ProgressBar.prototype,"slotEl",2);
26
+ //# sourceMappingURL=ProgressBar.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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({ 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 (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,CAyBmB,QAAyB,CACxC,OAAOT;AAAA,cACD,KAAK,gBAAkB,KAAK,MACxBA;AAAA,6CAC2B,KAAK,IAAI;AAAA,4BAC1B,KAAK,eAAiBA,IAAS,KAAK,KAAK;AAAA;AAAA,8CAEvB,KAAK,gBAAgB;AAAA;AAAA,oBAGjDA,GAAM;AAAA,cACV,KAAK,MACDA;AAAA,wBACM,KAAK,cACDC,EACAD;AAAA;AAAA,2CAEe,KAAK,IAAI;AAAA;AAAA;AAAA,sCAGd,IAAI,KAAK,aACP,KAAK,iBAAiB,SACtB,CACI,MAAO,UACP,YAAa,QACjB,CACJ,EAAE,OAAO,KAAK,SAAW,GAAG,CAAC;AAAA;AAAA,6BAEpC;AAAA,oBAEXC,CAAO;AAAA;AAAA;AAAA;AAAA,oDAI2B,KAAK,QAAQ;AAAA;AAAA;AAAA,SAI7D,CAEU,kBAAyB,CAC/B,MAAMS,EAAgBJ,EAAiB,KAAK,MAAO,KAAK,MAAM,EAC1DI,IACA,KAAK,MAAQA,EAErB,CAEmB,aAAaC,EAA+B,CAC3D,MAAM,aAAaA,CAAO,EACrB,KAAK,aAAa,MAAM,GACzB,KAAK,aAAa,OAAQ,aAAa,CAE/C,CAEmB,QAAQA,EAA+B,CACtD,MAAM,QAAQA,CAAO,EACjBA,EAAQ,IAAI,eAAe,IACvB,KAAK,eACL,KAAK,gBAAgB,eAAe,EACpC,KAAK,gBAAgB,eAAe,EACpC,KAAK,gBAAgB,eAAe,IAEpC,KAAK,aAAa,gBAAiB,GAAG,EACtC,KAAK,aAAa,gBAAiB,KAAK,IAG5C,CAAC,KAAK,eAAiBA,EAAQ,IAAI,UAAU,GAC7C,KAAK,aAAa,gBAAiB,GAAK,KAAK,QAAQ,EAErDA,EAAQ,IAAI,OAAO,IACf,KAAK,MAAM,OACX,KAAK,aAAa,aAAc,KAAK,KAAK,EAE1CA,EAAQ,IAAI,OAAO,IAAM,KAAK,aAAa,YAAY,GAEvD,KAAK,gBAAgB,YAAY,EA2B7C,CACJ,CA7HWC,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAVjC,YAWF,6BAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAbhC,YAcF,qBAKAQ,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,iBAAkB,CAAC,GAlB/D,YAmBF,8BAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,YAAa,CAAC,GArB1D,YAsBF,yBAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,MAAO,CAAC,GAxBjB,YAyBF,wBAGAQ,EAAA,CADNR,EAAS,CAAE,QAAS,GAAM,UAAW,cAAe,CAAC,GA3B7C,YA4BF,2BAGCQ,EAAA,CADPP,EAAM,MAAM,GA9BJ,YA+BD",
6
+ "names": ["html", "nothing", "SizedMixin", "SpectrumElement", "property", "query", "getLabelFromSlot", "ObserveSlotText", "LanguageResolutionController", "styles", "labelFromSlot", "changes", "__decorateClass"]
7
+ }
package/src/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from './ProgressBar.js';
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ export * from "./ProgressBar.dev.js";
3
+ //# sourceMappingURL=index.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["index.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\nexport * from './ProgressBar.dev.js'\n"],
5
+ "mappings": ";AAYA,cAAc;",
6
+ "names": []
7
+ }
package/src/index.js ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";export*from"./ProgressBar.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["index.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\nexport * from './ProgressBar.js';\n"],
5
+ "mappings": "aAYA,WAAc",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=progress-bar-overrides.css.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["progress-bar-overrides.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(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as s}from"@spectrum-web-components/base";const r=s`
2
+ :host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}
3
+ `;export default r;
4
+ //# sourceMappingURL=progress-bar-overrides.css.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["progress-bar-overrides.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(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=progress-bar.css.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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{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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as r}from"@spectrum-web-components/base";const s=r`
2
+ :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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}
3
+ `;export default s;
4
+ //# sourceMappingURL=progress-bar.css.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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{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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}:host{--spectrum-progressbar-animation-ease-in-out-indeterminate:var(--system-progress-bar-animation-ease-in-out-indeterminate);--spectrum-progressbar-animation-duration-indeterminate:var(--system-progress-bar-animation-duration-indeterminate);--spectrum-progressbar-corner-radius:var(--system-progress-bar-corner-radius);--spectrum-progressbar-fill-size-indeterminate:var(--system-progress-bar-fill-size-indeterminate);--spectrum-progressbar-size-2400:var(--system-progress-bar-size-2400);--spectrum-progressbar-size-2500:var(--system-progress-bar-size-2500);--spectrum-progressbar-size-2800:var(--system-progress-bar-size-2800);--spectrum-progressbar-line-height-cjk:var(--system-progress-bar-line-height-cjk);--spectrum-progressbar-min-size:var(--system-progress-bar-min-size);--spectrum-progressbar-max-size:var(--system-progress-bar-max-size);--spectrum-progressbar-line-height:var(--system-progress-bar-line-height);--spectrum-progressbar-spacing-label-to-progressbar:var(--system-progress-bar-spacing-label-to);--spectrum-progressbar-spacing-label-to-text:var(--system-progress-bar-spacing-label-to-text);--spectrum-progressbar-text-color:var(--system-progress-bar-text-color);--spectrum-progressbar-track-color:var(--system-progress-bar-track-color);--spectrum-progressbar-fill-color:var(--system-progress-bar-fill-color);--spectrum-progressbar-label-and-value-white:var(--system-progress-bar-label-and-value-white);--spectrum-progressbar-track-color-white:var(--system-progress-bar-track-color-white);--spectrum-progressbar-fill-color-white:var(--system-progress-bar-fill-color-white);--spectrum-progressbar-size-default:var(--system-progress-bar-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-spacing-top-to-text)}:host{--spectrum-progressbar-size-default:var(--system-progress-bar-size-m-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-m-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-m-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-m-spacing-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-s-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-s-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-s-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-s-spacing-top-to-text)}:host([size=l]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-l-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-l-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-l-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-l-spacing-top-to-text)}:host([size=xl]){--spectrum-progressbar-size-default:var(--system-progress-bar-size-xl-size-default);--spectrum-progressbar-font-size:var(--system-progress-bar-size-xl-font-size);--spectrum-progressbar-thickness:var(--system-progress-bar-size-xl-thickness);--spectrum-progressbar-spacing-top-to-text:var(--system-progress-bar-size-xl-spacing-top-to-text)}.fill{width:100%;transform-origin:0}:host([dir=rtl]) .fill{transform-origin:100%}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
@@ -0,0 +1,77 @@
1
+ // @ts-check
2
+ /*
3
+ Copyright 2023 Adobe. All rights reserved.
4
+ This file is licensed to you under the Apache License, Version 2.0 (the 'License');
5
+ you may not use this file except in compliance with the License. You may obtain a copy
6
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
7
+
8
+ Unless required by applicable law or agreed to in writing, software distributed under
9
+ the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
10
+ OF ANY KIND, either express or implied. See the License for the specific language
11
+ governing permissions and limitations under the License.
12
+ */
13
+
14
+ import {
15
+ builder,
16
+ converterFor,
17
+ } from '../../../tasks/process-spectrum-utils.js';
18
+
19
+ const converter = converterFor('spectrum-ProgressBar');
20
+
21
+ /**
22
+ * @type { import('../../../tasks/spectrum-css-converter').SpectrumCSSConverter }
23
+ */
24
+ const config = {
25
+ conversions: [
26
+ {
27
+ inPackage: '@spectrum-css/progressbar',
28
+ outPackage: 'progress-bar',
29
+ fileName: 'progress-bar',
30
+ components: [
31
+ converter.classToHost(),
32
+ converter.classToClass('spectrum-ProgressBar-track'),
33
+ converter.classToClass('spectrum-ProgressBar-fill'),
34
+ converter.classToClass('spectrum-ProgressBar-label'),
35
+ converter.classToClass('spectrum-ProgressBar-percentage'),
36
+ converter.classToAttribute(
37
+ 'spectrum-ProgressBar--sideLabel',
38
+ 'side-label'
39
+ ),
40
+ converter.classToAttribute('spectrum-ProgressBar-small'),
41
+ converter.classToAttribute(
42
+ 'spectrum-ProgressBar--indeterminate'
43
+ ),
44
+ converter.classToAttribute(
45
+ 'spectrum-ProgressBar--overBackground',
46
+ 'over-background'
47
+ ),
48
+ converter.classToAttribute('is-positive', 'positive'),
49
+ converter.classToAttribute('is-notice', 'notice'),
50
+ converter.classToAttribute('is-negative', 'negative'),
51
+ // Default to `size='m'` without needing the attribute
52
+ converter.classToHost('spectrum-ProgressBar--sizeM'),
53
+ ...converter.enumerateAttributes(
54
+ [
55
+ ['spectrum-ProgressBar--sizeS', 's'],
56
+ ['spectrum-ProgressBar--sizeL', 'l'],
57
+ ['spectrum-ProgressBar--sizeXL', 'xl'],
58
+ ],
59
+ 'size'
60
+ ),
61
+ ...converter.enumerateAttributes(
62
+ [
63
+ ['spectrum-ProgressBar--staticBlack', 'black'],
64
+ ['spectrum-ProgressBar--staticWhite', 'white'],
65
+ ],
66
+ 'static-color'
67
+ ),
68
+ ],
69
+ excludeByComponents: [
70
+ builder.class('spectrum-Meter--sizeS'),
71
+ builder.class('spectrum-Meter--sizeL'),
72
+ ],
73
+ },
74
+ ],
75
+ };
76
+
77
+ export default config;
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=spectrum-progress-bar.css.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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{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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as r}from"@spectrum-web-components/base";const e=r`
2
+ :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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}
3
+ `;export default e;
4
+ //# sourceMappingURL=spectrum-progress-bar.css.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 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{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;animation-name:indeterminate-loop-ltr;animation-duration:var(--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate));animation-iteration-count:infinite;position:relative}:host([indeterminate]) .fill:dir(rtl),:host([dir=rtl][indeterminate]) .fill{animation-name:indeterminate-loop-rtl}: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)}@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{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;forced-color-adjust:none;border:1px solid ButtonText}}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }