@spartacus/storefront
Version:
Spartacus Storefront is a package that you can include in your application, which allows you to add default storefront features.
84 lines • 9.74 kB
JavaScript
import { Directive, HostBinding, Input, } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "./base-focus.service";
/**
* Abstract directive that provides a common interface for all focus directives:
* - Block Focus
* - Persist Focus
* - Escape Focus
* - Auto Focus
* - Tab Focus
* - Trap Focus
* - Lock Focus
*/
export class BaseFocusDirective {
constructor(elementRef, service) {
this.elementRef = elementRef;
this.service = service;
/**
* A default config can be provided for each directive if a specific focus directive
* is used directly. i.e. `<div cxAutoFocus></div>`
*/
this.defaultConfig = {};
}
ngOnInit() {
this.setDefaultConfiguration();
this.requiredTabindex = -1;
}
// empty, but sub classes might have an implementation
ngOnChanges(_changes) { }
/**
* Override the (input) config if it undefined or an empty string, with the
* `defaultConfig`. The `defaultConfig` might be specified for each directive
* differently. If a specific directive is used (i.e. `cxAutoFocus`), the
* specific (inherited) defaultConfig will be used.
*/
setDefaultConfiguration() {
if ((!this.config || this.config === '') && this.defaultConfig) {
this.config = this.defaultConfig;
}
}
/**
* Helper method to return the host element for the directive
* given by the `elementRef`.
*/
get host() {
return this.elementRef.nativeElement;
}
/**
* Force a tabindex on the host element if it is _required_ to make the element
* focusable. If the element is focusable by nature or by a given tabindex, the
* `tabindex` is not applied.
*
* Buttons, active links, etc. do no need an explicit tabindex to receive focus.
*/
set requiredTabindex(tabindex) {
if (this.requiresExplicitTabIndex) {
this.tabindex = tabindex;
}
}
/**
* Returns true if the host element does not have a tabindex defined
* and it also doesn't get focus by browsers nature (i.e. button or
* active link).
*/
get requiresExplicitTabIndex() {
return (this.tabindex === undefined &&
['button', 'input', 'select', 'textarea'].indexOf(this.host.tagName.toLowerCase()) === -1 &&
!(this.host.tagName === 'A' &&
(this.host.hasAttribute('href') ||
this.host.hasAttribute('routerlink') ||
this.host.getAttribute('ng-reflect-router-link'))));
}
}
BaseFocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: BaseFocusDirective, deps: [{ token: i0.ElementRef }, { token: i1.BaseFocusService }], target: i0.ɵɵFactoryTarget.Directive });
BaseFocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.0.5", type: BaseFocusDirective, inputs: { tabindex: "tabindex" }, host: { properties: { "attr.tabindex": "this.tabindex" } }, usesOnChanges: true, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: BaseFocusDirective, decorators: [{
type: Directive
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.BaseFocusService }]; }, propDecorators: { tabindex: [{
type: Input
}, {
type: HostBinding,
args: ['attr.tabindex']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFzZS1mb2N1cy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zdG9yZWZyb250bGliL2xheW91dC9hMTF5L2tleWJvYXJkLWZvY3VzL2Jhc2UvYmFzZS1mb2N1cy5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFFVCxXQUFXLEVBQ1gsS0FBSyxHQUlOLE1BQU0sZUFBZSxDQUFDOzs7QUFJdkI7Ozs7Ozs7OztHQVNHO0FBRUgsTUFBTSxPQUFnQixrQkFBa0I7SUFldEMsWUFDWSxVQUFtQyxFQUNuQyxPQUF5QjtRQUR6QixlQUFVLEdBQVYsVUFBVSxDQUF5QjtRQUNuQyxZQUFPLEdBQVAsT0FBTyxDQUFrQjtRQVZyQzs7O1dBR0c7UUFDTyxrQkFBYSxHQUFvQixFQUFFLENBQUM7SUFPM0MsQ0FBQztJQUVKLFFBQVE7UUFDTixJQUFJLENBQUMsdUJBQXVCLEVBQUUsQ0FBQztRQUMvQixJQUFJLENBQUMsZ0JBQWdCLEdBQUcsQ0FBQyxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUVELHNEQUFzRDtJQUN0RCxXQUFXLENBQUMsUUFBdUIsSUFBUyxDQUFDO0lBRTdDOzs7OztPQUtHO0lBQ08sdUJBQXVCO1FBQy9CLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLE1BQU0sS0FBSyxFQUFFLENBQUMsSUFBSSxJQUFJLENBQUMsYUFBYSxFQUFFO1lBQzlELElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQztTQUNsQztJQUNILENBQUM7SUFFRDs7O09BR0c7SUFDSCxJQUFjLElBQUk7UUFDaEIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQztJQUN2QyxDQUFDO0lBRUQ7Ozs7OztPQU1HO0lBQ0gsSUFBYyxnQkFBZ0IsQ0FBQyxRQUFnQjtRQUM3QyxJQUFJLElBQUksQ0FBQyx3QkFBd0IsRUFBRTtZQUNqQyxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztTQUMxQjtJQUNILENBQUM7SUFFRDs7OztPQUlHO0lBQ0gsSUFBYyx3QkFBd0I7UUFDcEMsT0FBTyxDQUNMLElBQUksQ0FBQyxRQUFRLEtBQUssU0FBUztZQUMzQixDQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLFVBQVUsQ0FBQyxDQUFDLE9BQU8sQ0FDL0MsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsV0FBVyxFQUFFLENBQ2hDLEtBQUssQ0FBQyxDQUFDO1lBQ1IsQ0FBQyxDQUNDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxLQUFLLEdBQUc7Z0JBQ3pCLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZLENBQUMsTUFBTSxDQUFDO29CQUM3QixJQUFJLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxZQUFZLENBQUM7b0JBQ3BDLElBQUksQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLHdCQUF3QixDQUFDLENBQUMsQ0FDcEQsQ0FDRixDQUFDO0lBQ0osQ0FBQzs7K0dBL0VtQixrQkFBa0I7bUdBQWxCLGtCQUFrQjsyRkFBbEIsa0JBQWtCO2tCQUR2QyxTQUFTO2dJQWMrQixRQUFRO3NCQUE5QyxLQUFLOztzQkFBSSxXQUFXO3VCQUFDLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBEaXJlY3RpdmUsXG4gIEVsZW1lbnRSZWYsXG4gIEhvc3RCaW5kaW5nLFxuICBJbnB1dCxcbiAgT25DaGFuZ2VzLFxuICBPbkluaXQsXG4gIFNpbXBsZUNoYW5nZXMsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQmFzZUZvY3VzQ29uZmlnIH0gZnJvbSAnLi4va2V5Ym9hcmQtZm9jdXMubW9kZWwnO1xuaW1wb3J0IHsgQmFzZUZvY3VzU2VydmljZSB9IGZyb20gJy4vYmFzZS1mb2N1cy5zZXJ2aWNlJztcblxuLyoqXG4gKiBBYnN0cmFjdCBkaXJlY3RpdmUgdGhhdCBwcm92aWRlcyBhIGNvbW1vbiBpbnRlcmZhY2UgZm9yIGFsbCBmb2N1cyBkaXJlY3RpdmVzOlxuICogLSBCbG9jayBGb2N1c1xuICogLSBQZXJzaXN0IEZvY3VzXG4gKiAtIEVzY2FwZSBGb2N1c1xuICogLSBBdXRvIEZvY3VzXG4gKiAtIFRhYiBGb2N1c1xuICogLSBUcmFwIEZvY3VzXG4gKiAtIExvY2sgRm9jdXNcbiAqL1xuQERpcmVjdGl2ZSgpXG5leHBvcnQgYWJzdHJhY3QgY2xhc3MgQmFzZUZvY3VzRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMge1xuICAvKipcbiAgICogT3B0aW9uYWwgY29uZmlndXJhdGlvbiBmb3IgdGhlIGZvY3VzIGRpcmVjdGl2ZSBkcml2ZXMgdGhlIGJlaGF2aW91ciBvZiB0aGUga2V5Ym9hcmRcbiAgICogZm9jdXMgZGlyZWN0aXZlLlxuICAgKi9cbiAgcHJvdGVjdGVkIGNvbmZpZzogQmFzZUZvY3VzQ29uZmlnO1xuXG4gIC8qKlxuICAgKiBBIGRlZmF1bHQgY29uZmlnIGNhbiBiZSBwcm92aWRlZCBmb3IgZWFjaCBkaXJlY3RpdmUgaWYgYSBzcGVjaWZpYyBmb2N1cyBkaXJlY3RpdmVcbiAgICogaXMgdXNlZCBkaXJlY3RseS4gaS5lLiBgPGRpdiBjeEF1dG9Gb2N1cz48L2Rpdj5gXG4gICAqL1xuICBwcm90ZWN0ZWQgZGVmYXVsdENvbmZpZzogQmFzZUZvY3VzQ29uZmlnID0ge307XG5cbiAgQElucHV0KCkgQEhvc3RCaW5kaW5nKCdhdHRyLnRhYmluZGV4JykgdGFiaW5kZXg6IG51bWJlcjtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcm90ZWN0ZWQgZWxlbWVudFJlZjogRWxlbWVudFJlZjxIVE1MRWxlbWVudD4sXG4gICAgcHJvdGVjdGVkIHNlcnZpY2U6IEJhc2VGb2N1c1NlcnZpY2VcbiAgKSB7fVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMuc2V0RGVmYXVsdENvbmZpZ3VyYXRpb24oKTtcbiAgICB0aGlzLnJlcXVpcmVkVGFiaW5kZXggPSAtMTtcbiAgfVxuXG4gIC8vIGVtcHR5LCBidXQgc3ViIGNsYXNzZXMgbWlnaHQgaGF2ZSBhbiBpbXBsZW1lbnRhdGlvblxuICBuZ09uQ2hhbmdlcyhfY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge31cblxuICAvKipcbiAgICogT3ZlcnJpZGUgdGhlIChpbnB1dCkgY29uZmlnIGlmIGl0IHVuZGVmaW5lZCBvciBhbiBlbXB0eSBzdHJpbmcsIHdpdGggdGhlXG4gICAqIGBkZWZhdWx0Q29uZmlnYC4gVGhlIGBkZWZhdWx0Q29uZmlnYCBtaWdodCBiZSBzcGVjaWZpZWQgZm9yIGVhY2ggZGlyZWN0aXZlXG4gICAqIGRpZmZlcmVudGx5LiBJZiBhIHNwZWNpZmljIGRpcmVjdGl2ZSBpcyB1c2VkIChpLmUuIGBjeEF1dG9Gb2N1c2ApLCB0aGVcbiAgICogc3BlY2lmaWMgKGluaGVyaXRlZCkgZGVmYXVsdENvbmZpZyB3aWxsIGJlIHVzZWQuXG4gICAqL1xuICBwcm90ZWN0ZWQgc2V0RGVmYXVsdENvbmZpZ3VyYXRpb24oKTogdm9pZCB7XG4gICAgaWYgKCghdGhpcy5jb25maWcgfHwgdGhpcy5jb25maWcgPT09ICcnKSAmJiB0aGlzLmRlZmF1bHRDb25maWcpIHtcbiAgICAgIHRoaXMuY29uZmlnID0gdGhpcy5kZWZhdWx0Q29uZmlnO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBIZWxwZXIgbWV0aG9kIHRvIHJldHVybiB0aGUgaG9zdCBlbGVtZW50IGZvciB0aGUgZGlyZWN0aXZlXG4gICAqIGdpdmVuIGJ5IHRoZSBgZWxlbWVudFJlZmAuXG4gICAqL1xuICBwcm90ZWN0ZWQgZ2V0IGhvc3QoKTogSFRNTEVsZW1lbnQge1xuICAgIHJldHVybiB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIC8qKlxuICAgKiBGb3JjZSBhIHRhYmluZGV4IG9uIHRoZSBob3N0IGVsZW1lbnQgaWYgaXQgaXMgX3JlcXVpcmVkXyB0byBtYWtlIHRoZSBlbGVtZW50XG4gICAqIGZvY3VzYWJsZS4gSWYgdGhlIGVsZW1lbnQgaXMgZm9jdXNhYmxlIGJ5IG5hdHVyZSBvciBieSBhIGdpdmVuIHRhYmluZGV4LCB0aGVcbiAgICogYHRhYmluZGV4YCBpcyBub3QgYXBwbGllZC5cbiAgICpcbiAgICogQnV0dG9ucywgYWN0aXZlIGxpbmtzLCBldGMuIGRvIG5vIG5lZWQgYW4gZXhwbGljaXQgdGFiaW5kZXggdG8gcmVjZWl2ZSBmb2N1cy5cbiAgICovXG4gIHByb3RlY3RlZCBzZXQgcmVxdWlyZWRUYWJpbmRleCh0YWJpbmRleDogbnVtYmVyKSB7XG4gICAgaWYgKHRoaXMucmVxdWlyZXNFeHBsaWNpdFRhYkluZGV4KSB7XG4gICAgICB0aGlzLnRhYmluZGV4ID0gdGFiaW5kZXg7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIFJldHVybnMgdHJ1ZSBpZiB0aGUgaG9zdCBlbGVtZW50IGRvZXMgbm90IGhhdmUgYSB0YWJpbmRleCBkZWZpbmVkXG4gICAqIGFuZCBpdCBhbHNvIGRvZXNuJ3QgZ2V0IGZvY3VzIGJ5IGJyb3dzZXJzIG5hdHVyZSAoaS5lLiBidXR0b24gb3JcbiAgICogYWN0aXZlIGxpbmspLlxuICAgKi9cbiAgcHJvdGVjdGVkIGdldCByZXF1aXJlc0V4cGxpY2l0VGFiSW5kZXgoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIChcbiAgICAgIHRoaXMudGFiaW5kZXggPT09IHVuZGVmaW5lZCAmJlxuICAgICAgWydidXR0b24nLCAnaW5wdXQnLCAnc2VsZWN0JywgJ3RleHRhcmVhJ10uaW5kZXhPZihcbiAgICAgICAgdGhpcy5ob3N0LnRhZ05hbWUudG9Mb3dlckNhc2UoKVxuICAgICAgKSA9PT0gLTEgJiZcbiAgICAgICEoXG4gICAgICAgIHRoaXMuaG9zdC50YWdOYW1lID09PSAnQScgJiZcbiAgICAgICAgKHRoaXMuaG9zdC5oYXNBdHRyaWJ1dGUoJ2hyZWYnKSB8fFxuICAgICAgICAgIHRoaXMuaG9zdC5oYXNBdHRyaWJ1dGUoJ3JvdXRlcmxpbmsnKSB8fFxuICAgICAgICAgIHRoaXMuaG9zdC5nZXRBdHRyaWJ1dGUoJ25nLXJlZmxlY3Qtcm91dGVyLWxpbmsnKSlcbiAgICAgIClcbiAgICApO1xuICB9XG59XG4iXX0=