wotsui-vue-directives/lib/directives/wrap-words.js

Vue Directives for WotsUI

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const baseSettings = [
    {
        id: 'hashtags',
        pattern: /#[a-zA-Z0-9]+/g,
        style: {
            fontWeight: 'bold',
            color: '#00acee',
        },
    },
    {
        id: 'quotes',
        pattern: /@[\w\d]+/g,
        style: {
            fontWeight: 'bold',
            color: '#00ACEE',
        },
    },
];
function wrapWords(el, binding) {
    const settings = initSettings(binding);
    applySettings(el, settings);
}
exports.default = wrapWords;
function initSettings(binding) {
    let settings = [];
    if (binding.modifiers.add || !binding.value) {
        settings = settings.concat(baseSettings);
    }
    if (typeof binding.value === 'object' && settingsAreValid(binding.value)) {
        settings.push(binding.value);
    }
    if (Array.isArray(binding.value)) {
        binding.value.forEach((value) => {
            if (settingsAreValid(value)) {
                settings.push(value);
            }
        });
    }
    return settings;
}
function settingsAreValid(obj) {
    if (typeof obj !== 'object') {
        return false;
    }
    if (typeof obj.id === 'string' && obj.pattern instanceof RegExp) {
        return true;
    }
    return false;
}
function applySettings(el, wordSettings) {
    let html = el.innerHTML;
    for (const settings of wordSettings) {
        try {
            const words = html.match(settings.pattern);
            if (!words) {
                continue;
            }
            if (settings.callback) {
                settings.callback(settings.id, words);
            }
            words.forEach((word) => {
                const wrapperEl = document.createElement('span');
                wrapperEl.innerText = word;
                if (settings.class) {
                    wrapperEl.classList.add(settings.class);
                }
                if (settings.style) {
                    Object.assign(wrapperEl.style, settings.style);
                }
                html = html.replace(word, wrapperEl.outerHTML);
            });
        }
        catch (error) {
            continue;
        }
    }
    el.innerHTML = html;
}