'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../utils/index.cjs');
var utils = require('./utils.cjs');
var props = require('./props.cjs');
var log = require('../../../utils/log.cjs');

var Line = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "ProgressLine",
  inheritAttrs: false,
  props: props.progressLineProps(),
  setup(props, {
    slots,
    attrs
  }) {
    const backgroundProps = vue.computed(() => {
      const {
        strokeColor,
        direction
      } = props;
      return strokeColor && typeof strokeColor !== "string" ? utils.handleGradient(strokeColor, direction) : {
        backgroundColor: strokeColor
      };
    });
    const borderRadius = vue.computed(() => props.strokeLinecap === "square" || props.strokeLinecap === "butt" ? 0 : void 0);
    const trailStyle = vue.computed(() => props.trailColor ? {
      backgroundColor: props.trailColor
    } : void 0);
    const mergedSize = vue.computed(() => {
      var _a;
      return (_a = props.size) != null ? _a : [-1, props.strokeWidth || (props.size === "small" ? 6 : 8)];
    });
    const sizeRef = vue.computed(() => utils.getSize(mergedSize.value, "line", {
      strokeWidth: props.strokeWidth
    }));
    if (process.env.NODE_ENV !== "production") {
      log.devWarning("strokeWidth" in props, "Progress", "`strokeWidth` is deprecated. Please use `size` instead.");
    }
    const percentStyle = vue.computed(() => {
      const {
        percent
      } = props;
      return {
        width: `${utils.validProgress(percent)}%`,
        height: `${sizeRef.value.height}px`,
        borderRadius: borderRadius.value,
        ...backgroundProps.value
      };
    });
    const successPercent = vue.computed(() => {
      return utils.getSuccessPercent(props);
    });
    const successPercentStyle = vue.computed(() => {
      const {
        success
      } = props;
      return {
        width: `${utils.validProgress(successPercent.value)}%`,
        height: `${sizeRef.value.height}px`,
        borderRadius: borderRadius.value,
        backgroundColor: success == null ? void 0 : success.strokeColor
      };
    });
    const outerStyle = {
      width: sizeRef.value.width < 0 ? "100%" : sizeRef.value.width,
      height: `${sizeRef.value.height}px`
    };
    return () => {
      var _a;
      return vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
        ...attrs,
        "class": [`${props.prefixCls}-outer`, attrs.class],
        "style": [attrs.style, outerStyle]
      }, [vue.createVNode("div", {
        "class": `${props.prefixCls}-inner`,
        "style": trailStyle.value
      }, [vue.createVNode("div", {
        "class": `${props.prefixCls}-bg`,
        "style": percentStyle.value
      }, null), successPercent.value !== void 0 ? vue.createVNode("div", {
        "class": `${props.prefixCls}-success-bg`,
        "style": successPercentStyle.value
      }, null) : null])]), (_a = slots.default) == null ? void 0 : _a.call(slots)]);
    };
  }
});

exports.default = Line;
//# sourceMappingURL=Line.cjs.map
