ng-zorro-antd-mobile/esm2022/input-item/custom-keyboard/custom-keyboard.component.mjs

An enterprise-class mobile UI components based on Ant Design and Angular

import { Component, Output, EventEmitter, ViewEncapsulation } from '@angular/core';
import { LocaleProviderService } from 'ng-zorro-antd-mobile/locale-provider';
import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';
import * as i0 from "@angular/core";
import * as i1 from "ng-zorro-antd-mobile/locale-provider";
import * as i2 from "@angular/common";
export class CustomKeyboardComponent {
    constructor(_localeProvider) {
        this._localeProvider = _localeProvider;
        this.prefixCls = 'am-number-keyboard';
        this.okText = '';
        this._locale = {};
        this._unsubscribe$ = new Subject();
        this.onClick = new EventEmitter();
    }
    tdClick(e) {
        this.onClick.emit(e);
    }
    ngOnInit() {
        this.wrapCls = {
            [`${this.prefixCls}-item`]: true
        };
        this.wrapperCls = {
            [`${this.prefixCls}-wrapper`]: true
        };
        this._localeProvider.localeChange.pipe(takeUntil(this._unsubscribe$)).subscribe(_ => {
            this._locale = this._localeProvider.getLocaleSubObj('InputItem');
            this.okText = this._locale.confirmLabel;
        });
    }
    ngOnDestroy() {
        this._unsubscribe$.next();
        this._unsubscribe$.complete();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomKeyboardComponent, deps: [{ token: i1.LocaleProviderService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: CustomKeyboardComponent, selector: "CustomKeyboard", outputs: { onClick: "onClick" }, providers: [LocaleProviderService], ngImport: i0, template: "<div [ngClass]=\"wrapperCls\">\n  <table>\n    <tbody>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(1)\">1</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(2)\">2</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(3)\">3</td>\n        <td class=\"keyboard-delete\" [rowSpan]=\"2\" [ngClass]=\"wrapCls\" (click)=\"tdClick('delete')\"></td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(4)\">4</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(5)\">5</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(6)\">6</td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(7)\">7</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(8)\">8</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(9)\">9</td>\n        <td class=\"keyboard-confirm\" [rowSpan]=\"2\" [ngClass]=\"wrapCls\" (click)=\"tdClick('confirm')\">{{ okText }}</td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick('.')\">.</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(0)\">0</td>\n        <td class=\"keyboard-hide\" [ngClass]=\"wrapCls\" (click)=\"tdClick('hide')\"></td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomKeyboardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'CustomKeyboard', encapsulation: ViewEncapsulation.None, providers: [LocaleProviderService], template: "<div [ngClass]=\"wrapperCls\">\n  <table>\n    <tbody>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(1)\">1</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(2)\">2</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(3)\">3</td>\n        <td class=\"keyboard-delete\" [rowSpan]=\"2\" [ngClass]=\"wrapCls\" (click)=\"tdClick('delete')\"></td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(4)\">4</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(5)\">5</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(6)\">6</td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(7)\">7</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(8)\">8</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(9)\">9</td>\n        <td class=\"keyboard-confirm\" [rowSpan]=\"2\" [ngClass]=\"wrapCls\" (click)=\"tdClick('confirm')\">{{ okText }}</td>\n      </tr>\n      <tr>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick('.')\">.</td>\n        <td [ngClass]=\"wrapCls\" (click)=\"tdClick(0)\">0</td>\n        <td class=\"keyboard-hide\" [ngClass]=\"wrapCls\" (click)=\"tdClick('hide')\"></td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n" }]
        }], ctorParameters: () => [{ type: i1.LocaleProviderService }], propDecorators: { onClick: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VzdG9tLWtleWJvYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvaW5wdXQtaXRlbS9jdXN0b20ta2V5Ym9hcmQvY3VzdG9tLWtleWJvYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvaW5wdXQtaXRlbS9jdXN0b20ta2V5Ym9hcmQvY3VzdG9tLWtleWJvYXJkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxFQUFFLFlBQVksRUFBRSxpQkFBaUIsRUFBYSxNQUFNLGVBQWUsQ0FBQztBQUN0RyxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUM3RSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDM0MsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQzs7OztBQVEvQixNQUFNLE9BQU8sdUJBQXVCO0lBWWxDLFlBQW9CLGVBQXNDO1FBQXRDLG9CQUFlLEdBQWYsZUFBZSxDQUF1QjtRQVgxRCxjQUFTLEdBQVcsb0JBQW9CLENBQUM7UUFFekMsV0FBTSxHQUFXLEVBQUUsQ0FBQztRQUdaLFlBQU8sR0FBUSxFQUFFLENBQUM7UUFDbEIsa0JBQWEsR0FBRyxJQUFJLE9BQU8sRUFBUSxDQUFDO1FBRzVDLFlBQU8sR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBRTJCLENBQUM7SUFFOUQsT0FBTyxDQUFDLENBQUM7UUFDUCxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUN2QixDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxPQUFPLEdBQUc7WUFDYixDQUFDLEdBQUcsSUFBSSxDQUFDLFNBQVMsT0FBTyxDQUFDLEVBQUUsSUFBSTtTQUNqQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLFVBQVUsR0FBRztZQUNoQixDQUFDLEdBQUcsSUFBSSxDQUFDLFNBQVMsVUFBVSxDQUFDLEVBQUUsSUFBSTtTQUNwQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLGVBQWUsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDbEYsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLGVBQWUsQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUNqRSxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxDQUFDO1FBQzFDLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQzFCLElBQUksQ0FBQyxhQUFhLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDaEMsQ0FBQzs4R0FsQ1UsdUJBQXVCO2tHQUF2Qix1QkFBdUIsMEVBRnZCLENBQUMscUJBQXFCLENBQUMsMEJDVHBDLDB0Q0E0QkE7OzJGRGpCYSx1QkFBdUI7a0JBTm5DLFNBQVM7K0JBQ0UsZ0JBQWdCLGlCQUVYLGlCQUFpQixDQUFDLElBQUksYUFDMUIsQ0FBQyxxQkFBcUIsQ0FBQzswRkFZbEMsT0FBTztzQkFETixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBWaWV3RW5jYXBzdWxhdGlvbiwgT25EZXN0cm95IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBMb2NhbGVQcm92aWRlclNlcnZpY2UgfSBmcm9tICduZy16b3Jyby1hbnRkLW1vYmlsZS9sb2NhbGUtcHJvdmlkZXInO1xuaW1wb3J0IHsgdGFrZVVudGlsIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuaW1wb3J0IHsgU3ViamVjdCB9IGZyb20gJ3J4anMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdDdXN0b21LZXlib2FyZCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9jdXN0b20ta2V5Ym9hcmQuY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBwcm92aWRlcnM6IFtMb2NhbGVQcm92aWRlclNlcnZpY2VdXG59KVxuZXhwb3J0IGNsYXNzIEN1c3RvbUtleWJvYXJkQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuICBwcmVmaXhDbHM6IHN0cmluZyA9ICdhbS1udW1iZXIta2V5Ym9hcmQnO1xuICB3cmFwQ2xzOiBvYmplY3Q7XG4gIG9rVGV4dDogc3RyaW5nID0gJyc7XG4gIHdyYXBwZXJDbHM6IG9iamVjdDtcblxuICBwcml2YXRlIF9sb2NhbGU6IGFueSA9IHt9O1xuICBwcml2YXRlIF91bnN1YnNjcmliZSQgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuXG4gIEBPdXRwdXQoKVxuICBvbkNsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBfbG9jYWxlUHJvdmlkZXI6IExvY2FsZVByb3ZpZGVyU2VydmljZSkge31cblxuICB0ZENsaWNrKGUpIHtcbiAgICB0aGlzLm9uQ2xpY2suZW1pdChlKTtcbiAgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMud3JhcENscyA9IHtcbiAgICAgIFtgJHt0aGlzLnByZWZpeENsc30taXRlbWBdOiB0cnVlXG4gICAgfTtcbiAgICB0aGlzLndyYXBwZXJDbHMgPSB7XG4gICAgICBbYCR7dGhpcy5wcmVmaXhDbHN9LXdyYXBwZXJgXTogdHJ1ZVxuICAgIH07XG4gICAgdGhpcy5fbG9jYWxlUHJvdmlkZXIubG9jYWxlQ2hhbmdlLnBpcGUodGFrZVVudGlsKHRoaXMuX3Vuc3Vic2NyaWJlJCkpLnN1YnNjcmliZShfID0+IHtcbiAgICAgIHRoaXMuX2xvY2FsZSA9IHRoaXMuX2xvY2FsZVByb3ZpZGVyLmdldExvY2FsZVN1Yk9iaignSW5wdXRJdGVtJyk7XG4gICAgICB0aGlzLm9rVGV4dCA9IHRoaXMuX2xvY2FsZS5jb25maXJtTGFiZWw7XG4gICAgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICB0aGlzLl91bnN1YnNjcmliZSQubmV4dCgpO1xuICAgIHRoaXMuX3Vuc3Vic2NyaWJlJC5jb21wbGV0ZSgpO1xuICB9XG59XG4iLCI8ZGl2IFtuZ0NsYXNzXT1cIndyYXBwZXJDbHNcIj5cbiAgPHRhYmxlPlxuICAgIDx0Ym9keT5cbiAgICAgIDx0cj5cbiAgICAgICAgPHRkIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljaygxKVwiPjE8L3RkPlxuICAgICAgICA8dGQgW25nQ2xhc3NdPVwid3JhcENsc1wiIChjbGljayk9XCJ0ZENsaWNrKDIpXCI+MjwvdGQ+XG4gICAgICAgIDx0ZCBbbmdDbGFzc109XCJ3cmFwQ2xzXCIgKGNsaWNrKT1cInRkQ2xpY2soMylcIj4zPC90ZD5cbiAgICAgICAgPHRkIGNsYXNzPVwia2V5Ym9hcmQtZGVsZXRlXCIgW3Jvd1NwYW5dPVwiMlwiIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljaygnZGVsZXRlJylcIj48L3RkPlxuICAgICAgPC90cj5cbiAgICAgIDx0cj5cbiAgICAgICAgPHRkIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljayg0KVwiPjQ8L3RkPlxuICAgICAgICA8dGQgW25nQ2xhc3NdPVwid3JhcENsc1wiIChjbGljayk9XCJ0ZENsaWNrKDUpXCI+NTwvdGQ+XG4gICAgICAgIDx0ZCBbbmdDbGFzc109XCJ3cmFwQ2xzXCIgKGNsaWNrKT1cInRkQ2xpY2soNilcIj42PC90ZD5cbiAgICAgIDwvdHI+XG4gICAgICA8dHI+XG4gICAgICAgIDx0ZCBbbmdDbGFzc109XCJ3cmFwQ2xzXCIgKGNsaWNrKT1cInRkQ2xpY2soNylcIj43PC90ZD5cbiAgICAgICAgPHRkIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljayg4KVwiPjg8L3RkPlxuICAgICAgICA8dGQgW25nQ2xhc3NdPVwid3JhcENsc1wiIChjbGljayk9XCJ0ZENsaWNrKDkpXCI+OTwvdGQ+XG4gICAgICAgIDx0ZCBjbGFzcz1cImtleWJvYXJkLWNvbmZpcm1cIiBbcm93U3Bhbl09XCIyXCIgW25nQ2xhc3NdPVwid3JhcENsc1wiIChjbGljayk9XCJ0ZENsaWNrKCdjb25maXJtJylcIj57eyBva1RleHQgfX08L3RkPlxuICAgICAgPC90cj5cbiAgICAgIDx0cj5cbiAgICAgICAgPHRkIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljaygnLicpXCI+LjwvdGQ+XG4gICAgICAgIDx0ZCBbbmdDbGFzc109XCJ3cmFwQ2xzXCIgKGNsaWNrKT1cInRkQ2xpY2soMClcIj4wPC90ZD5cbiAgICAgICAgPHRkIGNsYXNzPVwia2V5Ym9hcmQtaGlkZVwiIFtuZ0NsYXNzXT1cIndyYXBDbHNcIiAoY2xpY2spPVwidGRDbGljaygnaGlkZScpXCI+PC90ZD5cbiAgICAgIDwvdHI+XG4gICAgPC90Ym9keT5cbiAgPC90YWJsZT5cbjwvZGl2PlxuIl19