import { computed, createVNode } from "vue";
import "./styles/progress-linear.scss";
import { defineComponent } from "../../utils/define-component.mjs";
import { convertToUnit, propsFactory, pick } from "../../utils/dist/index.mjs";
const makeProgressLinearProps = propsFactory({
  active: {
    type: Boolean,
    default: true
  },
  modelValue: {
    type: [Number, String],
    default: 0
  },
  strokeWidth: {
    type: [Number, String],
    default: 2
  },
  indeterminate: Boolean,
  underlay: {
    type: Boolean,
    default: true
  }
}, "progress-linear");
const ProgressLinear = defineComponent({
  name: "VeProgressLinear",
  props: makeProgressLinearProps(),
  setup(props) {
    const model = computed(() => Math.max(0, Math.min(100, parseFloat(props.modelValue))));
    const height = computed(() => Number(props.strokeWidth));
    return () => createVNode("div", {
      "class": ["ve-progress-linear", {
        "ve-progress-linear--active": props.active,
        "ve-progress-linear--indeterminate": props.indeterminate
      }],
      "style": {
        height: props.active ? convertToUnit(height.value) : 0
      }
    }, [props.underlay && createVNode("div", {
      "class": "ve-progress-linear__underlay"
    }, null), createVNode("div", {
      "class": "ve-progress-linear__overlay",
      "style": {
        width: convertToUnit(model.value, "%")
      }
    }, null)]);
  }
});
function filterProgressLinearProps(attrs) {
  return pick(attrs, Object.keys(ProgressLinear.props));
}
export {
  ProgressLinear,
  filterProgressLinearProps,
  makeProgressLinearProps
};
//# sourceMappingURL=progress-linear.mjs.map
