@ngneat/hotkeys
Version:
A declarative library for handling hotkeys in Angular applications
69 lines • 10.4 kB
JavaScript
import { computed, Directive, ElementRef, EventEmitter, inject, input, Output, } from '@angular/core';
import { merge } from 'rxjs';
import { mergeAll } from 'rxjs/operators';
import { HotkeysService } from './hotkeys.service';
import { coerceArray } from './utils/array';
import * as i0 from "@angular/core";
export class HotkeysDirective {
constructor() {
this.hotkeysService = inject(HotkeysService);
this.elementRef = inject(ElementRef);
this.hotkeys = input();
// allows the user to set the value by just adding the attribute to the element
this.isSequence = input(false, {
transform: (value) => (typeof value === 'string' ? value === '' || value === 'true' : value),
});
this.isGlobal = input(false, {
transform: (value) => (typeof value === 'string' ? value === '' || value === 'true' : value),
});
this.hotkeysGroup = input();
this.hotkeysOptions = input({});
this.hotkeysDescription = input();
this.hotkey = new EventEmitter();
this._hotkey = computed(() => ({
keys: this.hotkeys(),
group: this.hotkeysGroup(),
description: this.hotkeysDescription(),
global: this.isGlobal(),
...this.hotkeysOptions(),
}));
}
ngOnChanges(changes) {
this.deleteHotkeys();
if (!this.hotkeys) {
return;
}
this.setHotkeys(this._hotkey());
}
ngOnDestroy() {
this.deleteHotkeys();
}
deleteHotkeys() {
if (this.subscription) {
this.subscription.unsubscribe();
}
this.subscription = null;
}
setHotkeys(hotkeys) {
const coercedHotkeys = coerceArray(hotkeys);
this.subscription = merge(coercedHotkeys.map((hotkey) => {
return this.isSequence()
? this.hotkeysService.addSequenceShortcut({ ...hotkey, element: this.elementRef.nativeElement })
: this.hotkeysService.addShortcut({ ...hotkey, element: this.elementRef.nativeElement });
}))
.pipe(mergeAll())
.subscribe((e) => this.hotkey.next(e));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HotkeysDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.2.4", type: HotkeysDirective, isStandalone: true, selector: "[hotkeys]", inputs: { hotkeys: { classPropertyName: "hotkeys", publicName: "hotkeys", isSignal: true, isRequired: false, transformFunction: null }, isSequence: { classPropertyName: "isSequence", publicName: "isSequence", isSignal: true, isRequired: false, transformFunction: null }, isGlobal: { classPropertyName: "isGlobal", publicName: "isGlobal", isSignal: true, isRequired: false, transformFunction: null }, hotkeysGroup: { classPropertyName: "hotkeysGroup", publicName: "hotkeysGroup", isSignal: true, isRequired: false, transformFunction: null }, hotkeysOptions: { classPropertyName: "hotkeysOptions", publicName: "hotkeysOptions", isSignal: true, isRequired: false, transformFunction: null }, hotkeysDescription: { classPropertyName: "hotkeysDescription", publicName: "hotkeysDescription", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { hotkey: "hotkey" }, usesOnChanges: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HotkeysDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[hotkeys]',
}]
}], propDecorators: { hotkey: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaG90a2V5cy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ25lYXQvaG90a2V5cy9zcmMvbGliL2hvdGtleXMuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxRQUFRLEVBQ1IsU0FBUyxFQUNULFVBQVUsRUFDVixZQUFZLEVBQ1osTUFBTSxFQUNOLEtBQUssRUFHTCxNQUFNLEdBRVAsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLEtBQUssRUFBZ0IsTUFBTSxNQUFNLENBQUM7QUFDM0MsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTFDLE9BQU8sRUFBVSxjQUFjLEVBQTZCLE1BQU0sbUJBQW1CLENBQUM7QUFDdEYsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFRNUMsTUFBTSxPQUFPLGdCQUFnQjtJQUo3QjtRQUtVLG1CQUFjLEdBQUcsTUFBTSxDQUFDLGNBQWMsQ0FBQyxDQUFDO1FBQ3hDLGVBQVUsR0FBRyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7UUFHeEMsWUFBTyxHQUFHLEtBQUssRUFBVSxDQUFDO1FBQzFCLCtFQUErRTtRQUMvRSxlQUFVLEdBQUcsS0FBSyxDQUFDLEtBQUssRUFBRTtZQUN4QixTQUFTLEVBQUUsQ0FBQyxLQUF1QixFQUFFLEVBQUUsQ0FBQyxDQUFDLE9BQU8sS0FBSyxLQUFLLFFBQVEsQ0FBQyxDQUFDLENBQUMsS0FBSyxLQUFLLEVBQUUsSUFBSSxLQUFLLEtBQUssTUFBTSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7U0FDL0csQ0FBQyxDQUFDO1FBQ0gsYUFBUSxHQUFHLEtBQUssQ0FBQyxLQUFLLEVBQUU7WUFDdEIsU0FBUyxFQUFFLENBQUMsS0FBdUIsRUFBRSxFQUFFLENBQUMsQ0FBQyxPQUFPLEtBQUssS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEtBQUssS0FBSyxFQUFFLElBQUksS0FBSyxLQUFLLE1BQU0sQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO1NBQy9HLENBQUMsQ0FBQztRQUNILGlCQUFZLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFDL0IsbUJBQWMsR0FBRyxLQUFLLENBQW1CLEVBQUUsQ0FBQyxDQUFDO1FBQzdDLHVCQUFrQixHQUFHLEtBQUssRUFBVSxDQUFDO1FBQzNCLFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBMEIsQ0FBQztRQUV0RCxZQUFPLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLENBQUM7WUFDaEMsSUFBSSxFQUFFLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDcEIsS0FBSyxFQUFFLElBQUksQ0FBQyxZQUFZLEVBQUU7WUFDMUIsV0FBVyxFQUFFLElBQUksQ0FBQyxrQkFBa0IsRUFBRTtZQUN0QyxNQUFNLEVBQUUsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUN2QixHQUFHLElBQUksQ0FBQyxjQUFjLEVBQUU7U0FDekIsQ0FBQyxDQUFDLENBQUM7S0FrQ0w7SUFoQ0MsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUNyQixJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ2xCLE9BQU87UUFDVCxDQUFDO1FBRUQsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQztJQUNsQyxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUN2QixDQUFDO0lBRU8sYUFBYTtRQUNuQixJQUFJLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztZQUN0QixJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ2xDLENBQUM7UUFDRCxJQUFJLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQztJQUMzQixDQUFDO0lBRU8sVUFBVSxDQUFDLE9BQTBCO1FBQzNDLE1BQU0sY0FBYyxHQUFHLFdBQVcsQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUM1QyxJQUFJLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FDdkIsY0FBYyxDQUFDLEdBQUcsQ0FBQyxDQUFDLE1BQU0sRUFBRSxFQUFFO1lBQzVCLE9BQU8sSUFBSSxDQUFDLFVBQVUsRUFBRTtnQkFDdEIsQ0FBQyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsbUJBQW1CLENBQUMsRUFBRSxHQUFHLE1BQU0sRUFBRSxPQUFPLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQUUsQ0FBQztnQkFDaEcsQ0FBQyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsV0FBVyxDQUFDLEVBQUUsR0FBRyxNQUFNLEVBQUUsT0FBTyxFQUFFLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLENBQUMsQ0FBQztRQUM3RixDQUFDLENBQUMsQ0FDSDthQUNFLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQzthQUNoQixTQUFTLENBQUMsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDM0MsQ0FBQzs4R0F6RFUsZ0JBQWdCO2tHQUFoQixnQkFBZ0I7OzJGQUFoQixnQkFBZ0I7a0JBSjVCLFNBQVM7bUJBQUM7b0JBQ1QsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLFFBQVEsRUFBRSxXQUFXO2lCQUN0Qjs4QkFpQlcsTUFBTTtzQkFBZixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgY29tcHV0ZWQsXG4gIERpcmVjdGl2ZSxcbiAgRWxlbWVudFJlZixcbiAgRXZlbnRFbWl0dGVyLFxuICBpbmplY3QsXG4gIGlucHV0LFxuICBPbkNoYW5nZXMsXG4gIE9uRGVzdHJveSxcbiAgT3V0cHV0LFxuICBTaW1wbGVDaGFuZ2VzLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IG1lcmdlLCBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IG1lcmdlQWxsIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuXG5pbXBvcnQgeyBIb3RrZXksIEhvdGtleXNTZXJ2aWNlLCBPcHRpb25zIGFzIFNlcnZpY2VPcHRpb25zIH0gZnJvbSAnLi9ob3RrZXlzLnNlcnZpY2UnO1xuaW1wb3J0IHsgY29lcmNlQXJyYXkgfSBmcm9tICcuL3V0aWxzL2FycmF5JztcblxudHlwZSBPcHRpb25zID0gT21pdDxTZXJ2aWNlT3B0aW9ucywgJ2dyb3VwJyB8ICdlbGVtZW50JyB8ICdkZXNjcmlwdGlvbic+O1xuXG5ARGlyZWN0aXZlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgc2VsZWN0b3I6ICdbaG90a2V5c10nLFxufSlcbmV4cG9ydCBjbGFzcyBIb3RrZXlzRGlyZWN0aXZlIGltcGxlbWVudHMgT25DaGFuZ2VzLCBPbkRlc3Ryb3kge1xuICBwcml2YXRlIGhvdGtleXNTZXJ2aWNlID0gaW5qZWN0KEhvdGtleXNTZXJ2aWNlKTtcbiAgcHJpdmF0ZSBlbGVtZW50UmVmID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuICBwcml2YXRlIHN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuXG4gIGhvdGtleXMgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIC8vIGFsbG93cyB0aGUgdXNlciB0byBzZXQgdGhlIHZhbHVlIGJ5IGp1c3QgYWRkaW5nIHRoZSBhdHRyaWJ1dGUgdG8gdGhlIGVsZW1lbnRcbiAgaXNTZXF1ZW5jZSA9IGlucHV0KGZhbHNlLCB7XG4gICAgdHJhbnNmb3JtOiAodmFsdWU6IGJvb2xlYW4gfCBzdHJpbmcpID0+ICh0eXBlb2YgdmFsdWUgPT09ICdzdHJpbmcnID8gdmFsdWUgPT09ICcnIHx8IHZhbHVlID09PSAndHJ1ZScgOiB2YWx1ZSksXG4gIH0pO1xuICBpc0dsb2JhbCA9IGlucHV0KGZhbHNlLCB7XG4gICAgdHJhbnNmb3JtOiAodmFsdWU6IGJvb2xlYW4gfCBzdHJpbmcpID0+ICh0eXBlb2YgdmFsdWUgPT09ICdzdHJpbmcnID8gdmFsdWUgPT09ICcnIHx8IHZhbHVlID09PSAndHJ1ZScgOiB2YWx1ZSksXG4gIH0pO1xuICBob3RrZXlzR3JvdXAgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIGhvdGtleXNPcHRpb25zID0gaW5wdXQ8UGFydGlhbDxPcHRpb25zPj4oe30pO1xuICBob3RrZXlzRGVzY3JpcHRpb24gPSBpbnB1dDxzdHJpbmc+KCk7XG4gIEBPdXRwdXQoKSBob3RrZXkgPSBuZXcgRXZlbnRFbWl0dGVyPEtleWJvYXJkRXZlbnQgfCBIb3RrZXk+KCk7XG5cbiAgcHJpdmF0ZSBfaG90a2V5ID0gY29tcHV0ZWQoKCkgPT4gKHtcbiAgICBrZXlzOiB0aGlzLmhvdGtleXMoKSxcbiAgICBncm91cDogdGhpcy5ob3RrZXlzR3JvdXAoKSxcbiAgICBkZXNjcmlwdGlvbjogdGhpcy5ob3RrZXlzRGVzY3JpcHRpb24oKSxcbiAgICBnbG9iYWw6IHRoaXMuaXNHbG9iYWwoKSxcbiAgICAuLi50aGlzLmhvdGtleXNPcHRpb25zKCksXG4gIH0pKTtcblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgdGhpcy5kZWxldGVIb3RrZXlzKCk7XG4gICAgaWYgKCF0aGlzLmhvdGtleXMpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLnNldEhvdGtleXModGhpcy5faG90a2V5KCkpO1xuICB9XG5cbiAgbmdPbkRlc3Ryb3koKSB7XG4gICAgdGhpcy5kZWxldGVIb3RrZXlzKCk7XG4gIH1cblxuICBwcml2YXRlIGRlbGV0ZUhvdGtleXMoKSB7XG4gICAgaWYgKHRoaXMuc3Vic2NyaXB0aW9uKSB7XG4gICAgICB0aGlzLnN1YnNjcmlwdGlvbi51bnN1YnNjcmliZSgpO1xuICAgIH1cbiAgICB0aGlzLnN1YnNjcmlwdGlvbiA9IG51bGw7XG4gIH1cblxuICBwcml2YXRlIHNldEhvdGtleXMoaG90a2V5czogSG90a2V5IHwgSG90a2V5W10pIHtcbiAgICBjb25zdCBjb2VyY2VkSG90a2V5cyA9IGNvZXJjZUFycmF5KGhvdGtleXMpO1xuICAgIHRoaXMuc3Vic2NyaXB0aW9uID0gbWVyZ2UoXG4gICAgICBjb2VyY2VkSG90a2V5cy5tYXAoKGhvdGtleSkgPT4ge1xuICAgICAgICByZXR1cm4gdGhpcy5pc1NlcXVlbmNlKClcbiAgICAgICAgICA/IHRoaXMuaG90a2V5c1NlcnZpY2UuYWRkU2VxdWVuY2VTaG9ydGN1dCh7IC4uLmhvdGtleSwgZWxlbWVudDogdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQgfSlcbiAgICAgICAgICA6IHRoaXMuaG90a2V5c1NlcnZpY2UuYWRkU2hvcnRjdXQoeyAuLi5ob3RrZXksIGVsZW1lbnQ6IHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50IH0pO1xuICAgICAgfSksXG4gICAgKVxuICAgICAgLnBpcGUobWVyZ2VBbGwoKSlcbiAgICAgIC5zdWJzY3JpYmUoKGUpID0+IHRoaXMuaG90a2V5Lm5leHQoZSkpO1xuICB9XG59XG4iXX0=