Подскажите решение с прогресс баром

Помогите кто разбирается в этом. Задача в том, чтобы отдельно указать typeDelay для прогресс баров (для каждого отдельно). Сейчас она одинаковая для всего, и для прогресс баров и для текста.

'use strict';
 
class Termynal {
 
    constructor(container = '#termynal', options = {}) {
        this.container = (typeof container === 'string') ? document.querySelector(container) : container;
        this.pfx = `data-${options.prefix || 'ty'}`;
        this.startDelay = options.startDelay
            || parseFloat(this.container.getAttribute(`${this.pfx}-startDelay`)) || 600;
        this.typeDelay = options.typeDelay
            || parseFloat(this.container.getAttribute(`${this.pfx}-typeDelay`)) || 90;
        this.lineDelay = options.lineDelay
            || parseFloat(this.container.getAttribute(`${this.pfx}-lineDelay`)) || 1500;
        this.progressLength = options.progressLength
            || parseFloat(this.container.getAttribute(`${this.pfx}-progressLength`)) || 40;
        this.progressChar = options.progressChar
            || this.container.getAttribute(`${this.pfx}-progressChar`) || '█';
        this.progressPercent = options.progressPercent
            || parseFloat(this.container.getAttribute(`${this.pfx}-progressPercent`)) || 100;
        this.cursor = options.cursor
            || this.container.getAttribute(`${this.pfx}-cursor`) || '▋';
        this.lineData = this.lineDataToElements(options.lineData || []);
        if (!options.noInit) this.init()
    }
 
    /**
     * Initialise the widget, get lines, clear container and start animation.
     */
    init() {
        // Appends dynamically loaded lines to existing line elements.
        this.lines = [...this.container.querySelectorAll(`[${this.pfx}]`)].concat(this.lineData);
 
        /** 
         * Calculates width and height of Termynal container.
         * If container is empty and lines are dynamically loaded, defaults to browser `auto` or CSS.
         */ 
        const containerStyle = getComputedStyle(this.container);
        this.container.style.width = containerStyle.width !== '0px' ? 
            containerStyle.width : undefined;
        this.container.style.minHeight = containerStyle.height !== '0px' ? 
            containerStyle.height : undefined;
 
        this.container.setAttribute('data-termynal', '');
        this.container.innerHTML = '';
        this.start();
    }
 
    /**
     * Start the animation and rener the lines depending on their data attributes.
     */
    async start() {
        await this._wait(this.startDelay);
 
        for (let line of this.lines) {
            const type = line.getAttribute(this.pfx);
            const delay = line.getAttribute(`${this.pfx}-delay`) || this.lineDelay;
 
            if (type == 'input') {
                line.setAttribute(`${this.pfx}-cursor`, this.cursor);
                await this.type(line);
                await this._wait(delay);
            }
 
            else if (type == 'progress') {
                await this.progress(line);
                await this._wait(delay);
            }
 
            else {
                this.container.appendChild(line);
                await this._wait(delay);
            }
 
            line.removeAttribute(`${this.pfx}-cursor`);
        }
    }
 
    /**
     * Animate a typed line.
     * @param {Node} line - The line element to render.
     */
    async type(line) {
        const chars = [...line.textContent];
        const delay = line.getAttribute(`${this.pfx}-typeDelay`) || this.typeDelay;
        line.textContent = '';
        this.container.appendChild(line);
 
        for (let char of chars) {
            await this._wait(delay);
            line.textContent += char;
        }
    }
 
    /**
     * Animate a progress bar.
     * @param {Node} line - The line element to render.
     */
    async progress(line) {
        const progressLength = line.getAttribute(`${this.pfx}-progressLength`)
            || this.progressLength;
        const progressChar = line.getAttribute(`${this.pfx}-progressChar`)
            || this.progressChar;
        const chars = progressChar.repeat(progressLength);
        const progressPercent = line.getAttribute(`${this.pfx}-progressPercent`)
            || this.progressPercent;
        line.textContent = '';
        this.container.appendChild(line);
 
        for (let i = 1; i < chars.length + 1; i++) {
            await this._wait(this.typeDelay);
            const percent = Math.round(i / chars.length * 100);
            line.textContent = `${chars.slice(0, i)} ${percent}%`;
            if (percent>progressPercent) {
                break;
            }
        }
    }
 
    /**
     * Helper function for animation delays, called with `await`.
     * @param {number} time - Timeout, in ms.
     */
    _wait(time) {
        return new Promise(resolve => setTimeout(resolve, time));
    }
 
    /**
     * Converts line data objects into line elements.
     * 
     * @param {Object[]} lineData - Dynamically loaded lines.
     * @param {Object} line - Line data object.
     * @returns {Element[]} - Array of line elements.
     */
    lineDataToElements(lineData) {
        return lineData.map(line => {
            let div = document.createElement('div');
            div.innerHTML = `<span ${this._attributes(line)}>${line.value || ''}</span>`;
 
            return div.firstElementChild;
        });
    }
 
    /**
     * Helper function for generating attributes string.
     * 
     * @param {Object} line - Line data object.
     * @returns {string} - String of attributes.
     */
    _attributes(line) {
        let attrs = '';
        for (let prop in line) {
            attrs += this.pfx;
 
            if (prop === 'type') {
                attrs += `="${line[prop]}" `
            } else if (prop !== 'value') {
                attrs += `-${prop}="${line[prop]}" `
            }
        }
 
        return attrs;
    }
}
 
/**
* HTML API: If current script has container(s) specified, initialise Termynal.
*/
if (document.currentScript.hasAttribute('data-termynal-container')) {
    const containers = document.currentScript.getAttribute('data-termynal-container');
    containers.split('|')
        .forEach(container => new Termynal(container))
}

        <div id="termynal" data-termynal>
            <span data-ty="input">pip install spacy</span>
            <span data-ty="progress"></span>
            <span data-ty>Successfully installed spacy</span>
            <span data-ty></span>
            <span data-ty="input">python -m spacy download en</span>
            <span data-ty="progress"></span>
            <span data-ty>Installed model 'en'</span>
            <span data-ty></span>
            <span data-ty="input">python</span>
            <span data-ty="input" data-ty-prompt=">>>">import spacy</span>
            <span data-ty="input" data-ty-prompt=">>>">nlp = spacy.load('en')</span>
            <span data-ty="input" data-ty-prompt=">>>">doc = nlp(u'Hello world')</span>
            <span data-ty="input" data-ty-prompt=">>>">print([(w.text, w.pos_) for w in doc])</span>
            <span data-ty>[('Hello', 'INTJ'), ('world', 'NOUN')]</span>
        </div>