@libs-ui/components-inputs-keyboard 0.2.30-6.1

package/README.md

@@ -0,0 +1,3 @@
+# inputs-keyboard
+
+This library was generated with [Nx](https://nx.dev).

package/defines/keyboard.define.d.ts

@@ -0,0 +1,2 @@
+import { IKeyCode } from "../interfaces/keyboard.interface";
+export declare const keypadConfig: () => Array<IKeyCode>;

package/esm2022/defines/keyboard.define.mjs

@@ -0,0 +1,53 @@
+export const keypadConfig = () => {
+    return [
+        {
+            code: '1',
+            label: '1'
+        },
+        {
+            code: '2',
+            label: '2'
+        },
+        {
+            code: '3',
+            label: '3'
+        },
+        {
+            code: '4',
+            label: '4'
+        },
+        {
+            code: '5',
+            label: '5'
+        },
+        {
+            code: '6',
+            label: '6'
+        },
+        {
+            code: '7',
+            label: '7'
+        },
+        {
+            code: '8',
+            label: '8'
+        },
+        {
+            code: '9',
+            label: '9'
+        },
+        {
+            code: '*',
+            label: '*'
+        },
+        {
+            code: '0',
+            label: '0'
+        },
+        {
+            code: '#',
+            label: '#'
+        }
+    ];
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2V5Ym9hcmQuZGVmaW5lLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2lucHV0cy9rZXlib2FyZC9zcmMvZGVmaW5lcy9rZXlib2FyZC5kZWZpbmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRUEsTUFBTSxDQUFDLE1BQU0sWUFBWSxHQUFHLEdBQW9CLEVBQUU7SUFDaEQsT0FBTztRQUNMO1lBQ0UsSUFBSSxFQUFFLEdBQUc7WUFDVCxLQUFLLEVBQUUsR0FBRztTQUNYO1FBQ0Q7WUFDRSxJQUFJLEVBQUUsR0FBRztZQUNULEtBQUssRUFBRSxHQUFHO1NBQ1g7UUFDRDtZQUNFLElBQUksRUFBRSxHQUFHO1lBQ1QsS0FBSyxFQUFFLEdBQUc7U0FDWDtRQUNEO1lBQ0UsSUFBSSxFQUFFLEdBQUc7WUFDVCxLQUFLLEVBQUUsR0FBRztTQUNYO1FBQ0Q7WUFDRSxJQUFJLEVBQUUsR0FBRztZQUNULEtBQUssRUFBRSxHQUFHO1NBQ1g7UUFDRDtZQUNFLElBQUksRUFBRSxHQUFHO1lBQ1QsS0FBSyxFQUFFLEdBQUc7U0FDWDtRQUNEO1lBQ0UsSUFBSSxFQUFFLEdBQUc7WUFDVCxLQUFLLEVBQUUsR0FBRztTQUNYO1FBQ0Q7WUFDRSxJQUFJLEVBQUUsR0FBRztZQUNULEtBQUssRUFBRSxHQUFHO1NBQ1g7UUFDRDtZQUNFLElBQUksRUFBRSxHQUFHO1lBQ1QsS0FBSyxFQUFFLEdBQUc7U0FDWDtRQUNEO1lBQ0UsSUFBSSxFQUFFLEdBQUc7WUFDVCxLQUFLLEVBQUUsR0FBRztTQUNYO1FBQ0Q7WUFDRSxJQUFJLEVBQUUsR0FBRztZQUNULEtBQUssRUFBRSxHQUFHO1NBQ1g7UUFDRDtZQUNFLElBQUksRUFBRSxHQUFHO1lBQ1QsS0FBSyxFQUFFLEdBQUc7U0FDWDtLQUNGLENBQUM7QUFDSixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJS2V5Q29kZSB9IGZyb20gXCIuLi9pbnRlcmZhY2VzL2tleWJvYXJkLmludGVyZmFjZVwiO1xuXG5leHBvcnQgY29uc3Qga2V5cGFkQ29uZmlnID0gKCk6IEFycmF5PElLZXlDb2RlPiA9PiB7XG4gIHJldHVybiBbXG4gICAge1xuICAgICAgY29kZTogJzEnLFxuICAgICAgbGFiZWw6ICcxJ1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzInLFxuICAgICAgbGFiZWw6ICcyJ1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzMnLFxuICAgICAgbGFiZWw6ICczJ1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzQnLFxuICAgICAgbGFiZWw6ICc0J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzUnLFxuICAgICAgbGFiZWw6ICc1J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzYnLFxuICAgICAgbGFiZWw6ICc2J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzcnLFxuICAgICAgbGFiZWw6ICc3J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzgnLFxuICAgICAgbGFiZWw6ICc4J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzknLFxuICAgICAgbGFiZWw6ICc5J1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJyonLFxuICAgICAgbGFiZWw6ICcqJ1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJzAnLFxuICAgICAgbGFiZWw6ICcwJ1xuICAgIH0sXG4gICAge1xuICAgICAgY29kZTogJyMnLFxuICAgICAgbGFiZWw6ICcjJ1xuICAgIH1cbiAgXTtcbn07XG4iXX0=

package/esm2022/index.mjs

@@ -0,0 +1,2 @@
+export * from './keyboard.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvaW5wdXRzL2tleWJvYXJkL3NyYy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLHNCQUFzQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9rZXlib2FyZC5jb21wb25lbnQnO1xuIl19

package/esm2022/interfaces/keyboard.interface.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2V5Ym9hcmQuaW50ZXJmYWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2lucHV0cy9rZXlib2FyZC9zcmMvaW50ZXJmYWNlcy9rZXlib2FyZC5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBpbnRlcmZhY2UgSUtleUNvZGUge1xuICBjb2RlOiBzdHJpbmc7XG4gIGxhYmVsOiBzdHJpbmdcbn1cbiJdfQ==

package/esm2022/keyboard.component.mjs

@@ -0,0 +1,44 @@
+import { Component, inject, NgZone, output, signal } from '@angular/core';
+import { keypadConfig } from './defines/keyboard.define';
+import { fromEvent, Subject, takeUntil } from 'rxjs';
+import * as i0 from "@angular/core";
+export class LibsUiComponentsInputsKeyboardComponent {
+    resultSelectKey = signal('');
+    configKeyCodes = signal(keypadConfig());
+    onDestroy = new Subject();
+    zone = inject(NgZone);
+    outKeyCodeSelected = output();
+    ngAfterViewInit() {
+        fromEvent(document, 'keyup').pipe(takeUntil(this.onDestroy)).subscribe(event => {
+            this.zone.run(() => {
+                this.listenerKeyUp(event);
+            });
+        });
+    }
+    handlerClickItem(event, config) {
+        event?.stopPropagation();
+        this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);
+        this.outKeyCodeSelected.emit(config.code);
+    }
+    listenerKeyUp(event) {
+        const keyCode = event.keyCode;
+        if (48 <= keyCode && keyCode <= 57 || 96 <= keyCode && keyCode <= 105) {
+            const config = this.configKeyCodes().find(item => item.code === `${event.key}`);
+            if (config) {
+                this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);
+                this.outKeyCodeSelected.emit(config.code);
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.onDestroy.next();
+        this.onDestroy.complete();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsKeyboardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsInputsKeyboardComponent, isStandalone: true, selector: "libs_ui-components-inputs-keyboard", outputs: { outKeyCodeSelected: "outKeyCodeSelected" }, ngImport: i0, template: "<div class=\"libs-ui-inputs-keyboard\">\n    <span class=\"libs-ui-font-h1s flex justify-center mt-[12px] h-[24px]\">{{ resultSelectKey() }}</span>\n    <hr class=\"mt-[12px] mb-[20px]\">\n    <div class=\"flex w-full justify-center\">\n        <div class=\"flex flex-wrap -mx-2 p-0 m-0\">\n            @for (config of configKeyCodes(); track config) {\n                <div class=\"w-1/3 p-0 m-0 flex justify-center !mb-[28px]\">\n                    <div class=\"libs-ui-border-general libs-ui-inputs-keyboard-item libs-ui-font-h1s\"\n                        (click)=\"handlerClickItem($event,config)\"> {{ config.label }}</div>\n                </div>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".libs-ui-inputs-keyboard{background-color:#fff;padding:8px 20px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item{display:flex;align-items:center;justify-content:center;border-radius:50%;height:52px;width:52px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item:hover{background-color:#4e4e4e20;cursor:pointer}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsKeyboardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'libs_ui-components-inputs-keyboard', standalone: true, template: "<div class=\"libs-ui-inputs-keyboard\">\n    <span class=\"libs-ui-font-h1s flex justify-center mt-[12px] h-[24px]\">{{ resultSelectKey() }}</span>\n    <hr class=\"mt-[12px] mb-[20px]\">\n    <div class=\"flex w-full justify-center\">\n        <div class=\"flex flex-wrap -mx-2 p-0 m-0\">\n            @for (config of configKeyCodes(); track config) {\n                <div class=\"w-1/3 p-0 m-0 flex justify-center !mb-[28px]\">\n                    <div class=\"libs-ui-border-general libs-ui-inputs-keyboard-item libs-ui-font-h1s\"\n                        (click)=\"handlerClickItem($event,config)\"> {{ config.label }}</div>\n                </div>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".libs-ui-inputs-keyboard{background-color:#fff;padding:8px 20px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item{display:flex;align-items:center;justify-content:center;border-radius:50%;height:52px;width:52px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item:hover{background-color:#4e4e4e20;cursor:pointer}\n"] }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2V5Ym9hcmQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2lucHV0cy9rZXlib2FyZC9zcmMva2V5Ym9hcmQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2lucHV0cy9rZXlib2FyZC9zcmMva2V5Ym9hcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFpQixTQUFTLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBYSxNQUFNLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3BHLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUV6RCxPQUFPLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxNQUFNLENBQUM7O0FBVXJELE1BQU0sT0FBTyx1Q0FBdUM7SUFFeEMsZUFBZSxHQUFHLE1BQU0sQ0FBUyxFQUFFLENBQUMsQ0FBQztJQUNyQyxjQUFjLEdBQUcsTUFBTSxDQUFrQixZQUFZLEVBQUUsQ0FBQyxDQUFDO0lBRTNELFNBQVMsR0FBRyxJQUFJLE9BQU8sRUFBUSxDQUFDO0lBQ2hDLElBQUksR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUM7SUFFckIsa0JBQWtCLEdBQUcsTUFBTSxFQUFVLENBQUM7SUFFL0MsZUFBZTtRQUNiLFNBQVMsQ0FBUyxRQUFRLEVBQUUsT0FBTyxDQUFDLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDLEVBQUU7WUFDckYsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxFQUFFO2dCQUNqQixJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQzVCLENBQUMsQ0FBQyxDQUFDO1FBQ0wsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRVMsZ0JBQWdCLENBQUMsS0FBWSxFQUFFLE1BQWdCO1FBQ3ZELEtBQUssRUFBRSxlQUFlLEVBQUUsQ0FBQztRQUN6QixJQUFJLENBQUMsZUFBZSxDQUFDLEdBQUcsQ0FBQyxHQUFHLElBQUksQ0FBQyxlQUFlLEVBQUUsR0FBRyxNQUFNLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQztRQUNyRSxJQUFJLENBQUMsa0JBQWtCLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUM1QyxDQUFDO0lBRU8sYUFBYSxDQUFDLEtBQWE7UUFDakMsTUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLE9BQU8sQ0FBQztRQUU5QixJQUFJLEVBQUUsSUFBSSxPQUFPLElBQUksT0FBTyxJQUFJLEVBQUUsSUFBSSxFQUFFLElBQUksT0FBTyxJQUFJLE9BQU8sSUFBSSxHQUFHLEVBQUUsQ0FBQztZQUN0RSxNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsY0FBYyxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksS0FBSyxHQUFHLEtBQUssQ0FBQyxHQUFHLEVBQUUsQ0FBQyxDQUFDO1lBRWhGLElBQUksTUFBTSxFQUFFLENBQUM7Z0JBQ1gsSUFBSSxDQUFDLGVBQWUsQ0FBQyxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsZUFBZSxFQUFFLEdBQUcsTUFBTSxDQUFDLEtBQUssRUFBRSxDQUFDLENBQUM7Z0JBQ3JFLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQzVDLENBQUM7UUFDSCxDQUFDO0lBQ0gsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ3RCLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDNUIsQ0FBQzt3R0F4Q1UsdUNBQXVDOzRGQUF2Qyx1Q0FBdUMscUpDYnBELHFzQkFjQTs7NEZERGEsdUNBQXVDO2tCQVBuRCxTQUFTOytCQUVFLG9DQUFvQyxjQUNsQyxJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQWZ0ZXJWaWV3SW5pdCwgQ29tcG9uZW50LCBpbmplY3QsIE5nWm9uZSwgT25EZXN0cm95LCBvdXRwdXQsIHNpZ25hbCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsga2V5cGFkQ29uZmlnIH0gZnJvbSAnLi9kZWZpbmVzL2tleWJvYXJkLmRlZmluZSc7XG5pbXBvcnQgeyBJS2V5Q29kZSB9IGZyb20gJy4vaW50ZXJmYWNlcy9rZXlib2FyZC5pbnRlcmZhY2UnO1xuaW1wb3J0IHsgZnJvbUV2ZW50LCBTdWJqZWN0LCB0YWtlVW50aWwgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IElFdmVudCB9IGZyb20gJ0BsaWJzLXVpL2ludGVyZmFjZXMtdHlwZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9jb21wb25lbnQtc2VsZWN0b3JcbiAgc2VsZWN0b3I6ICdsaWJzX3VpLWNvbXBvbmVudHMtaW5wdXRzLWtleWJvYXJkJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6ICcuL2tleWJvYXJkLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL2tleWJvYXJkLmNvbXBvbmVudC5zY3NzJyxcbn0pXG5leHBvcnQgY2xhc3MgTGlic1VpQ29tcG9uZW50c0lucHV0c0tleWJvYXJkQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCwgT25EZXN0cm95IHtcblxuICBwcm90ZWN0ZWQgcmVzdWx0U2VsZWN0S2V5ID0gc2lnbmFsPHN0cmluZz4oJycpO1xuICBwcm90ZWN0ZWQgY29uZmlnS2V5Q29kZXMgPSBzaWduYWw8QXJyYXk8SUtleUNvZGU+PihrZXlwYWRDb25maWcoKSk7XG5cbiAgcHJpdmF0ZSBvbkRlc3Ryb3kgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuICBwcml2YXRlIHpvbmUgPSBpbmplY3QoTmdab25lKTtcblxuICByZWFkb25seSBvdXRLZXlDb2RlU2VsZWN0ZWQgPSBvdXRwdXQ8c3RyaW5nPigpO1xuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICBmcm9tRXZlbnQ8SUV2ZW50Pihkb2N1bWVudCwgJ2tleXVwJykucGlwZSh0YWtlVW50aWwodGhpcy5vbkRlc3Ryb3kpKS5zdWJzY3JpYmUoZXZlbnQgPT4ge1xuICAgICAgdGhpcy56b25lLnJ1bigoKSA9PiB7XG4gICAgICAgIHRoaXMubGlzdGVuZXJLZXlVcChldmVudCk7XG4gICAgICB9KTtcbiAgICB9KTtcbiAgfVxuXG4gIHByb3RlY3RlZCBoYW5kbGVyQ2xpY2tJdGVtKGV2ZW50OiBFdmVudCwgY29uZmlnOiBJS2V5Q29kZSkge1xuICAgIGV2ZW50Py5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB0aGlzLnJlc3VsdFNlbGVjdEtleS5zZXQoYCR7dGhpcy5yZXN1bHRTZWxlY3RLZXkoKX0ke2NvbmZpZy5sYWJlbH1gKTtcbiAgICB0aGlzLm91dEtleUNvZGVTZWxlY3RlZC5lbWl0KGNvbmZpZy5jb2RlKTtcbiAgfVxuXG4gIHByaXZhdGUgbGlzdGVuZXJLZXlVcChldmVudDogSUV2ZW50KSB7XG4gICAgY29uc3Qga2V5Q29kZSA9IGV2ZW50LmtleUNvZGU7XG5cbiAgICBpZiAoNDggPD0ga2V5Q29kZSAmJiBrZXlDb2RlIDw9IDU3IHx8IDk2IDw9IGtleUNvZGUgJiYga2V5Q29kZSA8PSAxMDUpIHtcbiAgICAgIGNvbnN0IGNvbmZpZyA9IHRoaXMuY29uZmlnS2V5Q29kZXMoKS5maW5kKGl0ZW0gPT4gaXRlbS5jb2RlID09PSBgJHtldmVudC5rZXl9YCk7XG5cbiAgICAgIGlmIChjb25maWcpIHtcbiAgICAgICAgdGhpcy5yZXN1bHRTZWxlY3RLZXkuc2V0KGAke3RoaXMucmVzdWx0U2VsZWN0S2V5KCl9JHtjb25maWcubGFiZWx9YCk7XG4gICAgICAgIHRoaXMub3V0S2V5Q29kZVNlbGVjdGVkLmVtaXQoY29uZmlnLmNvZGUpO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMub25EZXN0cm95Lm5leHQoKTtcbiAgICB0aGlzLm9uRGVzdHJveS5jb21wbGV0ZSgpO1xuICB9XG5cbn1cbiIsIjxkaXYgY2xhc3M9XCJsaWJzLXVpLWlucHV0cy1rZXlib2FyZFwiPlxuICAgIDxzcGFuIGNsYXNzPVwibGlicy11aS1mb250LWgxcyBmbGV4IGp1c3RpZnktY2VudGVyIG10LVsxMnB4XSBoLVsyNHB4XVwiPnt7IHJlc3VsdFNlbGVjdEtleSgpIH19PC9zcGFuPlxuICAgIDxociBjbGFzcz1cIm10LVsxMnB4XSBtYi1bMjBweF1cIj5cbiAgICA8ZGl2IGNsYXNzPVwiZmxleCB3LWZ1bGwganVzdGlmeS1jZW50ZXJcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXggZmxleC13cmFwIC1teC0yIHAtMCBtLTBcIj5cbiAgICAgICAgICAgIEBmb3IgKGNvbmZpZyBvZiBjb25maWdLZXlDb2RlcygpOyB0cmFjayBjb25maWcpIHtcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwidy0xLzMgcC0wIG0tMCBmbGV4IGp1c3RpZnktY2VudGVyICFtYi1bMjhweF1cIj5cbiAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImxpYnMtdWktYm9yZGVyLWdlbmVyYWwgbGlicy11aS1pbnB1dHMta2V5Ym9hcmQtaXRlbSBsaWJzLXVpLWZvbnQtaDFzXCJcbiAgICAgICAgICAgICAgICAgICAgICAgIChjbGljayk9XCJoYW5kbGVyQ2xpY2tJdGVtKCRldmVudCxjb25maWcpXCI+IHt7IGNvbmZpZy5sYWJlbCB9fTwvZGl2PlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuIl19

package/esm2022/libs-ui-components-inputs-keyboard.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlicy11aS1jb21wb25lbnRzLWlucHV0cy1rZXlib2FyZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9pbnB1dHMva2V5Ym9hcmQvc3JjL2xpYnMtdWktY29tcG9uZW50cy1pbnB1dHMta2V5Ym9hcmQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLFNBQVMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/fesm2022/libs-ui-components-inputs-keyboard.mjs

@@ -0,0 +1,103 @@
+import * as i0 from '@angular/core';
+import { signal, inject, NgZone, output, Component } from '@angular/core';
+import { Subject, fromEvent, takeUntil } from 'rxjs';
+
+const keypadConfig = () => {
+    return [
+        {
+            code: '1',
+            label: '1'
+        },
+        {
+            code: '2',
+            label: '2'
+        },
+        {
+            code: '3',
+            label: '3'
+        },
+        {
+            code: '4',
+            label: '4'
+        },
+        {
+            code: '5',
+            label: '5'
+        },
+        {
+            code: '6',
+            label: '6'
+        },
+        {
+            code: '7',
+            label: '7'
+        },
+        {
+            code: '8',
+            label: '8'
+        },
+        {
+            code: '9',
+            label: '9'
+        },
+        {
+            code: '*',
+            label: '*'
+        },
+        {
+            code: '0',
+            label: '0'
+        },
+        {
+            code: '#',
+            label: '#'
+        }
+    ];
+};
+
+class LibsUiComponentsInputsKeyboardComponent {
+    resultSelectKey = signal('');
+    configKeyCodes = signal(keypadConfig());
+    onDestroy = new Subject();
+    zone = inject(NgZone);
+    outKeyCodeSelected = output();
+    ngAfterViewInit() {
+        fromEvent(document, 'keyup').pipe(takeUntil(this.onDestroy)).subscribe(event => {
+            this.zone.run(() => {
+                this.listenerKeyUp(event);
+            });
+        });
+    }
+    handlerClickItem(event, config) {
+        event?.stopPropagation();
+        this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);
+        this.outKeyCodeSelected.emit(config.code);
+    }
+    listenerKeyUp(event) {
+        const keyCode = event.keyCode;
+        if (48 <= keyCode && keyCode <= 57 || 96 <= keyCode && keyCode <= 105) {
+            const config = this.configKeyCodes().find(item => item.code === `${event.key}`);
+            if (config) {
+                this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);
+                this.outKeyCodeSelected.emit(config.code);
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.onDestroy.next();
+        this.onDestroy.complete();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsKeyboardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsInputsKeyboardComponent, isStandalone: true, selector: "libs_ui-components-inputs-keyboard", outputs: { outKeyCodeSelected: "outKeyCodeSelected" }, ngImport: i0, template: "<div class=\"libs-ui-inputs-keyboard\">\n    <span class=\"libs-ui-font-h1s flex justify-center mt-[12px] h-[24px]\">{{ resultSelectKey() }}</span>\n    <hr class=\"mt-[12px] mb-[20px]\">\n    <div class=\"flex w-full justify-center\">\n        <div class=\"flex flex-wrap -mx-2 p-0 m-0\">\n            @for (config of configKeyCodes(); track config) {\n                <div class=\"w-1/3 p-0 m-0 flex justify-center !mb-[28px]\">\n                    <div class=\"libs-ui-border-general libs-ui-inputs-keyboard-item libs-ui-font-h1s\"\n                        (click)=\"handlerClickItem($event,config)\"> {{ config.label }}</div>\n                </div>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".libs-ui-inputs-keyboard{background-color:#fff;padding:8px 20px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item{display:flex;align-items:center;justify-content:center;border-radius:50%;height:52px;width:52px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item:hover{background-color:#4e4e4e20;cursor:pointer}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsKeyboardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'libs_ui-components-inputs-keyboard', standalone: true, template: "<div class=\"libs-ui-inputs-keyboard\">\n    <span class=\"libs-ui-font-h1s flex justify-center mt-[12px] h-[24px]\">{{ resultSelectKey() }}</span>\n    <hr class=\"mt-[12px] mb-[20px]\">\n    <div class=\"flex w-full justify-center\">\n        <div class=\"flex flex-wrap -mx-2 p-0 m-0\">\n            @for (config of configKeyCodes(); track config) {\n                <div class=\"w-1/3 p-0 m-0 flex justify-center !mb-[28px]\">\n                    <div class=\"libs-ui-border-general libs-ui-inputs-keyboard-item libs-ui-font-h1s\"\n                        (click)=\"handlerClickItem($event,config)\"> {{ config.label }}</div>\n                </div>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".libs-ui-inputs-keyboard{background-color:#fff;padding:8px 20px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item{display:flex;align-items:center;justify-content:center;border-radius:50%;height:52px;width:52px}.libs-ui-inputs-keyboard .libs-ui-inputs-keyboard-item:hover{background-color:#4e4e4e20;cursor:pointer}\n"] }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LibsUiComponentsInputsKeyboardComponent };
+//# sourceMappingURL=libs-ui-components-inputs-keyboard.mjs.map

package/fesm2022/libs-ui-components-inputs-keyboard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"libs-ui-components-inputs-keyboard.mjs","sources":["../../../../../../libs-ui/components/inputs/keyboard/src/defines/keyboard.define.ts","../../../../../../libs-ui/components/inputs/keyboard/src/keyboard.component.ts","../../../../../../libs-ui/components/inputs/keyboard/src/keyboard.component.html","../../../../../../libs-ui/components/inputs/keyboard/src/libs-ui-components-inputs-keyboard.ts"],"sourcesContent":["import { IKeyCode } from \"../interfaces/keyboard.interface\";\n\nexport const keypadConfig = (): Array<IKeyCode> => {\n  return [\n    {\n      code: '1',\n      label: '1'\n    },\n    {\n      code: '2',\n      label: '2'\n    },\n    {\n      code: '3',\n      label: '3'\n    },\n    {\n      code: '4',\n      label: '4'\n    },\n    {\n      code: '5',\n      label: '5'\n    },\n    {\n      code: '6',\n      label: '6'\n    },\n    {\n      code: '7',\n      label: '7'\n    },\n    {\n      code: '8',\n      label: '8'\n    },\n    {\n      code: '9',\n      label: '9'\n    },\n    {\n      code: '*',\n      label: '*'\n    },\n    {\n      code: '0',\n      label: '0'\n    },\n    {\n      code: '#',\n      label: '#'\n    }\n  ];\n};\n","import { AfterViewInit, Component, inject, NgZone, OnDestroy, output, signal } from '@angular/core';\nimport { keypadConfig } from './defines/keyboard.define';\nimport { IKeyCode } from './interfaces/keyboard.interface';\nimport { fromEvent, Subject, takeUntil } from 'rxjs';\nimport { IEvent } from '@libs-ui/interfaces-types';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'libs_ui-components-inputs-keyboard',\n  standalone: true,\n  templateUrl: './keyboard.component.html',\n  styleUrl: './keyboard.component.scss',\n})\nexport class LibsUiComponentsInputsKeyboardComponent implements AfterViewInit, OnDestroy {\n\n  protected resultSelectKey = signal<string>('');\n  protected configKeyCodes = signal<Array<IKeyCode>>(keypadConfig());\n\n  private onDestroy = new Subject<void>();\n  private zone = inject(NgZone);\n\n  readonly outKeyCodeSelected = output<string>();\n\n  ngAfterViewInit() {\n    fromEvent<IEvent>(document, 'keyup').pipe(takeUntil(this.onDestroy)).subscribe(event => {\n      this.zone.run(() => {\n        this.listenerKeyUp(event);\n      });\n    });\n  }\n\n  protected handlerClickItem(event: Event, config: IKeyCode) {\n    event?.stopPropagation();\n    this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);\n    this.outKeyCodeSelected.emit(config.code);\n  }\n\n  private listenerKeyUp(event: IEvent) {\n    const keyCode = event.keyCode;\n\n    if (48 <= keyCode && keyCode <= 57 || 96 <= keyCode && keyCode <= 105) {\n      const config = this.configKeyCodes().find(item => item.code === `${event.key}`);\n\n      if (config) {\n        this.resultSelectKey.set(`${this.resultSelectKey()}${config.label}`);\n        this.outKeyCodeSelected.emit(config.code);\n      }\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.onDestroy.next();\n    this.onDestroy.complete();\n  }\n\n}\n","<div class=\"libs-ui-inputs-keyboard\">\n    <span class=\"libs-ui-font-h1s flex justify-center mt-[12px] h-[24px]\">{{ resultSelectKey() }}</span>\n    <hr class=\"mt-[12px] mb-[20px]\">\n    <div class=\"flex w-full justify-center\">\n        <div class=\"flex flex-wrap -mx-2 p-0 m-0\">\n            @for (config of configKeyCodes(); track config) {\n                <div class=\"w-1/3 p-0 m-0 flex justify-center !mb-[28px]\">\n                    <div class=\"libs-ui-border-general libs-ui-inputs-keyboard-item libs-ui-font-h1s\"\n                        (click)=\"handlerClickItem($event,config)\"> {{ config.label }}</div>\n                </div>\n            }\n        </div>\n    </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1 @@
+export * from './keyboard.component';

package/interfaces/keyboard.interface.d.ts

@@ -0,0 +1,4 @@
+export interface IKeyCode {
+    code: string;
+    label: string;
+}

package/keyboard.component.d.ts

@@ -0,0 +1,16 @@
+import { AfterViewInit, OnDestroy } from '@angular/core';
+import { IKeyCode } from './interfaces/keyboard.interface';
+import * as i0 from "@angular/core";
+export declare class LibsUiComponentsInputsKeyboardComponent implements AfterViewInit, OnDestroy {
+    protected resultSelectKey: import("@angular/core").WritableSignal<string>;
+    protected configKeyCodes: import("@angular/core").WritableSignal<IKeyCode[]>;
+    private onDestroy;
+    private zone;
+    readonly outKeyCodeSelected: import("@angular/core").OutputEmitterRef<string>;
+    ngAfterViewInit(): void;
+    protected handlerClickItem(event: Event, config: IKeyCode): void;
+    private listenerKeyUp;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsInputsKeyboardComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsInputsKeyboardComponent, "libs_ui-components-inputs-keyboard", never, {}, { "outKeyCodeSelected": "outKeyCodeSelected"; }, never, never, true, never>;
+}

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@libs-ui/components-inputs-keyboard",
+  "version": "0.2.306.1",
+  "peerDependencies": {
+    "@angular/common": ">=18.0.0",
+    "@angular/core": ">=18.0.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/libs-ui-components-inputs-keyboard.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/libs-ui-components-inputs-keyboard.mjs",
+      "esm": "./esm2022/libs-ui-components-inputs-keyboard.mjs",
+      "default": "./fesm2022/libs-ui-components-inputs-keyboard.mjs"
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}