@spartacus/storefront
Version:
Spartacus Storefront is a package that you can include in your application, which allows you to add default storefront features.
53 lines • 6.96 kB
JavaScript
import { Injectable } from '@angular/core';
import { TrapFocus, } from '../keyboard-focus.model';
import { TabFocusService } from '../tab/tab-focus.service';
import * as i0 from "@angular/core";
export class TrapFocusService extends TabFocusService {
/**
* Indicates whether any of the child elements of the host are focusable.
*
* @param host `HTMLElement` that is used to query the focusable elements.
*/
hasFocusableChildren(host) {
return this.findFocusable(host).length > 0;
}
/**
* Focus the next or previous element of all available focusable elements.
* The focus is _trapped_ in case there's no next or previous available element.
* The focus will automatically move the start or end of the list.
*/
moveFocus(host, config, increment, event) {
const focusable = this.findFocusable(host);
let index = focusable.findIndex((v) => v === event.target) + increment;
const shouldMoveFocus = (index >= 0 && index < focusable.length) ||
(index < 0 && this.getTrapStart(config.trap)) ||
(index >= focusable.length && this.getTrapEnd(config.trap));
if (shouldMoveFocus) {
if (index >= focusable.length) {
index = 0;
}
if (index < 0) {
index = focusable.length - 1;
}
event.preventDefault();
event.stopPropagation();
const el = focusable[index];
el.focus();
}
}
getTrapStart(trap) {
return trap === true || trap === TrapFocus.start;
}
getTrapEnd(trap) {
return trap === true || trap === TrapFocus.end;
}
}
TrapFocusService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: TrapFocusService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
TrapFocusService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: TrapFocusService, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: TrapFocusService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJhcC1mb2N1cy5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc3RvcmVmcm9udGxpYi9sYXlvdXQvYTExeS9rZXlib2FyZC1mb2N1cy90cmFwL3RyYXAtZm9jdXMuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNDLE9BQU8sRUFFTCxTQUFTLEdBR1YsTUFBTSx5QkFBeUIsQ0FBQztBQUNqQyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7O0FBSzNELE1BQU0sT0FBTyxnQkFBaUIsU0FBUSxlQUFlO0lBQ25EOzs7O09BSUc7SUFDSCxvQkFBb0IsQ0FBQyxJQUFpQjtRQUNwQyxPQUFPLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQztJQUM3QyxDQUFDO0lBRUQ7Ozs7T0FJRztJQUNILFNBQVMsQ0FDUCxJQUFpQixFQUNqQixNQUF1QixFQUN2QixTQUFxQixFQUNyQixLQUFjO1FBRWQsTUFBTSxTQUFTLEdBQWtCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLENBQUM7UUFFMUQsSUFBSSxLQUFLLEdBQUcsU0FBUyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxLQUFLLEtBQUssQ0FBQyxNQUFNLENBQUMsR0FBRyxTQUFTLENBQUM7UUFFdkUsTUFBTSxlQUFlLEdBQ25CLENBQUMsS0FBSyxJQUFJLENBQUMsSUFBSSxLQUFLLEdBQUcsU0FBUyxDQUFDLE1BQU0sQ0FBQztZQUN4QyxDQUFDLEtBQUssR0FBRyxDQUFDLElBQUksSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDN0MsQ0FBQyxLQUFLLElBQUksU0FBUyxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBRTlELElBQUksZUFBZSxFQUFFO1lBQ25CLElBQUksS0FBSyxJQUFJLFNBQVMsQ0FBQyxNQUFNLEVBQUU7Z0JBQzdCLEtBQUssR0FBRyxDQUFDLENBQUM7YUFDWDtZQUNELElBQUksS0FBSyxHQUFHLENBQUMsRUFBRTtnQkFDYixLQUFLLEdBQUcsU0FBUyxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUM7YUFDOUI7WUFFRCxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDdkIsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1lBRXhCLE1BQU0sRUFBRSxHQUFHLFNBQVMsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUU1QixFQUFFLENBQUMsS0FBSyxFQUFFLENBQUM7U0FDWjtJQUNILENBQUM7SUFFUyxZQUFZLENBQUMsSUFBbUI7UUFDeEMsT0FBTyxJQUFJLEtBQUssSUFBSSxJQUFJLElBQUksS0FBSyxTQUFTLENBQUMsS0FBSyxDQUFDO0lBQ25ELENBQUM7SUFFUyxVQUFVLENBQUMsSUFBbUI7UUFDdEMsT0FBTyxJQUFJLEtBQUssSUFBSSxJQUFJLElBQUksS0FBSyxTQUFTLENBQUMsR0FBRyxDQUFDO0lBQ2pELENBQUM7OzZHQXJEVSxnQkFBZ0I7aUhBQWhCLGdCQUFnQixjQUZmLE1BQU07MkZBRVAsZ0JBQWdCO2tCQUg1QixVQUFVO21CQUFDO29CQUNWLFVBQVUsRUFBRSxNQUFNO2lCQUNuQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7XG4gIE1PVkVfRk9DVVMsXG4gIFRyYXBGb2N1cyxcbiAgVHJhcEZvY3VzQ29uZmlnLFxuICBUcmFwRm9jdXNUeXBlLFxufSBmcm9tICcuLi9rZXlib2FyZC1mb2N1cy5tb2RlbCc7XG5pbXBvcnQgeyBUYWJGb2N1c1NlcnZpY2UgfSBmcm9tICcuLi90YWIvdGFiLWZvY3VzLnNlcnZpY2UnO1xuXG5ASW5qZWN0YWJsZSh7XG4gIHByb3ZpZGVkSW46ICdyb290Jyxcbn0pXG5leHBvcnQgY2xhc3MgVHJhcEZvY3VzU2VydmljZSBleHRlbmRzIFRhYkZvY3VzU2VydmljZSB7XG4gIC8qKlxuICAgKiBJbmRpY2F0ZXMgd2hldGhlciBhbnkgb2YgdGhlIGNoaWxkIGVsZW1lbnRzIG9mIHRoZSBob3N0IGFyZSBmb2N1c2FibGUuXG4gICAqXG4gICAqIEBwYXJhbSBob3N0IGBIVE1MRWxlbWVudGAgdGhhdCBpcyB1c2VkIHRvIHF1ZXJ5IHRoZSBmb2N1c2FibGUgZWxlbWVudHMuXG4gICAqL1xuICBoYXNGb2N1c2FibGVDaGlsZHJlbihob3N0OiBIVE1MRWxlbWVudCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLmZpbmRGb2N1c2FibGUoaG9zdCkubGVuZ3RoID4gMDtcbiAgfVxuXG4gIC8qKlxuICAgKiBGb2N1cyB0aGUgbmV4dCBvciBwcmV2aW91cyBlbGVtZW50IG9mIGFsbCBhdmFpbGFibGUgZm9jdXNhYmxlIGVsZW1lbnRzLlxuICAgKiBUaGUgZm9jdXMgaXMgX3RyYXBwZWRfIGluIGNhc2UgdGhlcmUncyBubyBuZXh0IG9yIHByZXZpb3VzIGF2YWlsYWJsZSBlbGVtZW50LlxuICAgKiBUaGUgZm9jdXMgd2lsbCBhdXRvbWF0aWNhbGx5IG1vdmUgdGhlIHN0YXJ0IG9yIGVuZCBvZiB0aGUgbGlzdC5cbiAgICovXG4gIG1vdmVGb2N1cyhcbiAgICBob3N0OiBIVE1MRWxlbWVudCxcbiAgICBjb25maWc6IFRyYXBGb2N1c0NvbmZpZyxcbiAgICBpbmNyZW1lbnQ6IE1PVkVfRk9DVVMsXG4gICAgZXZlbnQ6IFVJRXZlbnRcbiAgKTogdm9pZCB7XG4gICAgY29uc3QgZm9jdXNhYmxlOiBIVE1MRWxlbWVudFtdID0gdGhpcy5maW5kRm9jdXNhYmxlKGhvc3QpO1xuXG4gICAgbGV0IGluZGV4ID0gZm9jdXNhYmxlLmZpbmRJbmRleCgodikgPT4gdiA9PT0gZXZlbnQudGFyZ2V0KSArIGluY3JlbWVudDtcblxuICAgIGNvbnN0IHNob3VsZE1vdmVGb2N1cyA9XG4gICAgICAoaW5kZXggPj0gMCAmJiBpbmRleCA8IGZvY3VzYWJsZS5sZW5ndGgpIHx8XG4gICAgICAoaW5kZXggPCAwICYmIHRoaXMuZ2V0VHJhcFN0YXJ0KGNvbmZpZy50cmFwKSkgfHxcbiAgICAgIChpbmRleCA+PSBmb2N1c2FibGUubGVuZ3RoICYmIHRoaXMuZ2V0VHJhcEVuZChjb25maWcudHJhcCkpO1xuXG4gICAgaWYgKHNob3VsZE1vdmVGb2N1cykge1xuICAgICAgaWYgKGluZGV4ID49IGZvY3VzYWJsZS5sZW5ndGgpIHtcbiAgICAgICAgaW5kZXggPSAwO1xuICAgICAgfVxuICAgICAgaWYgKGluZGV4IDwgMCkge1xuICAgICAgICBpbmRleCA9IGZvY3VzYWJsZS5sZW5ndGggLSAxO1xuICAgICAgfVxuXG4gICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG5cbiAgICAgIGNvbnN0IGVsID0gZm9jdXNhYmxlW2luZGV4XTtcblxuICAgICAgZWwuZm9jdXMoKTtcbiAgICB9XG4gIH1cblxuICBwcm90ZWN0ZWQgZ2V0VHJhcFN0YXJ0KHRyYXA6IFRyYXBGb2N1c1R5cGUpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdHJhcCA9PT0gdHJ1ZSB8fCB0cmFwID09PSBUcmFwRm9jdXMuc3RhcnQ7XG4gIH1cblxuICBwcm90ZWN0ZWQgZ2V0VHJhcEVuZCh0cmFwOiBUcmFwRm9jdXNUeXBlKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRyYXAgPT09IHRydWUgfHwgdHJhcCA9PT0gVHJhcEZvY3VzLmVuZDtcbiAgfVxufVxuIl19