duoyun-ui/elements/text-mask.js

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;
};
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
    if (kind === "m") throw new TypeError("Private method is not writable");
    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var _DuoyunTextMaskElement_instances, _DuoyunTextMaskElement_placeholder_get, _DuoyunTextMaskElement_replacer_get, _DuoyunTextMaskElement_masks;
import { adoptedStyle, customElement, property, attribute } from '@mantou/gem/lib/decorators';
import { GemElement, html } from '@mantou/gem/lib/element';
import { createCSSSheet, css } from '@mantou/gem/lib/utils';
const style = createCSSSheet(css `
  span {
    user-select: none;
  }
`);
/**
 * @customElement dy-text-mask
 */
let DuoyunTextMaskElement = class DuoyunTextMaskElement extends GemElement {
    constructor() {
        super();
        _DuoyunTextMaskElement_instances.add(this);
        _DuoyunTextMaskElement_masks.set(this, void 0);
        this.willMount = () => {
            this.memo(() => {
                var _a;
                const clearRegRxp = new RegExp(`[^${__classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_placeholder_get)}${__classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_replacer_get)}]`, 'g');
                const matchRegRxp = new RegExp(`([${__classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_placeholder_get)}]+|[${__classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_replacer_get)}]+)`);
                __classPrivateFieldSet(this, _DuoyunTextMaskElement_masks, new Map(), "f");
                (_a = this.masks) === null || _a === void 0 ? void 0 : _a.forEach((mask) => {
                    const { length } = mask.replaceAll(clearRegRxp, '');
                    const templateArr = [];
                    const values = [];
                    mask.split(matchRegRxp).forEach((e) => {
                        templateArr.push('');
                        if (!e) {
                            values.push('');
                        }
                        else if (e === __classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_placeholder_get).repeat(e.length)) {
                            values.push(e);
                        }
                        else if (e === __classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_replacer_get).repeat(e.length)) {
                            values.push(e.length);
                        }
                        else {
                            values.push(html `<span>${e}</span>`);
                        }
                    });
                    templateArr.push('');
                    __classPrivateFieldGet(this, _DuoyunTextMaskElement_masks, "f").set(length, [templateArr, values]);
                });
            }, () => this.masks || []);
        };
        this.render = () => {
            var _a;
            const origin = this.origin || ((_a = this.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
            const arg = __classPrivateFieldGet(this, _DuoyunTextMaskElement_masks, "f").get(origin.length);
            if (!arg)
                return html `${origin}`;
            let index = 0;
            const values = arg[1].map((e) => {
                switch (typeof e) {
                    case 'string': {
                        const s = origin.slice(index, index + e.length);
                        index += e.length;
                        return s;
                    }
                    case 'number': {
                        index += e;
                        return __classPrivateFieldGet(this, _DuoyunTextMaskElement_instances, "a", _DuoyunTextMaskElement_replacer_get).repeat(e);
                    }
                    default:
                        return e;
                }
            });
            return html(arg[0], ...values);
        };
        new MutationObserver(() => this.update()).observe(this, { childList: true, characterData: true, subtree: true });
    }
};
_DuoyunTextMaskElement_masks = new WeakMap(), _DuoyunTextMaskElement_instances = new WeakSet(), _DuoyunTextMaskElement_placeholder_get = function _DuoyunTextMaskElement_placeholder_get() {
    return this.placeholder || 'x';
}, _DuoyunTextMaskElement_replacer_get = function _DuoyunTextMaskElement_replacer_get() {
    return this.replacer || '*';
};
__decorate([
    attribute
], DuoyunTextMaskElement.prototype, "origin", void 0);
__decorate([
    attribute
], DuoyunTextMaskElement.prototype, "placeholder", void 0);
__decorate([
    attribute
], DuoyunTextMaskElement.prototype, "replacer", void 0);
__decorate([
    property
], DuoyunTextMaskElement.prototype, "masks", void 0);
DuoyunTextMaskElement = __decorate([
    customElement('dy-text-mask'),
    adoptedStyle(style)
], DuoyunTextMaskElement);
export { DuoyunTextMaskElement };
//# sourceMappingURL=text-mask.js.map