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 { LitElement, html, nothing } from 'lit';
import { property, query, queryAssignedElements, state, } from 'lit/decorators.js';
import { watch } from '../common/decorators/watch.js';
import { asPercent, clamp, formatString, isEmpty, partNameMap, } from '../common/util.js';
export class IgcProgressBaseComponent extends LitElement {
    indeterminateChange() {
        if (!this.indeterminate) {
            this._updateProgress();
        }
    }
    maxChange() {
        this.max = Math.max(0, this.max);
        if (this.value > this.max) {
            this.value = this.max;
        }
        if (!this.indeterminate) {
            this._updateProgress();
        }
    }
    valueChange() {
        this.value = clamp(this.value, 0, this.max);
        if (!this.indeterminate) {
            this._updateProgress();
        }
    }
    constructor() {
        super();
        this._percentage = 0;
        this._progress = 0;
        this._hasFraction = false;
        this._styleInfo = {
            '--_progress-whole': '0.00',
            '--_progress-integer': '0',
            '--_progress-fraction': '0',
            '--_transition-duration': '0ms',
        };
        this.max = 100;
        this.value = 0;
        this.variant = 'primary';
        this.animationDuration = 500;
        this.indeterminate = false;
        this.hideLabel = false;
        this.__internals = this.attachInternals();
        Object.assign(this.__internals, {
            role: 'progressbar',
            ariaValueMin: '0',
            ariaValueNow: '0',
        });
    }
    createRenderRoot() {
        const root = super.createRenderRoot();
        root.addEventListener('slotchange', () => this.requestUpdate());
        return root;
    }
    updated() {
        this._updateARIA();
    }
    _updateARIA() {
        const text = this.labelFormat ? this.renderLabelFormat() : `${this.value}%`;
        Object.assign(this.__internals, {
            ariaValueMax: this.max.toString(),
            ariaValueNow: this.indeterminate ? null : this.value.toString(),
            ariaValueText: this.indeterminate ? null : text,
        });
    }
    _updateProgress() {
        const percentage = asPercent(this.value, Math.max(1, this.max));
        const fractionValue = Math.round((percentage % 1) * 100);
        this._hasFraction = fractionValue > 0;
        this._styleInfo = {
            '--_progress-whole': percentage.toFixed(2),
            '--_progress-integer': Math.floor(percentage),
            '--_progress-fraction': fractionValue,
            '--_transition-duration': `${this.animationDuration}ms`,
        };
    }
    renderLabel() {
        const parts = partNameMap({
            label: true,
            value: true,
            fraction: this._hasFraction,
        });
        return this.labelFormat
            ? html `<span part=${parts}>${this.renderLabelFormat()}</span>`
            : html `<span part="${parts} counter"></span>`;
    }
    renderLabelFormat() {
        return formatString(this.labelFormat, this.value, this.max);
    }
    renderDefaultSlot() {
        const hideDefaultLabel = this.indeterminate || this.hideLabel || !isEmpty(this._assignedElements);
        return html `
      <slot part="label"></slot>
      ${hideDefaultLabel ? nothing : this.renderLabel()}
    `;
    }
}
__decorate([
    queryAssignedElements()
], IgcProgressBaseComponent.prototype, "_assignedElements", void 0);
__decorate([
    query('[part="base"]', true)
], IgcProgressBaseComponent.prototype, "_base", void 0);
__decorate([
    state()
], IgcProgressBaseComponent.prototype, "_percentage", void 0);
__decorate([
    state()
], IgcProgressBaseComponent.prototype, "_progress", void 0);
__decorate([
    state()
], IgcProgressBaseComponent.prototype, "_hasFraction", void 0);
__decorate([
    state()
], IgcProgressBaseComponent.prototype, "_styleInfo", void 0);
__decorate([
    property({ type: Number })
], IgcProgressBaseComponent.prototype, "max", void 0);
__decorate([
    property({ type: Number })
], IgcProgressBaseComponent.prototype, "value", void 0);
__decorate([
    property({ reflect: true })
], IgcProgressBaseComponent.prototype, "variant", void 0);
__decorate([
    property({ type: Number, attribute: 'animation-duration' })
], IgcProgressBaseComponent.prototype, "animationDuration", void 0);
__decorate([
    property({ type: Boolean, reflect: false })
], IgcProgressBaseComponent.prototype, "indeterminate", void 0);
__decorate([
    property({ type: Boolean, attribute: 'hide-label', reflect: false })
], IgcProgressBaseComponent.prototype, "hideLabel", void 0);
__decorate([
    property({ attribute: 'label-format' })
], IgcProgressBaseComponent.prototype, "labelFormat", void 0);
__decorate([
    watch('indeterminate')
], IgcProgressBaseComponent.prototype, "indeterminateChange", null);
__decorate([
    watch('max')
], IgcProgressBaseComponent.prototype, "maxChange", null);
__decorate([
    watch('value')
], IgcProgressBaseComponent.prototype, "valueChange", null);
//# sourceMappingURL=base.js.map