@sandlada/vue-mdc
Version:
62 lines (61 loc) • 1.9 kB
JavaScript
/**
* @license
* Copyright 2025 Sandlada & Kai Orion
* SPDX-License-Identifier: MIT
*/
import { defineComponent, createVNode } from "vue";
import { componentNamePrefix } from "../../internals/component-name-prefix/component-name-prefix.js";
import { props } from "./linear-progress.definition.js";
import css from "./styles/progress.module.scss.js";
const LinearProgress = /* @__PURE__ */ defineComponent({
name: `${componentNamePrefix}-linear-progress`,
props,
slots: {},
computed: {
progressStyles() {
return {
transform: `scaleX(${(this.indeterminate ? 1 : this.value / this.max) * 100}%)`
};
},
dotStyles() {
return {
transform: `scaleX(${(this.indeterminate ? 1 : this.buffer / this.max) * 100}%)`
};
},
shouldHideDots() {
return this.indeterminate || this.buffer >= this.max || this.value >= this.max;
}
},
render() {
return createVNode("div", {
"data-component": "linear-progress",
"class": [css["linear-progress"], this.indeterminate && css.indeterminate],
"role": "progressbar",
"aria-valuemin": "0",
"aria-valuemax": this.max,
"aria-valuenow": this.indeterminate ? 0 : this.value
}, [createVNode("div", {
"style": {
display: this.shouldHideDots ? "block" : "none"
},
"class": css.dots
}, null), createVNode("div", {
"class": css["inactive-track"],
"style": this.dotStyles
}, null), createVNode("div", {
"class": [css.bar, css["primary-bar"]],
"style": this.progressStyles
}, [createVNode("div", {
"class": css["bar-inner"]
}, null)]), createVNode("div", {
"class": [css.bar, css["secondary-bar"]]
}, [createVNode("div", {
"class": css["bar-inner"]
}, null)])]);
},
inheritAttrs: true
});
export {
LinearProgress
};
//# sourceMappingURL=linear-progress.js.map