var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { MelodicComponent } from '@melodicdev/core';
import { progressTemplate } from './progress.template.js';
import { progressStyles } from './progress.styles.js';
/**
 * ml-progress - Progress indicator with linear, circle, and half-circle shapes
 *
 * @example
 * ```html
 * <ml-progress value="60"></ml-progress>
 * <ml-progress value="80" label="Upload" show-value label-position="right"></ml-progress>
 * <ml-progress value="40" shape="circle" show-value></ml-progress>
 * <ml-progress value="60" shape="half-circle" show-value></ml-progress>
 * ```
 */
let ProgressComponent = class ProgressComponent {
    constructor() {
        /** Current value (0-max) */
        this.value = 0;
        /** Maximum value */
        this.max = 100;
        /** Color variant */
        this.variant = 'primary';
        /** Bar height / circle size */
        this.size = 'md';
        /** Optional label */
        this.label = '';
        /** Show percentage text */
        this.showValue = false;
        /** Shape: linear bar, full circle, or half circle */
        this.shape = 'linear';
        /** Label position for linear bars */
        this.labelPosition = 'top';
    }
    get percentage() {
        const max = Math.max(this.max, 1);
        return Math.min(Math.max((this.value / max) * 100, 0), 100);
    }
    get displayValue() {
        return `${Math.round(this.percentage)}%`;
    }
    /** SVG circle radius based on size */
    get circleRadius() {
        if (this.size === 'sm')
            return 28;
        if (this.size === 'lg')
            return 52;
        return 40;
    }
    /** SVG stroke width based on size */
    get circleStroke() {
        if (this.size === 'sm')
            return 4;
        if (this.size === 'lg')
            return 8;
        return 6;
    }
    /** Full circumference for stroke-dasharray */
    get circumference() {
        return 2 * Math.PI * this.circleRadius;
    }
    /** Half circumference for half-circle */
    get halfCircumference() {
        return Math.PI * this.circleRadius;
    }
    /** Dash offset for full circle */
    get circleDashOffset() {
        return this.circumference - (this.percentage / 100) * this.circumference;
    }
    /** Dash offset for half circle */
    get halfCircleDashOffset() {
        return this.halfCircumference - (this.percentage / 100) * this.halfCircumference;
    }
    /** SVG viewBox size */
    get svgSize() {
        return (this.circleRadius + this.circleStroke) * 2;
    }
    /** SVG center point */
    get svgCenter() {
        return this.circleRadius + this.circleStroke;
    }
};
ProgressComponent = __decorate([
    MelodicComponent({
        selector: 'ml-progress',
        template: progressTemplate,
        styles: progressStyles,
        attributes: ['value', 'max', 'variant', 'size', 'label', 'show-value', 'shape', 'label-position']
    })
], ProgressComponent);
export { ProgressComponent };
