import * as i0 from '@angular/core';
import { TemplateRef, Component, Input, ContentChild, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';

class ProgressComponent {
    constructor() {
        this.percentage = 0;
        this.strokeWidth = 14; // 进度条的线条宽度
        this.type = 'line';
        this.showContent = true;
    }
    /**
     * @deprecated
     * 统一用strokeWidth
     */
    set height(value) {
        this.strokeWidth = parseInt(value, 10);
    }
    ;
    /**
     * @deprecated
     * 用type类型替换
     */
    set isCircle(value) {
        this.type = value ? 'circle' : 'line';
    }
    ;
    ngOnInit() {
        if (this.type === 'circle') {
            this.setCircleProgress();
        }
    }
    ngOnChanges(changes) {
        if (this.type === 'circle') {
            this.setCircleProgress();
        }
    }
    setCircleProgress() {
        if (this.type !== 'circle') {
            return;
        }
        const radius = 50 - this.strokeWidth / 2;
        const beginPositionY = -radius;
        const endPositionY = radius * -2;
        this.pathString = `M 50,50 m 0,${beginPositionY}
     a ${radius},${radius} 0 1 1 0,${-endPositionY}
     a ${radius},${radius} 0 1 1 0,${endPositionY}`;
        const len = Math.PI * 2 * radius;
        this.trailPath = {
            strokeDasharray: `${len}px ${len}px`,
            strokeDashoffset: `0`,
            transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s'
        };
        this.strokePath = {
            stroke: this.strokeColor || this.barbgcolor || null,
            strokeDasharray: `${(this.percentage / 100) * len}px ${len}px`,
            strokeDashoffset: `0`,
            transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s'
        };
    }
}
ProgressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
ProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: ProgressComponent, selector: "d-progress", inputs: { percentage: "percentage", percentageText: "percentageText", barbgcolor: "barbgcolor", strokeColor: "strokeColor", height: "height", strokeWidth: "strokeWidth", isCircle: "isCircle", type: "type", showContent: "showContent" }, queries: [{ propertyName: "customViewTemplate", first: true, predicate: TemplateRef, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"type !== 'circle'\" class=\"devui-progress\" [ngStyle]=\"{ height: strokeWidth + 'px' }\">\n  <div\n    class=\"devui-progress-bar\"\n    role=\"progressbar\"\n    aria-valuenow=\"60\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [style.background-color]=\"strokeColor || barbgcolor\"\n    [style.width]=\"percentage + '%'\"\n  ></div>\n  <span [style.line-height]=\"strokeWidth + 'px'\">{{ percentageText }}</span>\n</div>\n<div *ngIf=\"type === 'circle'\" class=\"devui-progress-circle\">\n  <svg class=\"devui-progress-circle\" viewBox=\"0 0 100 100\">\n    <path\n      class=\"devui-progress-circle-trail\"\n      fill-opacity=\"0\"\n      [attr.stroke-width]=\"strokeWidth\"\n      [ngStyle]=\"trailPath\"\n      [attr.d]=\"pathString\"\n    ></path>\n    <path\n      class=\"devui-progress-circle-path\"\n      [attr.d]=\"pathString\"\n      [attr.stroke-linecap]=\"'round'\"\n      fill-opacity=\"0\"\n      [attr.stroke]=\"strokeColor || barbgcolor\"\n      [attr.stroke-width]=\"percentage ? strokeWidth : 0\"\n      [ngStyle]=\"strokePath\"\n    ></path>\n  </svg>\n  <ng-container *ngIf=\"showContent\">\n    <ng-template\n      *ngIf=\"customViewTemplate\"\n      [ngTemplateOutlet]=\"customViewTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: this, percentage: percentage }\"\n    ></ng-template>\n    <span *ngIf=\"!customViewTemplate\" class=\"devui-progress-circle-text\">{{ percentage }}%</span>\n  </ng-container>\n</div>\n", styles: [".devui-font-size-base{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:12px;font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5}.devui-font-size-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px);font-weight:700;line-height:1.5}.devui-font-size-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px);font-weight:700;line-height:1.5}.devui-font-size-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;line-height:1.5}:host{display:block}.devui-progress{position:relative;background:#f2f2f3;background:var(--devui-dividing-line, #f2f2f3);border-radius:100px;border-radius:var(--devui-border-radius-full, 100px)}.devui-progress .devui-progress-bar{width:0;height:100%;transition:width .6s ease;background-color:#5e7ce0;background-color:var(--devui-brand, #5e7ce0);border-radius:100px;border-radius:var(--devui-border-radius-full, 100px)}.devui-progress>span{display:block;white-space:nowrap;color:#fff;color:var(--devui-light-text, #ffffff);text-align:center;position:absolute;left:0;top:0;height:100%;width:100%;font-size:12px;font-size:var(--devui-font-size, 12px);line-height:1.5}.devui-progress-circle{position:relative}.devui-progress-circle-text{position:absolute;top:50%;left:50%;width:100%;margin:0;padding:0;color:#252b3a;color:var(--devui-text, #252b3a);line-height:1;white-space:normal;text-align:center;transform:translate(-50%,-50%)}.devui-progress-circle-trail{stroke:#f2f2f3;stroke:var(--devui-dividing-line, #f2f2f3)}.devui-progress-circle-path{stroke:#5e7ce0;stroke:var(--devui-brand, #5e7ce0)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ProgressComponent, decorators: [{
            type: Component,
            args: [{ selector: 'd-progress', preserveWhitespaces: false, template: "<div *ngIf=\"type !== 'circle'\" class=\"devui-progress\" [ngStyle]=\"{ height: strokeWidth + 'px' }\">\n  <div\n    class=\"devui-progress-bar\"\n    role=\"progressbar\"\n    aria-valuenow=\"60\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [style.background-color]=\"strokeColor || barbgcolor\"\n    [style.width]=\"percentage + '%'\"\n  ></div>\n  <span [style.line-height]=\"strokeWidth + 'px'\">{{ percentageText }}</span>\n</div>\n<div *ngIf=\"type === 'circle'\" class=\"devui-progress-circle\">\n  <svg class=\"devui-progress-circle\" viewBox=\"0 0 100 100\">\n    <path\n      class=\"devui-progress-circle-trail\"\n      fill-opacity=\"0\"\n      [attr.stroke-width]=\"strokeWidth\"\n      [ngStyle]=\"trailPath\"\n      [attr.d]=\"pathString\"\n    ></path>\n    <path\n      class=\"devui-progress-circle-path\"\n      [attr.d]=\"pathString\"\n      [attr.stroke-linecap]=\"'round'\"\n      fill-opacity=\"0\"\n      [attr.stroke]=\"strokeColor || barbgcolor\"\n      [attr.stroke-width]=\"percentage ? strokeWidth : 0\"\n      [ngStyle]=\"strokePath\"\n    ></path>\n  </svg>\n  <ng-container *ngIf=\"showContent\">\n    <ng-template\n      *ngIf=\"customViewTemplate\"\n      [ngTemplateOutlet]=\"customViewTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: this, percentage: percentage }\"\n    ></ng-template>\n    <span *ngIf=\"!customViewTemplate\" class=\"devui-progress-circle-text\">{{ percentage }}%</span>\n  </ng-container>\n</div>\n", styles: [".devui-font-size-base{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:12px;font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5}.devui-font-size-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px);font-weight:700;line-height:1.5}.devui-font-size-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px);font-weight:700;line-height:1.5}.devui-font-size-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;line-height:1.5}:host{display:block}.devui-progress{position:relative;background:#f2f2f3;background:var(--devui-dividing-line, #f2f2f3);border-radius:100px;border-radius:var(--devui-border-radius-full, 100px)}.devui-progress .devui-progress-bar{width:0;height:100%;transition:width .6s ease;background-color:#5e7ce0;background-color:var(--devui-brand, #5e7ce0);border-radius:100px;border-radius:var(--devui-border-radius-full, 100px)}.devui-progress>span{display:block;white-space:nowrap;color:#fff;color:var(--devui-light-text, #ffffff);text-align:center;position:absolute;left:0;top:0;height:100%;width:100%;font-size:12px;font-size:var(--devui-font-size, 12px);line-height:1.5}.devui-progress-circle{position:relative}.devui-progress-circle-text{position:absolute;top:50%;left:50%;width:100%;margin:0;padding:0;color:#252b3a;color:var(--devui-text, #252b3a);line-height:1;white-space:normal;text-align:center;transform:translate(-50%,-50%)}.devui-progress-circle-trail{stroke:#f2f2f3;stroke:var(--devui-dividing-line, #f2f2f3)}.devui-progress-circle-path{stroke:#5e7ce0;stroke:var(--devui-brand, #5e7ce0)}\n"] }]
        }], ctorParameters: function () { return []; }, propDecorators: { percentage: [{
                type: Input
            }], percentageText: [{
                type: Input
            }], barbgcolor: [{
                type: Input
            }], strokeColor: [{
                type: Input
            }], height: [{
                type: Input
            }], strokeWidth: [{
                type: Input
            }], isCircle: [{
                type: Input
            }], type: [{
                type: Input
            }], showContent: [{
                type: Input
            }], customViewTemplate: [{
                type: ContentChild,
                args: [TemplateRef]
            }] } });

class ProgressModule {
}
ProgressModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
ProgressModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.0", ngImport: i0, type: ProgressModule, declarations: [ProgressComponent], imports: [CommonModule], exports: [ProgressComponent] });
ProgressModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ProgressModule, imports: [CommonModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ProgressModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [CommonModule],
                    exports: [ProgressComponent],
                    declarations: [ProgressComponent],
                    providers: [],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { ProgressComponent, ProgressModule };
//# sourceMappingURL=ng-devui-progress.mjs.map
