@spectrum-web-components/meter 0.38.0 → 0.39.0
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 +30 -7
- package/custom-elements.json +44 -61
- package/package.json +6 -6
- package/src/Meter.d.ts +11 -4
- package/src/Meter.dev.js +25 -15
- package/src/Meter.dev.js.map +2 -2
- package/src/Meter.js +3 -3
- package/src/Meter.js.map +3 -3
- package/src/meter.css.dev.js +25 -21
- package/src/meter.css.dev.js.map +2 -2
- package/src/meter.css.js +25 -21
- package/src/meter.css.js.map +2 -2
- package/src/spectrum-config.js +9 -8
- package/src/spectrum-meter.css.dev.js +25 -21
- package/src/spectrum-meter.css.dev.js.map +2 -2
- package/src/spectrum-meter.css.js +25 -21
- package/src/spectrum-meter.css.js.map +2 -2
- package/stories/meter.stories.js +3 -3
- package/stories/meter.stories.js.map +1 -1
- package/test/meter.test.js +31 -0
- package/test/meter.test.js.map +2 -2
package/README.md
CHANGED
|
@@ -63,16 +63,39 @@ import { Meter } from '@spectrum-web-components/meter';
|
|
|
63
63
|
|
|
64
64
|
## Variants
|
|
65
65
|
|
|
66
|
-
###
|
|
66
|
+
### Informative
|
|
67
67
|
|
|
68
|
-
|
|
68
|
+
By default, the informative variant can be used to represent a neutral or non-semantic value, such as the number of tutorials completed.
|
|
69
69
|
|
|
70
70
|
```html
|
|
71
|
-
<
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
71
|
+
<sp-meter progress="50">Storage Space</sp-meter>
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
### Positive
|
|
75
|
+
|
|
76
|
+
The positive variant can be used to represent a positive semantic value, such as when there’s a lot of space remaining.
|
|
77
|
+
Use value `variant="positive"` to define a positive variant.
|
|
78
|
+
|
|
79
|
+
```html
|
|
80
|
+
<sp-meter variant="positive" progress="50">Storage Space</sp-meter>
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
### Notice
|
|
84
|
+
|
|
85
|
+
The notice variant can be used to warn users about a situation that may need to be addressed soon, such as when space remaining is becoming limited.
|
|
86
|
+
Use value `variant="notice"` to define a notice variant.
|
|
87
|
+
|
|
88
|
+
```html
|
|
89
|
+
<sp-meter variant="notice" progress="73">Storage Space</sp-meter>
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Negative
|
|
93
|
+
|
|
94
|
+
The negative variant can be used to warn users about a critical situation that needs their urgent attention, such as when space remaining is becoming very limited.
|
|
95
|
+
Use value `variant="negative"` to define a negative variant.
|
|
96
|
+
|
|
97
|
+
```html
|
|
98
|
+
<sp-meter variant="negative" progress="92">Storage Space</sp-meter>
|
|
76
99
|
```
|
|
77
100
|
|
|
78
101
|
### Side Label
|
package/custom-elements.json
CHANGED
|
@@ -21,6 +21,14 @@
|
|
|
21
21
|
"kind": "javascript-module",
|
|
22
22
|
"path": "src/Meter.js",
|
|
23
23
|
"declarations": [
|
|
24
|
+
{
|
|
25
|
+
"kind": "variable",
|
|
26
|
+
"name": "meterVariants",
|
|
27
|
+
"type": {
|
|
28
|
+
"text": "array"
|
|
29
|
+
},
|
|
30
|
+
"default": "[\n 'positive',\n 'notice',\n 'negative',\n]"
|
|
31
|
+
},
|
|
24
32
|
{
|
|
25
33
|
"kind": "class",
|
|
26
34
|
"description": "",
|
|
@@ -44,47 +52,30 @@
|
|
|
44
52
|
},
|
|
45
53
|
{
|
|
46
54
|
"kind": "field",
|
|
47
|
-
"name": "
|
|
48
|
-
"type": {
|
|
49
|
-
"text": "boolean"
|
|
50
|
-
},
|
|
51
|
-
"privacy": "public",
|
|
52
|
-
"default": "false",
|
|
53
|
-
"attribute": "over-background",
|
|
54
|
-
"reflects": true
|
|
55
|
-
},
|
|
56
|
-
{
|
|
57
|
-
"kind": "field",
|
|
58
|
-
"name": "notice",
|
|
59
|
-
"type": {
|
|
60
|
-
"text": "boolean"
|
|
61
|
-
},
|
|
55
|
+
"name": "variant",
|
|
62
56
|
"privacy": "public",
|
|
63
|
-
"
|
|
64
|
-
"
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
57
|
+
"description": "The variant applies specific styling when set to `negative`, `positive`, `notice`\n`variant` attribute is removed when not matching one of the above.",
|
|
58
|
+
"parameters": [
|
|
59
|
+
{
|
|
60
|
+
"name": "variant",
|
|
61
|
+
"type": {
|
|
62
|
+
"text": "String"
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
],
|
|
70
66
|
"type": {
|
|
71
|
-
"text": "
|
|
67
|
+
"text": "MeterVariants"
|
|
72
68
|
},
|
|
73
|
-
"
|
|
74
|
-
"default": "false",
|
|
75
|
-
"attribute": "negative",
|
|
76
|
-
"reflects": true
|
|
69
|
+
"attribute": "variant"
|
|
77
70
|
},
|
|
78
71
|
{
|
|
79
72
|
"kind": "field",
|
|
80
|
-
"name": "
|
|
73
|
+
"name": "_variant",
|
|
81
74
|
"type": {
|
|
82
|
-
"text": "
|
|
75
|
+
"text": "MeterVariants"
|
|
83
76
|
},
|
|
84
|
-
"privacy": "
|
|
85
|
-
"default": "
|
|
86
|
-
"attribute": "positive",
|
|
87
|
-
"reflects": true
|
|
77
|
+
"privacy": "private",
|
|
78
|
+
"default": "''"
|
|
88
79
|
},
|
|
89
80
|
{
|
|
90
81
|
"kind": "field",
|
|
@@ -153,36 +144,20 @@
|
|
|
153
144
|
"fieldName": "progress"
|
|
154
145
|
},
|
|
155
146
|
{
|
|
156
|
-
"name": "
|
|
157
|
-
"
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
"text": "boolean"
|
|
167
|
-
},
|
|
168
|
-
"default": "false",
|
|
169
|
-
"fieldName": "notice"
|
|
170
|
-
},
|
|
171
|
-
{
|
|
172
|
-
"name": "negative",
|
|
173
|
-
"type": {
|
|
174
|
-
"text": "boolean"
|
|
175
|
-
},
|
|
176
|
-
"default": "false",
|
|
177
|
-
"fieldName": "negative"
|
|
178
|
-
},
|
|
179
|
-
{
|
|
180
|
-
"name": "positive",
|
|
147
|
+
"name": "variant",
|
|
148
|
+
"description": "The variant applies specific styling when set to `negative`, `positive`, `notice`\n`variant` attribute is removed when not matching one of the above.",
|
|
149
|
+
"parameters": [
|
|
150
|
+
{
|
|
151
|
+
"name": "variant",
|
|
152
|
+
"type": {
|
|
153
|
+
"text": "String"
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
],
|
|
181
157
|
"type": {
|
|
182
|
-
"text": "
|
|
158
|
+
"text": "MeterVariants"
|
|
183
159
|
},
|
|
184
|
-
"
|
|
185
|
-
"fieldName": "positive"
|
|
160
|
+
"fieldName": "variant"
|
|
186
161
|
},
|
|
187
162
|
{
|
|
188
163
|
"name": "label",
|
|
@@ -227,6 +202,14 @@
|
|
|
227
202
|
}
|
|
228
203
|
],
|
|
229
204
|
"exports": [
|
|
205
|
+
{
|
|
206
|
+
"kind": "js",
|
|
207
|
+
"name": "meterVariants",
|
|
208
|
+
"declaration": {
|
|
209
|
+
"name": "meterVariants",
|
|
210
|
+
"module": "src/Meter.js"
|
|
211
|
+
}
|
|
212
|
+
},
|
|
230
213
|
{
|
|
231
214
|
"kind": "js",
|
|
232
215
|
"name": "Meter",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/meter",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.39.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -57,12 +57,12 @@
|
|
|
57
57
|
"lit-html"
|
|
58
58
|
],
|
|
59
59
|
"dependencies": {
|
|
60
|
-
"@spectrum-web-components/base": "^0.
|
|
61
|
-
"@spectrum-web-components/field-label": "^0.
|
|
62
|
-
"@spectrum-web-components/shared": "^0.
|
|
60
|
+
"@spectrum-web-components/base": "^0.39.0",
|
|
61
|
+
"@spectrum-web-components/field-label": "^0.39.0",
|
|
62
|
+
"@spectrum-web-components/shared": "^0.39.0"
|
|
63
63
|
},
|
|
64
64
|
"devDependencies": {
|
|
65
|
-
"@spectrum-css/progressbar": "^3.0.
|
|
65
|
+
"@spectrum-css/progressbar": "^3.0.73"
|
|
66
66
|
},
|
|
67
67
|
"types": "./src/index.d.ts",
|
|
68
68
|
"customElements": "custom-elements.json",
|
|
@@ -70,5 +70,5 @@
|
|
|
70
70
|
"./sp-*.js",
|
|
71
71
|
"./**/*.dev.js"
|
|
72
72
|
],
|
|
73
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "2acc8390ef0ac6cc940958d4da705c9859155c0d"
|
|
74
74
|
}
|
package/src/Meter.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { CSSResultArray, PropertyValues, SpectrumElement, TemplateResult } from '@spectrum-web-components/base';
|
|
2
2
|
import '@spectrum-web-components/field-label/sp-field-label.js';
|
|
3
|
+
export declare const meterVariants: string[];
|
|
4
|
+
export declare type MeterVariants = typeof meterVariants[number];
|
|
3
5
|
declare const Meter_base: typeof SpectrumElement & {
|
|
4
6
|
new (...args: any[]): import("@spectrum-web-components/shared/src/observe-slot-text.js").SlotTextObservingInterface;
|
|
5
7
|
prototype: import("@spectrum-web-components/shared/src/observe-slot-text.js").SlotTextObservingInterface;
|
|
@@ -15,10 +17,15 @@ declare const Meter_base: typeof SpectrumElement & {
|
|
|
15
17
|
export declare class Meter extends Meter_base {
|
|
16
18
|
static get styles(): CSSResultArray;
|
|
17
19
|
progress: number;
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
/**
|
|
21
|
+
* The variant applies specific styling when set to `negative`, `positive`, `notice`
|
|
22
|
+
* `variant` attribute is removed when not matching one of the above.
|
|
23
|
+
*
|
|
24
|
+
* @param {String} variant
|
|
25
|
+
*/
|
|
26
|
+
set variant(variant: MeterVariants);
|
|
27
|
+
get variant(): MeterVariants;
|
|
28
|
+
private _variant;
|
|
22
29
|
label: string;
|
|
23
30
|
private slotEl;
|
|
24
31
|
private languageResolver;
|
package/src/Meter.dev.js
CHANGED
|
@@ -25,16 +25,18 @@ import { ObserveSlotText } from "@spectrum-web-components/shared/src/observe-slo
|
|
|
25
25
|
import { LanguageResolutionController } from "@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";
|
|
26
26
|
import "@spectrum-web-components/field-label/sp-field-label.js";
|
|
27
27
|
import styles from "./meter.css.js";
|
|
28
|
+
export const meterVariants = [
|
|
29
|
+
"positive",
|
|
30
|
+
"notice",
|
|
31
|
+
"negative"
|
|
32
|
+
];
|
|
28
33
|
export class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ""), {
|
|
29
34
|
noDefaultSize: true
|
|
30
35
|
}) {
|
|
31
36
|
constructor() {
|
|
32
37
|
super(...arguments);
|
|
33
38
|
this.progress = 0;
|
|
34
|
-
this.
|
|
35
|
-
this.notice = false;
|
|
36
|
-
this.negative = false;
|
|
37
|
-
this.positive = false;
|
|
39
|
+
this._variant = "";
|
|
38
40
|
this.label = "";
|
|
39
41
|
this.languageResolver = new LanguageResolutionController(this);
|
|
40
42
|
// called sideLabel
|
|
@@ -43,6 +45,23 @@ export class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ""), {
|
|
|
43
45
|
static get styles() {
|
|
44
46
|
return [styles];
|
|
45
47
|
}
|
|
48
|
+
set variant(variant) {
|
|
49
|
+
if (variant === this.variant) {
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
const oldValue = this.variant;
|
|
53
|
+
if (meterVariants.includes(variant)) {
|
|
54
|
+
this.setAttribute("variant", variant);
|
|
55
|
+
this._variant = variant;
|
|
56
|
+
} else {
|
|
57
|
+
this.removeAttribute("variant");
|
|
58
|
+
this._variant = "";
|
|
59
|
+
}
|
|
60
|
+
this.requestUpdate("variant", oldValue);
|
|
61
|
+
}
|
|
62
|
+
get variant() {
|
|
63
|
+
return this._variant;
|
|
64
|
+
}
|
|
46
65
|
render() {
|
|
47
66
|
return html`
|
|
48
67
|
<sp-field-label size=${this.size} class="label">
|
|
@@ -91,17 +110,8 @@ __decorateClass([
|
|
|
91
110
|
property({ type: Number })
|
|
92
111
|
], Meter.prototype, "progress", 2);
|
|
93
112
|
__decorateClass([
|
|
94
|
-
property({ type:
|
|
95
|
-
], Meter.prototype, "
|
|
96
|
-
__decorateClass([
|
|
97
|
-
property({ type: Boolean, reflect: true })
|
|
98
|
-
], Meter.prototype, "notice", 2);
|
|
99
|
-
__decorateClass([
|
|
100
|
-
property({ type: Boolean, reflect: true })
|
|
101
|
-
], Meter.prototype, "negative", 2);
|
|
102
|
-
__decorateClass([
|
|
103
|
-
property({ type: Boolean, reflect: true })
|
|
104
|
-
], Meter.prototype, "positive", 2);
|
|
113
|
+
property({ type: String })
|
|
114
|
+
], Meter.prototype, "variant", 1);
|
|
105
115
|
__decorateClass([
|
|
106
116
|
property({ type: String, reflect: true })
|
|
107
117
|
], Meter.prototype, "label", 2);
|
package/src/Meter.dev.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Meter.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 './meter.css.js';\n\n/**\n * @element sp-meter\n *\n * @slot - text labeling the Meter\n */\nexport class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ''), {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Number })\n public progress = 0;\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;
|
|
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 './meter.css.js';\n\nexport const meterVariants = [\n 'positive',\n 'notice',\n 'negative',\n];\n\nexport type MeterVariants = typeof meterVariants[number];\n\n/**\n * @element sp-meter\n *\n * @slot - text labeling the Meter\n */\nexport class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ''), {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Number })\n public progress = 0;\n\n /**\n * The variant applies specific styling when set to `negative`, `positive`, `notice`\n * `variant` attribute is removed when not matching one of the above.\n *\n * @param {String} variant\n */\n @property({ type: String })\n public set variant(variant: MeterVariants) {\n if (variant === this.variant) {\n return;\n }\n const oldValue = this.variant;\n if (meterVariants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldValue);\n }\n\n public get variant(): MeterVariants {\n return this._variant;\n }\n\n private _variant: MeterVariants = '';\n\n @property({ type: String, reflect: true })\n public label = '';\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n // called sideLabel\n public sideLabel = false;\n\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n protected override render(): TemplateResult {\n return html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? nothing : this.label}\n <slot @slotchange=${this.handleSlotchange}>${this.label}</slot>\n </sp-field-label>\n <sp-field-label size=${this.size} class=\"percentage\">\n ${new Intl.NumberFormat(this.languageResolver.language, {\n style: 'percent',\n unitDisplay: 'narrow',\n }).format(this.progress / 100)}\n </sp-field-label>\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 this.setAttribute('role', 'meter progressbar');\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (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 {\n this.removeAttribute('aria-label');\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;AAEZ,aAAM,gBAAgB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AACJ;AASO,aAAM,cAAc,WAAW,gBAAgB,iBAAiB,EAAE,GAAG;AAAA,EACxE,eAAe;AACnB,CAAC,EAAE;AAAA,EAFI;AAAA;AAQH,SAAO,WAAW;AA4BlB,SAAQ,WAA0B;AAGlC,SAAO,QAAQ;AAKf,SAAQ,mBAAmB,IAAI,6BAA6B,IAAI;AAIhE;AAAA,SAAO,YAAY;AAAA;AAAA,EA7CnB,WAA2B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,EAYA,IAAW,QAAQ,SAAwB;AACvC,QAAI,YAAY,KAAK,SAAS;AAC1B;AAAA,IACJ;AACA,UAAM,WAAW,KAAK;AACtB,QAAI,cAAc,SAAS,OAAO,GAAG;AACjC,WAAK,aAAa,WAAW,OAAO;AACpC,WAAK,WAAW;AAAA,IACpB,OAAO;AACH,WAAK,gBAAgB,SAAS;AAC9B,WAAK,WAAW;AAAA,IACpB;AACA,SAAK,cAAc,WAAW,QAAQ;AAAA,EAC1C;AAAA,EAEA,IAAW,UAAyB;AAChC,WAAO,KAAK;AAAA,EAChB;AAAA,EAmBmB,SAAyB;AACxC,WAAO;AAAA,mCACoB,KAAK,IAAI;AAAA,kBAC1B,KAAK,iBAAiB,UAAU,KAAK,KAAK;AAAA,oCACxB,KAAK,gBAAgB,IAAI,KAAK,KAAK;AAAA;AAAA,mCAEpC,KAAK,IAAI;AAAA,kBAC1B,IAAI,KAAK,aAAa,KAAK,iBAAiB,UAAU;AAAA,MACpD,OAAO;AAAA,MACP,aAAa;AAAA,IACjB,CAAC,EAAE,OAAO,KAAK,WAAW,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,oDAKM,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,SAAK,aAAa,QAAQ,mBAAmB;AAAA,EACjD;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,QAAQ,IAAI,UAAU,GAAG;AACzB,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,OAAO;AACH,aAAK,gBAAgB,YAAY;AAAA,MACrC;AAAA,IACJ;AAAA,EACJ;AACJ;AA3FW;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAPjB,MAQF;AASI;AAAA,EADV,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAhBjB,MAiBE;AAsBJ;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAtChC,MAuCF;AAGC;AAAA,EADP,MAAM,MAAM;AAAA,GAzCJ,MA0CD;AAMD;AAAA,EAFN,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,aAAa,CAAC;AAAA,GA9C1D,MAgDF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAlDhC,MAmDF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/Meter.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var p=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var r=(a,s,e,i)=>{for(var t=i>1?void 0:i?u(s,e):s,o=a.length-1,n;o>=0;o--)(n=a[o])&&(t=(i?n(s,e,t):n(t))||t);return i&&t&&p(s,e,t),t};import{html as d,nothing as b,SizedMixin as h,SpectrumElement as c}from"@spectrum-web-components/base";import{property as l,query as m}from"@spectrum-web-components/base/src/decorators.js";import{getLabelFromSlot as v}from"@spectrum-web-components/shared/src/get-label-from-slot.js";import{ObserveSlotText as f}from"@spectrum-web-components/shared/src/observe-slot-text.js";import{LanguageResolutionController as g}from"@spectrum-web-components/reactive-controllers/src/LanguageResolution.js";import"@spectrum-web-components/field-label/sp-field-label.js";import y from"./meter.css.js";export const meterVariants=["positive","notice","negative"];export class Meter extends h(f(c,""),{noDefaultSize:!0}){constructor(){super(...arguments);this.progress=0;this._variant="";this.label="";this.languageResolver=new g(this);this.sideLabel=!1}static get styles(){return[y]}set variant(e){if(e===this.variant)return;const i=this.variant;meterVariants.includes(e)?(this.setAttribute("variant",e),this._variant=e):(this.removeAttribute("variant"),this._variant=""),this.requestUpdate("variant",i)}get variant(){return this._variant}render(){return d`
|
|
2
2
|
<sp-field-label size=${this.size} class="label">
|
|
3
|
-
${this.slotHasContent?
|
|
3
|
+
${this.slotHasContent?b:this.label}
|
|
4
4
|
<slot @slotchange=${this.handleSlotchange}>${this.label}</slot>
|
|
5
5
|
</sp-field-label>
|
|
6
6
|
<sp-field-label size=${this.size} class="percentage">
|
|
@@ -12,5 +12,5 @@
|
|
|
12
12
|
style="transform: scaleX(calc(${this.progress} / 100));"
|
|
13
13
|
></div>
|
|
14
14
|
</div>
|
|
15
|
-
`}handleSlotchange(){const e=
|
|
15
|
+
`}handleSlotchange(){const e=v(this.label,this.slotEl);e&&(this.label=e)}firstUpdated(e){super.firstUpdated(e),this.setAttribute("role","meter progressbar")}updated(e){super.updated(e),e.has("progress")&&this.setAttribute("aria-valuenow",""+this.progress),e.has("label")&&(this.label.length?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"))}}r([l({type:Number})],Meter.prototype,"progress",2),r([l({type:String})],Meter.prototype,"variant",1),r([l({type:String,reflect:!0})],Meter.prototype,"label",2),r([m("slot")],Meter.prototype,"slotEl",2),r([l({type:Boolean,reflect:!0,attribute:"side-label"})],Meter.prototype,"sideLabel",2),r([l({type:String,reflect:!0})],Meter.prototype,"static",2);
|
|
16
16
|
//# sourceMappingURL=Meter.js.map
|
package/src/Meter.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Meter.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 './meter.css.js';\n\n/**\n * @element sp-meter\n *\n * @slot - text labeling the Meter\n */\nexport class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ''), {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Number })\n public progress = 0;\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,
|
|
6
|
-
"names": ["html", "nothing", "SizedMixin", "SpectrumElement", "property", "query", "getLabelFromSlot", "ObserveSlotText", "LanguageResolutionController", "styles", "labelFromSlot", "changes", "__decorateClass"]
|
|
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 './meter.css.js';\n\nexport const meterVariants = [\n 'positive',\n 'notice',\n 'negative',\n];\n\nexport type MeterVariants = typeof meterVariants[number];\n\n/**\n * @element sp-meter\n *\n * @slot - text labeling the Meter\n */\nexport class Meter extends SizedMixin(ObserveSlotText(SpectrumElement, ''), {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Number })\n public progress = 0;\n\n /**\n * The variant applies specific styling when set to `negative`, `positive`, `notice`\n * `variant` attribute is removed when not matching one of the above.\n *\n * @param {String} variant\n */\n @property({ type: String })\n public set variant(variant: MeterVariants) {\n if (variant === this.variant) {\n return;\n }\n const oldValue = this.variant;\n if (meterVariants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldValue);\n }\n\n public get variant(): MeterVariants {\n return this._variant;\n }\n\n private _variant: MeterVariants = '';\n\n @property({ type: String, reflect: true })\n public label = '';\n\n @query('slot')\n private slotEl!: HTMLSlotElement;\n\n private languageResolver = new LanguageResolutionController(this);\n\n @property({ type: Boolean, reflect: true, attribute: 'side-label' })\n // called sideLabel\n public sideLabel = false;\n\n @property({ type: String, reflect: true })\n public static: 'white' | undefined;\n\n protected override render(): TemplateResult {\n return html`\n <sp-field-label size=${this.size} class=\"label\">\n ${this.slotHasContent ? nothing : this.label}\n <slot @slotchange=${this.handleSlotchange}>${this.label}</slot>\n </sp-field-label>\n <sp-field-label size=${this.size} class=\"percentage\">\n ${new Intl.NumberFormat(this.languageResolver.language, {\n style: 'percent',\n unitDisplay: 'narrow',\n }).format(this.progress / 100)}\n </sp-field-label>\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 this.setAttribute('role', 'meter progressbar');\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (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 {\n this.removeAttribute('aria-label');\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,iBAEZ,aAAM,cAAgB,CACzB,WACA,SACA,UACJ,EASO,aAAM,cAAcP,EAAWK,EAAgBJ,EAAiB,EAAE,EAAG,CACxE,cAAe,EACnB,CAAC,CAAE,CAFI,kCAQH,KAAO,SAAW,EA4BlB,KAAQ,SAA0B,GAGlC,KAAO,MAAQ,GAKf,KAAQ,iBAAmB,IAAIK,EAA6B,IAAI,EAIhE,KAAO,UAAY,GA7CnB,WAA2B,QAAyB,CAChD,MAAO,CAACC,CAAM,CAClB,CAYA,IAAW,QAAQC,EAAwB,CACvC,GAAIA,IAAY,KAAK,QACjB,OAEJ,MAAMC,EAAW,KAAK,QAClB,cAAc,SAASD,CAAO,GAC9B,KAAK,aAAa,UAAWA,CAAO,EACpC,KAAK,SAAWA,IAEhB,KAAK,gBAAgB,SAAS,EAC9B,KAAK,SAAW,IAEpB,KAAK,cAAc,UAAWC,CAAQ,CAC1C,CAEA,IAAW,SAAyB,CAChC,OAAO,KAAK,QAChB,CAmBmB,QAAyB,CACxC,OAAOX;AAAA,mCACoB,KAAK,IAAI;AAAA,kBAC1B,KAAK,eAAiBC,EAAU,KAAK,KAAK;AAAA,oCACxB,KAAK,gBAAgB,IAAI,KAAK,KAAK;AAAA;AAAA,mCAEpC,KAAK,IAAI;AAAA,kBAC1B,IAAI,KAAK,aAAa,KAAK,iBAAiB,SAAU,CACpD,MAAO,UACP,YAAa,QACjB,CAAC,EAAE,OAAO,KAAK,SAAW,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,oDAKM,KAAK,QAAQ;AAAA;AAAA;AAAA,SAI7D,CAEU,kBAAyB,CAC/B,MAAMW,EAAgBN,EAAiB,KAAK,MAAO,KAAK,MAAM,EAC1DM,IACA,KAAK,MAAQA,EAErB,CAEmB,aAAaC,EAA+B,CAC3D,MAAM,aAAaA,CAAO,EAC1B,KAAK,aAAa,OAAQ,mBAAmB,CACjD,CAEmB,QAAQA,EAA+B,CACtD,MAAM,QAAQA,CAAO,EACjBA,EAAQ,IAAI,UAAU,GACtB,KAAK,aAAa,gBAAiB,GAAK,KAAK,QAAQ,EAErDA,EAAQ,IAAI,OAAO,IACf,KAAK,MAAM,OACX,KAAK,aAAa,aAAc,KAAK,KAAK,EAE1C,KAAK,gBAAgB,YAAY,EAG7C,CACJ,CA3FWC,EAAA,CADNV,EAAS,CAAE,KAAM,MAAO,CAAC,GAPjB,MAQF,wBASIU,EAAA,CADVV,EAAS,CAAE,KAAM,MAAO,CAAC,GAhBjB,MAiBE,uBAsBJU,EAAA,CADNV,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAtChC,MAuCF,qBAGCU,EAAA,CADPT,EAAM,MAAM,GAzCJ,MA0CD,sBAMDS,EAAA,CAFNV,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,YAAa,CAAC,GA9C1D,MAgDF,yBAGAU,EAAA,CADNV,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAlDhC,MAmDF",
|
|
6
|
+
"names": ["html", "nothing", "SizedMixin", "SpectrumElement", "property", "query", "getLabelFromSlot", "ObserveSlotText", "LanguageResolutionController", "styles", "variant", "oldValue", "labelFromSlot", "changes", "__decorateClass"]
|
|
7
7
|
}
|
package/src/meter.css.dev.js
CHANGED
|
@@ -21,7 +21,7 @@ const styles = css`
|
|
|
21
21
|
--spectrum-negative-visual-color
|
|
22
22
|
);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(
|
|
23
23
|
--spectrum-transparent-white-300
|
|
24
|
-
);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
24
|
+
);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
25
25
|
--spectrum-progress-bar-thickness-small
|
|
26
26
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
27
27
|
--spectrum-component-top-to-text-75
|
|
@@ -37,7 +37,25 @@ const styles = css`
|
|
|
37
37
|
--spectrum-progress-bar-thickness-extra-large
|
|
38
38
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
39
39
|
--spectrum-component-top-to-text-300
|
|
40
|
-
)}
|
|
40
|
+
)}:host{--spectrum-progressbar-size-default:var(
|
|
41
|
+
--mod-meter-inline-size,var(--spectrum-meter-inline-size)
|
|
42
|
+
);--spectrum-progressbar-max-size:var(
|
|
43
|
+
--mod-meter-max-width,var(--spectrum-meter-max-width)
|
|
44
|
+
);--spectrum-progressbar-min-size:var(
|
|
45
|
+
--mod-meter-min-width,var(--spectrum-meter-min-width)
|
|
46
|
+
)}:host([variant=positive]) .fill{background-color:var(
|
|
47
|
+
--highcontrast-progressbar-fill-color,var(
|
|
48
|
+
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
49
|
+
)
|
|
50
|
+
)}:host([variant=notice]) .fill{background-color:var(
|
|
51
|
+
--highcontrast-progressbar-fill-color,var(
|
|
52
|
+
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
53
|
+
)
|
|
54
|
+
)}:host([variant=negative]) .fill{background-color:var(
|
|
55
|
+
--highcontrast-progressbar-fill-color,var(
|
|
56
|
+
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
57
|
+
)
|
|
58
|
+
)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(
|
|
41
59
|
--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)
|
|
42
60
|
);inline-size:var(
|
|
43
61
|
--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)
|
|
@@ -57,30 +75,16 @@ const styles = css`
|
|
|
57
75
|
--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)
|
|
58
76
|
)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(
|
|
59
77
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
60
|
-
)}.track{background:var(
|
|
78
|
+
)}.track{background-color:var(
|
|
61
79
|
--highcontrast-progressbar-track-color,var(
|
|
62
80
|
--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)
|
|
63
81
|
)
|
|
64
|
-
);block-size:var(
|
|
82
|
+
);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(
|
|
65
83
|
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
66
|
-
)
|
|
67
|
-
--highcontrast-progressbar-fill-color,var(
|
|
68
|
-
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
69
|
-
)
|
|
70
|
-
)}:host([notice]) .fill{background:var(
|
|
71
|
-
--highcontrast-progressbar-fill-color,var(
|
|
72
|
-
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
73
|
-
)
|
|
74
|
-
)}:host([negative]) .fill{background:var(
|
|
75
|
-
--highcontrast-progressbar-fill-color,var(
|
|
76
|
-
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
77
|
-
)
|
|
78
|
-
)}.fill{background:var(
|
|
84
|
+
)}.fill{background-color:var(
|
|
79
85
|
--highcontrast-progressbar-fill-color,var(
|
|
80
86
|
--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)
|
|
81
87
|
)
|
|
82
|
-
);block-size:var(
|
|
83
|
-
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
84
88
|
);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(
|
|
85
89
|
--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)
|
|
86
90
|
);inline-size:var(
|
|
@@ -91,7 +95,7 @@ const styles = css`
|
|
|
91
95
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
92
96
|
)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(
|
|
93
97
|
--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
94
|
-
);order:3;text-align:end}:host([static=white]) .fill{background:var(
|
|
98
|
+
);order:3;text-align:end}:host([static=white]) .fill{background-color:var(
|
|
95
99
|
--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)
|
|
96
100
|
);color:var(
|
|
97
101
|
--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)
|
|
@@ -111,7 +115,7 @@ var(--spectrum-progressbar-fill-size-indeterminate)
|
|
|
111
115
|
))}to{transform:translate(calc(var(
|
|
112
116
|
--mod-progressbar-size-default,
|
|
113
117
|
var(--spectrum-progressbar-size-default)
|
|
114
|
-
)*-1))}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}
|
|
118
|
+
)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}
|
|
115
119
|
`;
|
|
116
120
|
export default styles;
|
|
117
121
|
//# sourceMappingURL=meter.css.dev.js.map
|
package/src/meter.css.dev.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["meter.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}
|
|
5
|
-
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}:host{--spectrum-progressbar-size-default:var(\n--mod-meter-inline-size,var(--spectrum-meter-inline-size)\n);--spectrum-progressbar-max-size:var(\n--mod-meter-max-width,var(--spectrum-meter-max-width)\n);--spectrum-progressbar-min-size:var(\n--mod-meter-min-width,var(--spectrum-meter-min-width)\n)}:host([variant=positive]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)\n)\n)}:host([variant=notice]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)\n)\n)}:host([variant=negative]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)\n)\n)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(\n--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)\n);inline-size:var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n);justify-content:space-between;max-inline-size:var(\n--mod-progressbar-max-size,var(--spectrum-progressbar-max-size)\n);min-inline-size:var(\n--mod-progressbar-min-size,var(--spectrum-progressbar-min-size)\n);position:relative;vertical-align:top}.label,.percentage{color:var(\n--mod-progressbar-text-color,var(--spectrum-progressbar-text-color)\n);line-height:var(\n--mod-progressbar-line-height,var(--spectrum-progressbar-line-height)\n);margin-block-end:var(\n--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar)\n);margin-block-start:var(\n--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text)\n);text-align:start}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(\n--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)\n)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}.track{background-color:var(\n--highcontrast-progressbar-track-color,var(\n--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)\n)\n);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(\n--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)\n)}.fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)\n)\n);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(\n--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)\n);inline-size:var(\n--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate)\n);position:relative;will-change:transform}:host([side-label]){display:inline-flex;flex-flow:row;justify-content:space-between}:host([side-label]) .track{flex:1 1 var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n)}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(\n--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n);order:3;text-align:end}:host([static=white]) .fill{background-color:var(\n--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)\n);color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .label,:host([static=white]) .percentage{color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .track{background-color:var(--spectrum-progressbar-track-color-white)}:host([dir=ltr][indeterminate]) .fill{animation:indeterminate-loop-ltr var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(\n--mod-progressbar-fill-size-indeterminate,\nvar(--spectrum-progressbar-fill-size-indeterminate)\n)*-1))}to{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)\n))}to{transform:translate(calc(var(\n--mod-progressbar-size-default,\nvar(--spectrum-progressbar-size-default)\n)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}\n`;\nexport default styles;"],
|
|
5
|
+
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqHf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/meter.css.js
CHANGED
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
--spectrum-negative-visual-color
|
|
20
20
|
);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(
|
|
21
21
|
--spectrum-transparent-white-300
|
|
22
|
-
);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
22
|
+
);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
23
23
|
--spectrum-progress-bar-thickness-small
|
|
24
24
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
25
25
|
--spectrum-component-top-to-text-75
|
|
@@ -35,7 +35,25 @@
|
|
|
35
35
|
--spectrum-progress-bar-thickness-extra-large
|
|
36
36
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
37
37
|
--spectrum-component-top-to-text-300
|
|
38
|
-
)}
|
|
38
|
+
)}:host{--spectrum-progressbar-size-default:var(
|
|
39
|
+
--mod-meter-inline-size,var(--spectrum-meter-inline-size)
|
|
40
|
+
);--spectrum-progressbar-max-size:var(
|
|
41
|
+
--mod-meter-max-width,var(--spectrum-meter-max-width)
|
|
42
|
+
);--spectrum-progressbar-min-size:var(
|
|
43
|
+
--mod-meter-min-width,var(--spectrum-meter-min-width)
|
|
44
|
+
)}:host([variant=positive]) .fill{background-color:var(
|
|
45
|
+
--highcontrast-progressbar-fill-color,var(
|
|
46
|
+
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
47
|
+
)
|
|
48
|
+
)}:host([variant=notice]) .fill{background-color:var(
|
|
49
|
+
--highcontrast-progressbar-fill-color,var(
|
|
50
|
+
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
51
|
+
)
|
|
52
|
+
)}:host([variant=negative]) .fill{background-color:var(
|
|
53
|
+
--highcontrast-progressbar-fill-color,var(
|
|
54
|
+
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
55
|
+
)
|
|
56
|
+
)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(
|
|
39
57
|
--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)
|
|
40
58
|
);inline-size:var(
|
|
41
59
|
--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)
|
|
@@ -55,30 +73,16 @@
|
|
|
55
73
|
--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)
|
|
56
74
|
)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(
|
|
57
75
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
58
|
-
)}.track{background:var(
|
|
76
|
+
)}.track{background-color:var(
|
|
59
77
|
--highcontrast-progressbar-track-color,var(
|
|
60
78
|
--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)
|
|
61
79
|
)
|
|
62
|
-
);block-size:var(
|
|
80
|
+
);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(
|
|
63
81
|
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
64
|
-
)
|
|
65
|
-
--highcontrast-progressbar-fill-color,var(
|
|
66
|
-
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
67
|
-
)
|
|
68
|
-
)}:host([notice]) .fill{background:var(
|
|
69
|
-
--highcontrast-progressbar-fill-color,var(
|
|
70
|
-
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
71
|
-
)
|
|
72
|
-
)}:host([negative]) .fill{background:var(
|
|
73
|
-
--highcontrast-progressbar-fill-color,var(
|
|
74
|
-
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
75
|
-
)
|
|
76
|
-
)}.fill{background:var(
|
|
82
|
+
)}.fill{background-color:var(
|
|
77
83
|
--highcontrast-progressbar-fill-color,var(
|
|
78
84
|
--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)
|
|
79
85
|
)
|
|
80
|
-
);block-size:var(
|
|
81
|
-
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
82
86
|
);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(
|
|
83
87
|
--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)
|
|
84
88
|
);inline-size:var(
|
|
@@ -89,7 +93,7 @@
|
|
|
89
93
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
90
94
|
)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(
|
|
91
95
|
--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
92
|
-
);order:3;text-align:end}:host([static=white]) .fill{background:var(
|
|
96
|
+
);order:3;text-align:end}:host([static=white]) .fill{background-color:var(
|
|
93
97
|
--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)
|
|
94
98
|
);color:var(
|
|
95
99
|
--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)
|
|
@@ -109,6 +113,6 @@ var(--spectrum-progressbar-fill-size-indeterminate)
|
|
|
109
113
|
))}to{transform:translate(calc(var(
|
|
110
114
|
--mod-progressbar-size-default,
|
|
111
115
|
var(--spectrum-progressbar-size-default)
|
|
112
|
-
)*-1))}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}
|
|
116
|
+
)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}
|
|
113
117
|
`;export default e;
|
|
114
118
|
//# sourceMappingURL=meter.css.js.map
|
package/src/meter.css.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["meter.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}
|
|
5
|
-
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}:host{--spectrum-progressbar-size-default:var(\n--mod-meter-inline-size,var(--spectrum-meter-inline-size)\n);--spectrum-progressbar-max-size:var(\n--mod-meter-max-width,var(--spectrum-meter-max-width)\n);--spectrum-progressbar-min-size:var(\n--mod-meter-min-width,var(--spectrum-meter-min-width)\n)}:host([variant=positive]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)\n)\n)}:host([variant=notice]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)\n)\n)}:host([variant=negative]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)\n)\n)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(\n--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)\n);inline-size:var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n);justify-content:space-between;max-inline-size:var(\n--mod-progressbar-max-size,var(--spectrum-progressbar-max-size)\n);min-inline-size:var(\n--mod-progressbar-min-size,var(--spectrum-progressbar-min-size)\n);position:relative;vertical-align:top}.label,.percentage{color:var(\n--mod-progressbar-text-color,var(--spectrum-progressbar-text-color)\n);line-height:var(\n--mod-progressbar-line-height,var(--spectrum-progressbar-line-height)\n);margin-block-end:var(\n--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar)\n);margin-block-start:var(\n--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text)\n);text-align:start}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(\n--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)\n)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}.track{background-color:var(\n--highcontrast-progressbar-track-color,var(\n--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)\n)\n);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(\n--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)\n)}.fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)\n)\n);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(\n--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)\n);inline-size:var(\n--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate)\n);position:relative;will-change:transform}:host([side-label]){display:inline-flex;flex-flow:row;justify-content:space-between}:host([side-label]) .track{flex:1 1 var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n)}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(\n--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n);order:3;text-align:end}:host([static=white]) .fill{background-color:var(\n--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)\n);color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .label,:host([static=white]) .percentage{color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .track{background-color:var(--spectrum-progressbar-track-color-white)}:host([dir=ltr][indeterminate]) .fill{animation:indeterminate-loop-ltr var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(\n--mod-progressbar-fill-size-indeterminate,\nvar(--spectrum-progressbar-fill-size-indeterminate)\n)*-1))}to{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)\n))}to{transform:translate(calc(var(\n--mod-progressbar-size-default,\nvar(--spectrum-progressbar-size-default)\n)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}.fill{transform-origin:left}:host([dir=rtl]) .fill{transform-origin:right}\n`;\nexport default styles;"],
|
|
5
|
+
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqHf,eAAeC",
|
|
6
6
|
"names": ["css", "styles"]
|
|
7
7
|
}
|
package/src/spectrum-config.js
CHANGED
|
@@ -29,6 +29,7 @@ const config = {
|
|
|
29
29
|
fileName: 'meter',
|
|
30
30
|
components: [
|
|
31
31
|
converter.classToHost(),
|
|
32
|
+
converter.classToHost('spectrum-Meter'),
|
|
32
33
|
converter.classToClass('spectrum-ProgressBar-track'),
|
|
33
34
|
converter.classToClass('spectrum-ProgressBar-fill'),
|
|
34
35
|
converter.classToClass('spectrum-ProgressBar-label'),
|
|
@@ -37,17 +38,9 @@ const config = {
|
|
|
37
38
|
'spectrum-ProgressBar--sideLabel',
|
|
38
39
|
'side-label'
|
|
39
40
|
),
|
|
40
|
-
converter.classToAttribute('spectrum-ProgressBar-small'),
|
|
41
41
|
converter.classToAttribute(
|
|
42
42
|
'spectrum-ProgressBar--indeterminate'
|
|
43
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
44
|
// Default to `size='m'` without needing the attribute
|
|
52
45
|
converter.classToHost('spectrum-ProgressBar--sizeM'),
|
|
53
46
|
...converter.enumerateAttributes(
|
|
@@ -65,6 +58,14 @@ const config = {
|
|
|
65
58
|
],
|
|
66
59
|
'static'
|
|
67
60
|
),
|
|
61
|
+
...converter.enumerateAttributes(
|
|
62
|
+
[
|
|
63
|
+
['is-positive', 'positive'],
|
|
64
|
+
['is-notice', 'notice'],
|
|
65
|
+
['is-negative', 'negative'],
|
|
66
|
+
],
|
|
67
|
+
'variant'
|
|
68
|
+
),
|
|
68
69
|
],
|
|
69
70
|
excludeByComponents: [
|
|
70
71
|
builder.class('spectrum-Meter--sizeS'),
|
|
@@ -21,7 +21,7 @@ const styles = css`
|
|
|
21
21
|
--spectrum-negative-visual-color
|
|
22
22
|
);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(
|
|
23
23
|
--spectrum-transparent-white-300
|
|
24
|
-
);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
24
|
+
);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
25
25
|
--spectrum-progress-bar-thickness-small
|
|
26
26
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
27
27
|
--spectrum-component-top-to-text-75
|
|
@@ -37,7 +37,25 @@ const styles = css`
|
|
|
37
37
|
--spectrum-progress-bar-thickness-extra-large
|
|
38
38
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
39
39
|
--spectrum-component-top-to-text-300
|
|
40
|
-
)}
|
|
40
|
+
)}:host{--spectrum-progressbar-size-default:var(
|
|
41
|
+
--mod-meter-inline-size,var(--spectrum-meter-inline-size)
|
|
42
|
+
);--spectrum-progressbar-max-size:var(
|
|
43
|
+
--mod-meter-max-width,var(--spectrum-meter-max-width)
|
|
44
|
+
);--spectrum-progressbar-min-size:var(
|
|
45
|
+
--mod-meter-min-width,var(--spectrum-meter-min-width)
|
|
46
|
+
)}:host([variant=positive]) .fill{background-color:var(
|
|
47
|
+
--highcontrast-progressbar-fill-color,var(
|
|
48
|
+
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
49
|
+
)
|
|
50
|
+
)}:host([variant=notice]) .fill{background-color:var(
|
|
51
|
+
--highcontrast-progressbar-fill-color,var(
|
|
52
|
+
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
53
|
+
)
|
|
54
|
+
)}:host([variant=negative]) .fill{background-color:var(
|
|
55
|
+
--highcontrast-progressbar-fill-color,var(
|
|
56
|
+
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
57
|
+
)
|
|
58
|
+
)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(
|
|
41
59
|
--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)
|
|
42
60
|
);inline-size:var(
|
|
43
61
|
--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)
|
|
@@ -57,30 +75,16 @@ const styles = css`
|
|
|
57
75
|
--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)
|
|
58
76
|
)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(
|
|
59
77
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
60
|
-
)}.track{background:var(
|
|
78
|
+
)}.track{background-color:var(
|
|
61
79
|
--highcontrast-progressbar-track-color,var(
|
|
62
80
|
--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)
|
|
63
81
|
)
|
|
64
|
-
);block-size:var(
|
|
82
|
+
);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(
|
|
65
83
|
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
66
|
-
)
|
|
67
|
-
--highcontrast-progressbar-fill-color,var(
|
|
68
|
-
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
69
|
-
)
|
|
70
|
-
)}:host([notice]) .fill{background:var(
|
|
71
|
-
--highcontrast-progressbar-fill-color,var(
|
|
72
|
-
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
73
|
-
)
|
|
74
|
-
)}:host([negative]) .fill{background:var(
|
|
75
|
-
--highcontrast-progressbar-fill-color,var(
|
|
76
|
-
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
77
|
-
)
|
|
78
|
-
)}.fill{background:var(
|
|
84
|
+
)}.fill{background-color:var(
|
|
79
85
|
--highcontrast-progressbar-fill-color,var(
|
|
80
86
|
--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)
|
|
81
87
|
)
|
|
82
|
-
);block-size:var(
|
|
83
|
-
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
84
88
|
);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(
|
|
85
89
|
--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)
|
|
86
90
|
);inline-size:var(
|
|
@@ -91,7 +95,7 @@ const styles = css`
|
|
|
91
95
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
92
96
|
)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(
|
|
93
97
|
--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
94
|
-
);order:3;text-align:end}:host([static=white]) .fill{background:var(
|
|
98
|
+
);order:3;text-align:end}:host([static=white]) .fill{background-color:var(
|
|
95
99
|
--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)
|
|
96
100
|
);color:var(
|
|
97
101
|
--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)
|
|
@@ -111,7 +115,7 @@ var(--spectrum-progressbar-fill-size-indeterminate)
|
|
|
111
115
|
))}to{transform:translate(calc(var(
|
|
112
116
|
--mod-progressbar-size-default,
|
|
113
117
|
var(--spectrum-progressbar-size-default)
|
|
114
|
-
)*-1))}}
|
|
118
|
+
)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}
|
|
115
119
|
`;
|
|
116
120
|
export default styles;
|
|
117
121
|
//# sourceMappingURL=spectrum-meter.css.dev.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-meter.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}
|
|
5
|
-
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}:host{--spectrum-progressbar-size-default:var(\n--mod-meter-inline-size,var(--spectrum-meter-inline-size)\n);--spectrum-progressbar-max-size:var(\n--mod-meter-max-width,var(--spectrum-meter-max-width)\n);--spectrum-progressbar-min-size:var(\n--mod-meter-min-width,var(--spectrum-meter-min-width)\n)}:host([variant=positive]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)\n)\n)}:host([variant=notice]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)\n)\n)}:host([variant=negative]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)\n)\n)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(\n--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)\n);inline-size:var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n);justify-content:space-between;max-inline-size:var(\n--mod-progressbar-max-size,var(--spectrum-progressbar-max-size)\n);min-inline-size:var(\n--mod-progressbar-min-size,var(--spectrum-progressbar-min-size)\n);position:relative;vertical-align:top}.label,.percentage{color:var(\n--mod-progressbar-text-color,var(--spectrum-progressbar-text-color)\n);line-height:var(\n--mod-progressbar-line-height,var(--spectrum-progressbar-line-height)\n);margin-block-end:var(\n--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar)\n);margin-block-start:var(\n--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text)\n);text-align:start}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(\n--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)\n)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}.track{background-color:var(\n--highcontrast-progressbar-track-color,var(\n--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)\n)\n);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(\n--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)\n)}.fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)\n)\n);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(\n--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)\n);inline-size:var(\n--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate)\n);position:relative;will-change:transform}:host([side-label]){display:inline-flex;flex-flow:row;justify-content:space-between}:host([side-label]) .track{flex:1 1 var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n)}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(\n--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n);order:3;text-align:end}:host([static=white]) .fill{background-color:var(\n--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)\n);color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .label,:host([static=white]) .percentage{color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .track{background-color:var(--spectrum-progressbar-track-color-white)}:host([dir=ltr][indeterminate]) .fill{animation:indeterminate-loop-ltr var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(\n--mod-progressbar-fill-size-indeterminate,\nvar(--spectrum-progressbar-fill-size-indeterminate)\n)*-1))}to{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)\n))}to{transform:translate(calc(var(\n--mod-progressbar-size-default,\nvar(--spectrum-progressbar-size-default)\n)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}\n`;\nexport default styles;"],
|
|
5
|
+
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqHf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
--spectrum-negative-visual-color
|
|
20
20
|
);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(
|
|
21
21
|
--spectrum-transparent-white-300
|
|
22
|
-
);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
22
|
+
);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(
|
|
23
23
|
--spectrum-progress-bar-thickness-small
|
|
24
24
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
25
25
|
--spectrum-component-top-to-text-75
|
|
@@ -35,7 +35,25 @@
|
|
|
35
35
|
--spectrum-progress-bar-thickness-extra-large
|
|
36
36
|
);--spectrum-progressbar-spacing-top-to-text:var(
|
|
37
37
|
--spectrum-component-top-to-text-300
|
|
38
|
-
)}
|
|
38
|
+
)}:host{--spectrum-progressbar-size-default:var(
|
|
39
|
+
--mod-meter-inline-size,var(--spectrum-meter-inline-size)
|
|
40
|
+
);--spectrum-progressbar-max-size:var(
|
|
41
|
+
--mod-meter-max-width,var(--spectrum-meter-max-width)
|
|
42
|
+
);--spectrum-progressbar-min-size:var(
|
|
43
|
+
--mod-meter-min-width,var(--spectrum-meter-min-width)
|
|
44
|
+
)}:host([variant=positive]) .fill{background-color:var(
|
|
45
|
+
--highcontrast-progressbar-fill-color,var(
|
|
46
|
+
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
47
|
+
)
|
|
48
|
+
)}:host([variant=notice]) .fill{background-color:var(
|
|
49
|
+
--highcontrast-progressbar-fill-color,var(
|
|
50
|
+
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
51
|
+
)
|
|
52
|
+
)}:host([variant=negative]) .fill{background-color:var(
|
|
53
|
+
--highcontrast-progressbar-fill-color,var(
|
|
54
|
+
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
55
|
+
)
|
|
56
|
+
)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(
|
|
39
57
|
--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)
|
|
40
58
|
);inline-size:var(
|
|
41
59
|
--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)
|
|
@@ -55,30 +73,16 @@
|
|
|
55
73
|
--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)
|
|
56
74
|
)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(
|
|
57
75
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
58
|
-
)}.track{background:var(
|
|
76
|
+
)}.track{background-color:var(
|
|
59
77
|
--highcontrast-progressbar-track-color,var(
|
|
60
78
|
--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)
|
|
61
79
|
)
|
|
62
|
-
);block-size:var(
|
|
80
|
+
);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(
|
|
63
81
|
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
64
|
-
)
|
|
65
|
-
--highcontrast-progressbar-fill-color,var(
|
|
66
|
-
--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)
|
|
67
|
-
)
|
|
68
|
-
)}:host([notice]) .fill{background:var(
|
|
69
|
-
--highcontrast-progressbar-fill-color,var(
|
|
70
|
-
--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)
|
|
71
|
-
)
|
|
72
|
-
)}:host([negative]) .fill{background:var(
|
|
73
|
-
--highcontrast-progressbar-fill-color,var(
|
|
74
|
-
--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)
|
|
75
|
-
)
|
|
76
|
-
)}.fill{background:var(
|
|
82
|
+
)}.fill{background-color:var(
|
|
77
83
|
--highcontrast-progressbar-fill-color,var(
|
|
78
84
|
--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)
|
|
79
85
|
)
|
|
80
|
-
);block-size:var(
|
|
81
|
-
--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)
|
|
82
86
|
);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(
|
|
83
87
|
--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)
|
|
84
88
|
);inline-size:var(
|
|
@@ -89,7 +93,7 @@
|
|
|
89
93
|
--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
90
94
|
)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(
|
|
91
95
|
--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)
|
|
92
|
-
);order:3;text-align:end}:host([static=white]) .fill{background:var(
|
|
96
|
+
);order:3;text-align:end}:host([static=white]) .fill{background-color:var(
|
|
93
97
|
--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)
|
|
94
98
|
);color:var(
|
|
95
99
|
--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)
|
|
@@ -109,6 +113,6 @@ var(--spectrum-progressbar-fill-size-indeterminate)
|
|
|
109
113
|
))}to{transform:translate(calc(var(
|
|
110
114
|
--mod-progressbar-size-default,
|
|
111
115
|
var(--spectrum-progressbar-size-default)
|
|
112
|
-
)*-1))}}
|
|
116
|
+
)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}
|
|
113
117
|
`;export default e;
|
|
114
118
|
//# sourceMappingURL=spectrum-meter.css.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-meter.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}
|
|
5
|
-
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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(\n--spectrum-animation-ease-in-out\n);--spectrum-progressbar-animation-duration-indeterminate:var(\n--spectrum-animation-duration-2000\n);--spectrum-progressbar-corner-radius:var(--spectrum-corner-radius-100);--spectrum-progressbar-fill-size-indeterminate:70%;--spectrum-progressbar-size-2400:192px;--spectrum-progressbar-size-2500:200px;--spectrum-progressbar-size-2800:224px;--spectrum-progressbar-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-progressbar-min-size:var(--spectrum-progress-bar-minimum-width);--spectrum-progressbar-max-size:var(--spectrum-progress-bar-maximum-width);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-medium\n);--spectrum-progressbar-line-height:var(--spectrum-line-height-100);--spectrum-progressbar-spacing-label-to-progressbar:var(\n--spectrum-spacing-75\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-100\n);--spectrum-progressbar-spacing-label-to-text:var(--spectrum-spacing-200);--spectrum-progressbar-text-color:var(\n--spectrum-neutral-content-color-default\n);--spectrum-progressbar-track-color:var(--spectrum-gray-300);--spectrum-progressbar-fill-color:var(--spectrum-accent-color-900);--spectrum-progressbar-fill-color-positive:var(\n--spectrum-positive-visual-color\n);--spectrum-progressbar-fill-color-notice:var(\n--spectrum-notice-visual-color\n);--spectrum-progressbar-fill-color-negative:var(\n--spectrum-negative-visual-color\n);--spectrum-progressbar-label-and-value-white:var(--spectrum-white);--spectrum-progressbar-track-color-white:var(\n--spectrum-transparent-white-300\n);--spectrum-progressbar-fill-color-white:var(--spectrum-white);--spectrum-meter-min-width:var(--spectrum-meter-minimum-width);--spectrum-meter-max-width:var(--spectrum-meter-maximum-width);--spectrum-meter-inline-size:var(--spectrum-meter-default-width);--spectrum-meter-thickness-s:var(--spectrum-meter-thickness-small);--spectrum-meter-thickness-l:var(--spectrum-meter-thickness-large);--spectrum-meter-top-to-text:var(--spectrum-component-top-to-text)}:host([size=s]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-small\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host{--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2400);--spectrum-progressbar-font-size:var(--spectrum-font-size-75);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n)}:host([size=l]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2500);--spectrum-progressbar-font-size:var(--spectrum-font-size-100);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n)}:host([size=xl]){--spectrum-progressbar-size-default:var(--spectrum-progressbar-size-2800);--spectrum-progressbar-font-size:var(--spectrum-font-size-200);--spectrum-progressbar-thickness:var(\n--spectrum-progress-bar-thickness-extra-large\n);--spectrum-progressbar-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n)}:host{--spectrum-progressbar-size-default:var(\n--mod-meter-inline-size,var(--spectrum-meter-inline-size)\n);--spectrum-progressbar-max-size:var(\n--mod-meter-max-width,var(--spectrum-meter-max-width)\n);--spectrum-progressbar-min-size:var(\n--mod-meter-min-width,var(--spectrum-meter-min-width)\n)}:host([variant=positive]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-positive,var(--spectrum-progressbar-fill-color-positive)\n)\n)}:host([variant=notice]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-notice,var(--spectrum-progressbar-fill-color-notice)\n)\n)}:host([variant=negative]) .fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color-negative,var(--spectrum-progressbar-fill-color-negative)\n)\n)}:host{align-items:center;display:inline-flex;flex-flow:wrap;font-size:var(\n--mod-progressbar-font-size,var(--spectrum-progressbar-font-size)\n);inline-size:var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n);justify-content:space-between;max-inline-size:var(\n--mod-progressbar-max-size,var(--spectrum-progressbar-max-size)\n);min-inline-size:var(\n--mod-progressbar-min-size,var(--spectrum-progressbar-min-size)\n);position:relative;vertical-align:top}.label,.percentage{color:var(\n--mod-progressbar-text-color,var(--spectrum-progressbar-text-color)\n);line-height:var(\n--mod-progressbar-line-height,var(--spectrum-progressbar-line-height)\n);margin-block-end:var(\n--mod-progressbar-spacing-label-to-progressbar,var(--spectrum-progressbar-spacing-label-to-progressbar)\n);margin-block-start:var(\n--mod-progressbar-spacing-top-to-text,var(--spectrum-progressbar-spacing-top-to-text)\n);text-align:start}.label:lang(ja),.label:lang(ko),.label:lang(zh),.percentage:lang(ja),.percentage:lang(ko),.percentage:lang(zh){line-height:var(\n--mod-progressbar-line-height-cjk,var(--spectrum-progressbar-line-height-cjk)\n)}.label{flex:1}.percentage{align-self:flex-start;margin-inline-start:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}.track{background-color:var(\n--highcontrast-progressbar-track-color,var(\n--mod-progressbar-track-color,var(--spectrum-progressbar-track-color)\n)\n);border-radius:var(--spectrum-progressbar-corner-radius);inline-size:100%;overflow:hidden}.fill,.track{block-size:var(\n--mod-progressbar-thickness,var(--spectrum-progressbar-thickness)\n)}.fill{background-color:var(\n--highcontrast-progressbar-fill-color,var(\n--mod-progressbar-fill-color,var(--spectrum-progressbar-fill-color)\n)\n);border:none;transition:width 1s}:host([indeterminate]) .fill{animation-timing-function:var(\n--mod-progressbar-animation-ease-in-out-indeterminate,var(--spectrum-progressbar-animation-ease-in-out-indeterminate)\n);inline-size:var(\n--mod-progressbar-fill-size-indeterminate,var(--spectrum-progressbar-fill-size-indeterminate)\n);position:relative;will-change:transform}:host([side-label]){display:inline-flex;flex-flow:row;justify-content:space-between}:host([side-label]) .track{flex:1 1 var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n)}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(\n--mod-progressbar-spacing-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n)}:host([side-label]) .percentage{margin-block-end:0;margin-inline-start:var(\n--mod-spacing-progressbar-label-to-text,var(--spectrum-progressbar-spacing-label-to-text)\n);order:3;text-align:end}:host([static=white]) .fill{background-color:var(\n--mod-progressbar-fill-color-white,var(--spectrum-progressbar-fill-color-white)\n);color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .label,:host([static=white]) .percentage{color:var(\n--mod-progressbar-label-and-value-white,var(--spectrum-progressbar-label-and-value-white)\n)}:host([static=white]) .track{background-color:var(--spectrum-progressbar-track-color-white)}:host([dir=ltr][indeterminate]) .fill{animation:indeterminate-loop-ltr var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}:host([dir=rtl][indeterminate]) .fill{animation:indeterminate-loop-rtl var(\n--mod-progressbar-animation-duration-indeterminate,var(--spectrum-progressbar-animation-duration-indeterminate)\n) infinite}@keyframes indeterminate-loop-ltr{0%{transform:translate(calc(var(\n--mod-progressbar-fill-size-indeterminate,\nvar(--spectrum-progressbar-fill-size-indeterminate)\n)*-1))}to{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-size-default)\n))}}@keyframes indeterminate-loop-rtl{0%{transform:translate(var(\n--mod-progressbar-size-default,var(--spectrum-progressbar-fill-size-indeterminate)\n))}to{transform:translate(calc(var(\n--mod-progressbar-size-default,\nvar(--spectrum-progressbar-size-default)\n)*-1))}}@media (forced-colors:active){.track{--highcontrast-progressbar-fill-color:ButtonText;--highcontrast-progressbar-track-color:ButtonFace;border:1px solid ButtonText;forced-color-adjust:none}}\n`;\nexport default styles;"],
|
|
5
|
+
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqHf,eAAeC",
|
|
6
6
|
"names": ["css", "styles"]
|
|
7
7
|
}
|
package/stories/meter.stories.js
CHANGED
|
@@ -19,17 +19,17 @@ export const sideLabel = () => {
|
|
|
19
19
|
};
|
|
20
20
|
export const negative = () => {
|
|
21
21
|
return html`
|
|
22
|
-
<sp-meter negative progress="95">Storage Space</sp-meter>
|
|
22
|
+
<sp-meter variant="negative" progress="95">Storage Space</sp-meter>
|
|
23
23
|
`;
|
|
24
24
|
};
|
|
25
25
|
export const notice = () => {
|
|
26
26
|
return html`
|
|
27
|
-
<sp-meter notice progress="73">Storage Space</sp-meter>
|
|
27
|
+
<sp-meter variant="notice" progress="73">Storage Space</sp-meter>
|
|
28
28
|
`;
|
|
29
29
|
};
|
|
30
30
|
export const positive = () => {
|
|
31
31
|
return html`
|
|
32
|
-
<sp-meter positive progress="50">Storage Space</sp-meter>
|
|
32
|
+
<sp-meter variant="positive" progress="50">Storage Space</sp-meter>
|
|
33
33
|
`;
|
|
34
34
|
};
|
|
35
35
|
export const staticWhite = () => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["meter.stories.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/meter/sp-meter.js';\n\nexport default {\n title: 'Meter',\n component: 'sp-meter',\n};\n\nconst makeOverBackground = (story: TemplateResult): TemplateResult => html`\n <div\n style=\"background-color: var(--spectrum-global-color-seafoam-600); color: var(--spectrum-global-color-seafoam-600); padding: var(--spectrum-global-dimension-size-175) var(--spectrum-global-dimension-size-250); display: inline-block\"\n >\n ${story}\n </div>\n`;\n\nexport const sideLabel = (): TemplateResult => {\n return html`\n <sp-meter side-label progress=\"50\">Storage Space</sp-meter>\n `;\n};\n\nexport const negative = (): TemplateResult => {\n return html`\n <sp-meter negative progress=\"95\">Storage Space</sp-meter>\n `;\n};\n\nexport const notice = (): TemplateResult => {\n return html`\n <sp-meter notice progress=\"73\">Storage Space</sp-meter>\n `;\n};\n\nexport const positive = (): TemplateResult => {\n return html`\n <sp-meter positive progress=\"50\">Storage Space</sp-meter>\n `;\n};\n\nexport const staticWhite = (): TemplateResult => {\n return makeOverBackground(\n html`\n <sp-meter static=\"white\" progress=\"50\">Storage Space</sp-meter>\n `\n );\n};\n"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/meter/sp-meter.js';\n\nexport default {\n title: 'Meter',\n component: 'sp-meter',\n};\n\nconst makeOverBackground = (story: TemplateResult): TemplateResult => html`\n <div\n style=\"background-color: var(--spectrum-global-color-seafoam-600); color: var(--spectrum-global-color-seafoam-600); padding: var(--spectrum-global-dimension-size-175) var(--spectrum-global-dimension-size-250); display: inline-block\"\n >\n ${story}\n </div>\n`;\n\nexport const sideLabel = (): TemplateResult => {\n return html`\n <sp-meter side-label progress=\"50\">Storage Space</sp-meter>\n `;\n};\n\nexport const negative = (): TemplateResult => {\n return html`\n <sp-meter variant=\"negative\" progress=\"95\">Storage Space</sp-meter>\n `;\n};\n\nexport const notice = (): TemplateResult => {\n return html`\n <sp-meter variant=\"notice\" progress=\"73\">Storage Space</sp-meter>\n `;\n};\n\nexport const positive = (): TemplateResult => {\n return html`\n <sp-meter variant=\"positive\" progress=\"50\">Storage Space</sp-meter>\n `;\n};\n\nexport const staticWhite = (): TemplateResult => {\n return makeOverBackground(\n html`\n <sp-meter static=\"white\" progress=\"50\">Storage Space</sp-meter>\n `\n );\n};\n"],
|
|
5
5
|
"mappings": ";AAYA,SAAS,YAA4B;AAErC,OAAO;AAEP,eAAe;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AACf;AAEA,MAAM,qBAAqB,CAAC,UAA0C;AAAA;AAAA;AAAA;AAAA,UAI5D,KAAK;AAAA;AAAA;AAIR,aAAM,YAAY,MAAsB;AAC3C,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,WAAW,MAAsB;AAC1C,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,SAAS,MAAsB;AACxC,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,WAAW,MAAsB;AAC1C,SAAO;AAAA;AAAA;AAGX;AAEO,aAAM,cAAc,MAAsB;AAC7C,SAAO;AAAA,IACH;AAAA;AAAA;AAAA,EAGJ;AACJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/test/meter.test.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
import { elementUpdated, expect, fixture, html } from "@open-wc/testing";
|
|
3
3
|
import "@spectrum-web-components/meter/sp-meter.js";
|
|
4
|
+
import { meterVariants } from "@spectrum-web-components/meter";
|
|
4
5
|
import { testForLitDevWarnings } from "../../../test/testing-helpers.js";
|
|
5
6
|
import { createLanguageContext } from "../../../tools/reactive-controllers/test/helpers.js";
|
|
6
7
|
describe("Meter", () => {
|
|
@@ -21,6 +22,19 @@ describe("Meter", () => {
|
|
|
21
22
|
expect(el).to.not.be.undefined;
|
|
22
23
|
await expect(el).to.be.accessible();
|
|
23
24
|
});
|
|
25
|
+
meterVariants.map((variant) => {
|
|
26
|
+
it(`loads - [variant="${variant}"]`, async () => {
|
|
27
|
+
const el = await fixture(
|
|
28
|
+
html`
|
|
29
|
+
<sp-meter variant=${variant}>
|
|
30
|
+
This meter is of the \`${variant}\` variant.
|
|
31
|
+
</sp-meter>
|
|
32
|
+
`
|
|
33
|
+
);
|
|
34
|
+
await elementUpdated(el);
|
|
35
|
+
await expect(el).to.be.accessible();
|
|
36
|
+
});
|
|
37
|
+
});
|
|
24
38
|
it("accepts a changing process w/ [label]", async () => {
|
|
25
39
|
const el = await fixture(html`
|
|
26
40
|
<sp-meter label="Changing Value"></sp-meter>
|
|
@@ -88,5 +102,22 @@ describe("Meter", () => {
|
|
|
88
102
|
);
|
|
89
103
|
expect((_a = percentage.textContent) == null ? void 0 : _a.search("\u066A")).to.not.equal(-1);
|
|
90
104
|
});
|
|
105
|
+
it("validates variants", async () => {
|
|
106
|
+
const el = await fixture(
|
|
107
|
+
html`
|
|
108
|
+
<sp-meter variant="invalid">
|
|
109
|
+
This meter validates variants.
|
|
110
|
+
</sp-meter>
|
|
111
|
+
`
|
|
112
|
+
);
|
|
113
|
+
await elementUpdated(el);
|
|
114
|
+
expect(el.variant).to.equal("");
|
|
115
|
+
el.variant = meterVariants[0];
|
|
116
|
+
await elementUpdated(el);
|
|
117
|
+
expect(el.variant).to.equal(meterVariants[0]);
|
|
118
|
+
el.variant = meterVariants[0];
|
|
119
|
+
await elementUpdated(el);
|
|
120
|
+
expect(el.variant).to.equal(meterVariants[0]);
|
|
121
|
+
});
|
|
91
122
|
});
|
|
92
123
|
//# sourceMappingURL=meter.test.js.map
|
package/test/meter.test.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["meter.test.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\n\nimport '@spectrum-web-components/meter/sp-meter.js';\nimport { Meter } from '@spectrum-web-components/meter';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { createLanguageContext } from '../../../tools/reactive-controllers/test/helpers.js';\n\ndescribe('Meter', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<Meter>(\n html`\n <sp-meter label=\"Loading\"></sp-meter>\n `\n )\n );\n it('loads default meter accessibly', async () => {\n const el = await fixture<Meter>(\n html`\n <sp-meter label=\"Loading\"></sp-meter>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n\n it('accepts a changing process w/ [label]', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter label=\"Changing Value\"></sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n\n it('accepts label from `slot`', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter>Label From Slot</sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('Label From Slot');\n });\n it('accepts a changing process', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter>Changing Value</sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n\n it('resolves a language (en-US)', async () => {\n const [languageContext] = createLanguageContext('en-US');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-meter label=\"Changing Value\" progress=\"45\"></sp-meter>\n </div>\n `);\n const el = test.querySelector('sp-meter') as Meter;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('%')).to.not.equal(-1);\n });\n\n it('resolves a language (ar-sa)', async () => {\n const [languageContext] = createLanguageContext('ar-sa');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-meter label=\"Changing Value\" progress=\"45\"></sp-meter>\n </div>\n `);\n const el = test.querySelector('sp-meter') as Meter;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('\u066A')).to.not.equal(-1);\n });\n});\n"],
|
|
5
|
-
"mappings": ";AAYA,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AAEtD,OAAO;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\n\nimport '@spectrum-web-components/meter/sp-meter.js';\nimport { Meter, meterVariants } from '@spectrum-web-components/meter';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { createLanguageContext } from '../../../tools/reactive-controllers/test/helpers.js';\n\ndescribe('Meter', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<Meter>(\n html`\n <sp-meter label=\"Loading\"></sp-meter>\n `\n )\n );\n it('loads default meter accessibly', async () => {\n const el = await fixture<Meter>(\n html`\n <sp-meter label=\"Loading\"></sp-meter>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n\n await expect(el).to.be.accessible();\n });\n meterVariants.map((variant) => {\n it(`loads - [variant=\"${variant}\"]`, async () => {\n const el = await fixture<Meter>(\n html`\n <sp-meter variant=${variant}>\n This meter is of the \\`${variant}\\` variant.\n </sp-meter>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n });\n it('accepts a changing process w/ [label]', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter label=\"Changing Value\"></sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n\n it('accepts label from `slot`', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter>Label From Slot</sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.getAttribute('label')).to.equal('Label From Slot');\n });\n it('accepts a changing process', async () => {\n const el = await fixture<Meter>(html`\n <sp-meter>Changing Value</sp-meter>\n `);\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('0');\n\n el.progress = 50;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('50');\n\n el.progress = 100;\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-valuenow')).to.be.true;\n expect(el.getAttribute('aria-valuenow')).to.equal('100');\n });\n\n it('resolves a language (en-US)', async () => {\n const [languageContext] = createLanguageContext('en-US');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-meter label=\"Changing Value\" progress=\"45\"></sp-meter>\n </div>\n `);\n const el = test.querySelector('sp-meter') as Meter;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('%')).to.not.equal(-1);\n });\n\n it('resolves a language (ar-sa)', async () => {\n const [languageContext] = createLanguageContext('ar-sa');\n const test = await fixture(html`\n <div @sp-language-context=${languageContext}>\n <sp-meter label=\"Changing Value\" progress=\"45\"></sp-meter>\n </div>\n `);\n const el = test.querySelector('sp-meter') as Meter;\n const percentage = el.shadowRoot.querySelector(\n '.percentage'\n ) as HTMLElement;\n expect(percentage.textContent?.search('\u066A')).to.not.equal(-1);\n });\n\n it('validates variants', async () => {\n const el = await fixture<Meter>(\n html`\n <sp-meter variant=\"invalid\">\n This meter validates variants.\n </sp-meter>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('');\n\n el.variant = meterVariants[0];\n\n await elementUpdated(el);\n expect(el.variant).to.equal(meterVariants[0]);\n\n el.variant = meterVariants[0];\n\n await elementUpdated(el);\n expect(el.variant).to.equal(meterVariants[0]);\n });\n});\n"],
|
|
5
|
+
"mappings": ";AAYA,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AAEtD,OAAO;AACP,SAAgB,qBAAqB;AACrC,SAAS,6BAA6B;AACtC,SAAS,6BAA6B;AAEtC,SAAS,SAAS,MAAM;AACpB;AAAA,IACI,YACI,MAAM;AAAA,MACF;AAAA;AAAA;AAAA,IAGJ;AAAA,EACR;AACA,KAAG,kCAAkC,YAAY;AAC7C,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AACvB,WAAO,EAAE,EAAE,GAAG,IAAI,GAAG;AAErB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,EACtC,CAAC;AACD,gBAAc,IAAI,CAAC,YAAY;AAC3B,OAAG,qBAAqB,OAAO,MAAM,YAAY;AAC7C,YAAM,KAAK,MAAM;AAAA,QACb;AAAA,wCACwB,OAAO;AAAA,iDACE,OAAO;AAAA;AAAA;AAAA,MAG5C;AAEA,YAAM,eAAe,EAAE;AAEvB,YAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,IACtC,CAAC;AAAA,EACL,CAAC;AACD,KAAG,yCAAyC,YAAY;AACpD,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA,SAE/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,GAAG;AAErD,OAAG,WAAW;AAEd,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,IAAI;AAEtD,OAAG,WAAW;AAEd,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,KAAK;AAAA,EAC3D,CAAC;AAED,KAAG,6BAA6B,YAAY;AACxC,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA,SAE/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,OAAO,CAAC,EAAE,GAAG,MAAM,iBAAiB;AAAA,EAC/D,CAAC;AACD,KAAG,8BAA8B,YAAY;AACzC,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA,SAE/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,GAAG;AAErD,OAAG,WAAW;AAEd,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,IAAI;AAEtD,OAAG,WAAW;AAEd,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,GAAG;AAC/C,WAAO,GAAG,aAAa,eAAe,CAAC,EAAE,GAAG,MAAM,KAAK;AAAA,EAC3D,CAAC;AAED,KAAG,+BAA+B,YAAY;AAlHlD;AAmHQ,UAAM,CAAC,eAAe,IAAI,sBAAsB,OAAO;AACvD,UAAM,OAAO,MAAM,QAAQ;AAAA,wCACK,eAAe;AAAA;AAAA;AAAA,SAG9C;AACD,UAAM,KAAK,KAAK,cAAc,UAAU;AACxC,UAAM,aAAa,GAAG,WAAW;AAAA,MAC7B;AAAA,IACJ;AACA,YAAO,gBAAW,gBAAX,mBAAwB,OAAO,IAAI,EAAE,GAAG,IAAI,MAAM,EAAE;AAAA,EAC/D,CAAC;AAED,KAAG,+BAA+B,YAAY;AAhIlD;AAiIQ,UAAM,CAAC,eAAe,IAAI,sBAAsB,OAAO;AACvD,UAAM,OAAO,MAAM,QAAQ;AAAA,wCACK,eAAe;AAAA;AAAA;AAAA,SAG9C;AACD,UAAM,KAAK,KAAK,cAAc,UAAU;AACxC,UAAM,aAAa,GAAG,WAAW;AAAA,MAC7B;AAAA,IACJ;AACA,YAAO,gBAAW,gBAAX,mBAAwB,OAAO,SAAI,EAAE,GAAG,IAAI,MAAM,EAAE;AAAA,EAC/D,CAAC;AAED,KAAG,sBAAsB,YAAY;AACjC,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA;AAAA;AAAA,IAKJ;AAEA,UAAM,eAAe,EAAE;AACvB,WAAO,GAAG,OAAO,EAAE,GAAG,MAAM,EAAE;AAE9B,OAAG,UAAU,cAAc,CAAC;AAE5B,UAAM,eAAe,EAAE;AACvB,WAAO,GAAG,OAAO,EAAE,GAAG,MAAM,cAAc,CAAC,CAAC;AAE5C,OAAG,UAAU,cAAc,CAAC;AAE5B,UAAM,eAAe,EAAE;AACvB,WAAO,GAAG,OAAO,EAAE,GAAG,MAAM,cAAc,CAAC,CAAC;AAAA,EAChD,CAAC;AACL,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|