@progress/kendo-angular-layout
Version:
Kendo UI for Angular Layout Package - a collection of components to create professional application layoyts
185 lines (184 loc) • 5.9 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Injectable, NgZone, ChangeDetectorRef, EventEmitter } from '@angular/core';
import { hasObservers, PreventableEvent } from '@progress/kendo-angular-common';
import { Keys } from '@progress/kendo-angular-common';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { isPresent } from '../common/util';
import * as i0 from "@angular/core";
import * as i1 from "@progress/kendo-angular-l10n";
const DEFAULT_CURRENT_STEP = 0;
const handlers = {};
handlers[Keys.ArrowLeft] = 'left';
handlers[Keys.ArrowRight] = 'right';
handlers[Keys.ArrowUp] = 'up';
handlers[Keys.ArrowDown] = 'down';
handlers[Keys.Home] = 'home';
handlers[Keys.End] = 'end';
handlers[Keys.Enter] = 'enter';
handlers[Keys.Space] = 'enter';
const handlersRTL = Object.assign({}, handlers);
handlersRTL[Keys.ArrowLeft] = 'right';
handlersRTL[Keys.ArrowRight] = 'left';
// error NG3003: One or more import cycles would need to be created to compile this component,
// which is not supported by the current compiler configuration
/**
* @hidden
*/
class StepperActivateEvent extends PreventableEvent {
/**
* The index of the activated step in the `steps` collection.
*/
index;
/**
* The activated step.
*/
step;
/**
* The DOM event that triggered the step activation.
*/
originalEvent;
/**
* The Stepper that triggered the event.
*/
sender;
/**
* @hidden
*/
constructor(args) {
super();
Object.assign(this, args);
}
}
/**
* @hidden
*/
export class StepperService {
localization;
ngZone;
changeDetector;
owner;
currentStep = DEFAULT_CURRENT_STEP;
focusedStep;
triggerValidation = new EventEmitter();
focusedStepChange = new EventEmitter();
get handlers() {
return this.localization.rtl ? handlersRTL : handlers;
}
constructor(localization, ngZone, changeDetector) {
this.localization = localization;
this.ngZone = ngZone;
this.changeDetector = changeDetector;
}
emit(event, eventArgs) {
const stepper = this.owner;
if (hasObservers(stepper[event])) {
stepper[event].emit(eventArgs);
}
return eventArgs.isDefaultPrevented();
}
onActivate(currentIdx, originalEvent) {
const eventArgs = new StepperActivateEvent({
index: currentIdx,
step: this.owner.steps[currentIdx],
originalEvent: originalEvent,
sender: this.owner
});
this.ngZone.run(() => {
if (!this.emit('activate', eventArgs)) {
this.currentStep = currentIdx;
this.owner['currentStepChange'].emit(currentIdx);
this.changeDetector.detectChanges();
}
});
}
validateSteps() {
this.triggerValidation.emit();
}
keydown(e) {
const current = this.focusedStep || this.currentStep;
const handler = this.handlers[e.keyCode];
if (!isPresent(current)) {
return;
}
if (handler) {
e.preventDefault();
this[handler](e);
}
}
left() {
if (!this.isHorizontal) {
return;
}
this.focusPrevStep();
}
right() {
if (!this.isHorizontal) {
return;
}
this.focusNextStep();
}
up() {
if (this.isHorizontal) {
return;
}
this.focusPrevStep();
}
down() {
if (this.isHorizontal) {
return;
}
this.focusNextStep();
}
home() {
this.focusedStep = 0;
this.focusedStepChange.emit();
}
end() {
this.focusedStep = this.owner.steps.length - 1;
this.focusedStepChange.emit();
}
enter(event) {
if (this.focusedStep === this.currentStep) {
return;
}
if (this.isStepDisabled(this.focusedStep)) {
return;
}
if (this.owner.linear && this.isPrevOrNextStep(this.focusedStep) === false) {
return;
}
this.onActivate(this.focusedStep, event);
}
focus(focusedIdx) {
this.focusedStep = focusedIdx;
}
focusNextStep() {
if (this.focusedStep < this.owner.steps.length) {
this.focusedStep += 1;
this.focusedStepChange.emit();
}
}
focusPrevStep() {
if (this.focusedStep > 0) {
this.focusedStep -= 1;
this.focusedStepChange.emit();
}
}
isStepDisabled(index) {
return this.owner.steps[index].disabled;
}
isPrevOrNextStep(index) {
return index === this.currentStep + 1 || index === this.currentStep - 1;
}
get isHorizontal() {
return this.owner.orientation === 'horizontal';
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepperService, deps: [{ token: i1.LocalizationService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepperService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepperService, decorators: [{
type: Injectable
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; } });