@progress/kendo-angular-inputs 17.0.0-develop.4 → 17.0.0-develop.40

package/{esm2020 → esm2022}/slider/slider.component.mjs

@@ -27,96 +27,43 @@ const PRESSED = 'k-pressed';
  * Represents the [Kendo UI Slider component for Angular]({% slug overview_slider %}).
  */
 export class SliderComponent extends SliderBase {
-    constructor(localization, injector, renderer, ngZone, changeDetector, hostElement) {
-        super(localization, injector, renderer, ngZone, changeDetector, hostElement);
-        this.localization = localization;
-        this.injector = injector;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        this.changeDetector = changeDetector;
-        this.hostElement = hostElement;
-        /**
-         * @hidden
-         */
-        this.focusableId = `k-${guid()}`;
-        /**
-         * Determines if the animation will be played on value change.
-         * Regardless of this setting, no animation will be played during the initial rendering.
-         */
-        this.animate = true;
-        /**
-         * Renders the arrow side buttons of the Slider ([see example]({% slug sidebuttons_slider %}#toc-hidden-state)).
-         * When `showButtons` is set to `false`, the buttons are not displayed.
-         */
-        this.showButtons = true;
-        /**
-         * The current value of the Slider when it is initially displayed.
-         * The component can use either NgModel or the `value` binding but not both of them at the same time.
-         */
-        this.value = this.min;
-        /**
-         * @hidden
-         */
-        this.arrowUpIcon = caretAltUpIcon;
-        /**
-         * @hidden
-         */
-        this.arrowDownIcon = caretAltDownIcon;
-        /**
-         * @hidden
-         */
-        this.arrowLeftIcon = caretAltLeftIcon;
-        /**
-         * @hidden
-         */
-        this.arrowRightIcon = caretAltRightIcon;
-        this.focusChangedProgrammatically = false;
-        /**
-         * @hidden
-         */
-        this.onWrapClick = (args) => {
-            const target = args.target;
-            if (!this.isDisabled && !(target.closest('.k-button'))) {
-                const value = eventValue(args, this.track.nativeElement, this.getProps());
-                this.changeValue(value);
-            }
-            invokeElementMethod(this.draghandle, 'focus');
-        };
-        /**
-         * @hidden
-         */
-        this.onKeyDown = (e) => {
-            const options = this.getProps();
-            const { max, min } = options;
-            const handler = this.keyBinding[e.keyCode];
-            if (this.isDisabled || !handler) {
-                return;
-            }
-            const value = handler(options);
-            this.changeValue(trimValue(max, min, value));
-            e.preventDefault();
-        };
-        this.ngChange = (_) => { };
-        this.ngTouched = () => { };
-        this.decreaseValue = () => {
-            this.changeValue(decreaseValueToStep(this.value, this.getProps()));
-        };
-        this.increaseValue = () => {
-            this.changeValue(increaseValueToStep(this.value, this.getProps()));
-        };
-        this.handleBlur = () => {
-            this.changeDetector.markForCheck();
-            this.focused = false;
-            if (hasObservers(this.onBlur) || requiresZoneOnBlur(this.control)) {
-                this.ngZone.run(() => {
-                    this.ngTouched();
-                    if (!this.focusChangedProgrammatically) {
-                        this.onBlur.emit();
-                    }
-                });
-            }
-        };
-    }
+    localization;
+    injector;
+    renderer;
+    ngZone;
+    changeDetector;
+    hostElement;
+    /**
+     * @hidden
+     */
+    focusableId = `k-${guid()}`;
+    /**
+     * Changes the `title` attribute of the drag handle so that it can be localized.
+     */
+    dragHandleTitle;
+    /**
+     * Sets the title of the **Increase** button of the Slider ([see example]({% slug sidebuttons_slider %}#toc-titles)).
+     */
+    incrementTitle;
+    /**
+     * Determines if the animation will be played on value change.
+     * Regardless of this setting, no animation will be played during the initial rendering.
+     */
+    animate = true;
+    /**
+     * Sets the title of the **Decrease** button of the Slider ([see example]({% slug sidebuttons_slider %}#toc-titles)).
+     */
+    decrementTitle;
+    /**
+     * Renders the arrow side buttons of the Slider ([see example]({% slug sidebuttons_slider %}#toc-hidden-state)).
+     * When `showButtons` is set to `false`, the buttons are not displayed.
+     */
+    showButtons = true;
+    /**
+     * The current value of the Slider when it is initially displayed.
+     * The component can use either NgModel or the `value` binding but not both of them at the same time.
+     */
+    value = this.min;
     /**
      * @hidden
      */
@@ -132,6 +79,36 @@ export class SliderComponent extends SliderBase {
     get currentValue() {
         return isPresent(this.value) ? this.value.toString() : '';
     }
+    /**
+     * @hidden
+     */
+    arrowUpIcon = caretAltUpIcon;
+    /**
+     * @hidden
+     */
+    arrowDownIcon = caretAltDownIcon;
+    /**
+     * @hidden
+     */
+    arrowLeftIcon = caretAltLeftIcon;
+    /**
+     * @hidden
+     */
+    arrowRightIcon = caretAltRightIcon;
+    draghandle;
+    decreaseButton;
+    increaseButton;
+    focusChangedProgrammatically = false;
+    isInvalid;
+    constructor(localization, injector, renderer, ngZone, changeDetector, hostElement) {
+        super(localization, injector, renderer, ngZone, changeDetector, hostElement);
+        this.localization = localization;
+        this.injector = injector;
+        this.renderer = renderer;
+        this.ngZone = ngZone;
+        this.changeDetector = changeDetector;
+        this.hostElement = hostElement;
+    }
     /**
      * Focuses the Slider.
      *
@@ -210,6 +187,17 @@ export class SliderComponent extends SliderBase {
     get dragHandleMessage() {
         return this.dragHandleTitle || this.localizationService.get('dragHandle');
     }
+    /**
+     * @hidden
+     */
+    onWrapClick = (args) => {
+        const target = args.target;
+        if (!this.isDisabled && !(target.closest('.k-button'))) {
+            const value = eventValue(args, this.track.nativeElement, this.getProps());
+            this.changeValue(value);
+        }
+        invokeElementMethod(this.draghandle, 'focus');
+    };
     /**
      * @hidden
      */
@@ -226,6 +214,20 @@ export class SliderComponent extends SliderBase {
         this.dragging = true;
         this.changeValue(eventValue(args, this.track.nativeElement, this.getProps()));
     }
+    /**
+     * @hidden
+     */
+    onKeyDown = (e) => {
+        const options = this.getProps();
+        const { max, min } = options;
+        const handler = this.keyBinding[e.keyCode];
+        if (this.isDisabled || !handler) {
+            return;
+        }
+        const value = handler(options);
+        this.changeValue(trimValue(max, min, value));
+        e.preventDefault();
+    };
     /**
      * @hidden
      */
@@ -335,6 +337,14 @@ export class SliderComponent extends SliderBase {
             this.subscriptions.add(subscription);
         });
     }
+    ngChange = (_) => { };
+    ngTouched = () => { };
+    decreaseValue = () => {
+        this.changeValue(decreaseValueToStep(this.value, this.getProps()));
+    };
+    increaseValue = () => {
+        this.changeValue(increaseValueToStep(this.value, this.getProps()));
+    };
     getProps() {
         return {
             buttons: this.showButtons,
@@ -404,6 +414,18 @@ export class SliderComponent extends SliderBase {
             }));
         });
     }
+    handleBlur = () => {
+        this.changeDetector.markForCheck();
+        this.focused = false;
+        if (hasObservers(this.onBlur) || requiresZoneOnBlur(this.control)) {
+            this.ngZone.run(() => {
+                this.ngTouched();
+                if (!this.focusChangedProgrammatically) {
+                    this.onBlur.emit();
+                }
+            });
+        }
+    };
     get decreaseButtonArrowIcon() {
         const icon = !this.vertical ?
             this.direction === 'ltr' ?
@@ -436,14 +458,13 @@ export class SliderComponent extends SliderBase {
             this.arrowUpIcon;
         return icon;
     }
-}
-SliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-SliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SliderComponent, isStandalone: true, selector: "kendo-slider", inputs: { focusableId: "focusableId", dragHandleTitle: "dragHandleTitle", incrementTitle: "incrementTitle", animate: "animate", decrementTitle: "decrementTitle", showButtons: "showButtons", value: "value", tabIndex: "tabIndex" }, providers: [
-        LocalizationService,
-        { provide: L10N_PREFIX, useValue: 'kendo.slider' },
-        { multi: true, provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SliderComponent) },
-        { provide: KendoInput, useExisting: forwardRef(() => SliderComponent) }
-    ], viewQueries: [{ propertyName: "draghandle", first: true, predicate: ["draghandle"], descendants: true, static: true }, { propertyName: "decreaseButton", first: true, predicate: ["decreaseButton"], descendants: true, read: ElementRef }, { propertyName: "increaseButton", first: true, predicate: ["increaseButton"], descendants: true, read: ElementRef }], exportAs: ["kendoSlider"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SliderComponent, isStandalone: true, selector: "kendo-slider", inputs: { focusableId: "focusableId", dragHandleTitle: "dragHandleTitle", incrementTitle: "incrementTitle", animate: "animate", decrementTitle: "decrementTitle", showButtons: "showButtons", value: "value", tabIndex: "tabIndex" }, providers: [
+            LocalizationService,
+            { provide: L10N_PREFIX, useValue: 'kendo.slider' },
+            { multi: true, provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SliderComponent) },
+            { provide: KendoInput, useExisting: forwardRef(() => SliderComponent) }
+        ], viewQueries: [{ propertyName: "draghandle", first: true, predicate: ["draghandle"], descendants: true, static: true }, { propertyName: "decreaseButton", first: true, predicate: ["decreaseButton"], descendants: true, read: ElementRef }, { propertyName: "increaseButton", first: true, predicate: ["increaseButton"], descendants: true, read: ElementRef }], exportAs: ["kendoSlider"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
         <ng-container kendoSliderLocalizedMessages
             i18n-increment="kendo.slider.increment|The title of the **Increase** button of the Slider."
             increment="increment"
@@ -523,8 +544,9 @@ SliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
             aria-hidden="true"
         ></button>
         <kendo-resize-sensor (resize)="sizeComponent(false)"></kendo-resize-sensor>
-  `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedSliderMessagesDirective, selector: "[kendoSliderLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: SliderTicksComponent, selector: "[kendoSliderTicks]", inputs: ["tickTitle", "vertical", "step", "largeStep", "min", "max", "labelTemplate"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderComponent, decorators: [{
+  `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedSliderMessagesDirective, selector: "[kendoSliderLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: SliderTicksComponent, selector: "[kendoSliderTicks]", inputs: ["tickTitle", "vertical", "step", "largeStep", "min", "max", "labelTemplate"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendoSlider',

package/{esm2020 → esm2022}/slider.module.mjs

@@ -45,11 +45,11 @@ import * as i3 from "./sliders-common/label-template.directive";
  * ```
  */
 export class SliderModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SliderModule, imports: [i1.SliderComponent, i2.SliderCustomMessagesComponent, i3.LabelTemplateDirective], exports: [i1.SliderComponent, i2.SliderCustomMessagesComponent, i3.LabelTemplateDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderModule, providers: [IconsService, PopupService, ResizeBatchService], imports: [i1.SliderComponent] });
 }
-SliderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SliderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: SliderModule, imports: [i1.SliderComponent, i2.SliderCustomMessagesComponent, i3.LabelTemplateDirective], exports: [i1.SliderComponent, i2.SliderCustomMessagesComponent, i3.LabelTemplateDirective] });
-SliderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderModule, providers: [IconsService, PopupService, ResizeBatchService], imports: [i1.SliderComponent, i2.SliderCustomMessagesComponent] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...KENDO_SLIDER],

package/{esm2020 → esm2022}/sliders-common/label-template.directive.mjs

@@ -29,13 +29,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class LabelTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LabelTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: LabelTemplateDirective, isStandalone: true, selector: "[kendoSliderLabelTemplate]", ngImport: i0 });
 }
-LabelTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LabelTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-LabelTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LabelTemplateDirective, isStandalone: true, selector: "[kendoSliderLabelTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LabelTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LabelTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSliderLabelTemplate]',

package/{esm2020 → esm2022}/sliders-common/slider-base.mjs

@@ -17,6 +17,107 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class SliderBase {
+    localizationService;
+    injector;
+    renderer;
+    ngZone;
+    changeDetector;
+    hostElement;
+    /**
+     * Defines the title of the ticks ([see example]({% slug ticks_slider %}#toc-titles)). The default title
+     * for each tick is its Slider value. If you use a callback function, the function accepts an argument
+     * that holds the value of the component and returns a string with the new title.
+     */
+    title = identity;
+    /**
+     * Denotes the location of the tick marks in the Slider ([see example]({% slug ticks_slider %}#toc-placement)).
+     *
+     * The available options are:
+     * * `before`—The tick marks are located to the top side of the horizontal track or to the left side of a vertical track.
+     * * `after`—The tick marks are located to the bottom side of the horizontal track or to the right side of the vertical track.
+     * * `both`— (Default) The tick marks are located on both sides of the track.
+     * * `none`—The tick marks are not visible. The actual elements are not added to the DOM tree.
+     */
+    tickPlacement = 'both';
+    /**
+     * If `vertical` is set to `true`, the orientation of the Slider changes from horizontal to vertical
+     * ([see example]({% slug orientation_slider %})).
+     */
+    vertical = false;
+    /**
+     * The minimum value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
+     * The attribute accepts both integers and floating-point numbers.
+     */
+    min = 0;
+    /**
+     * The maximum value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
+     * The attribute accepts both integers and floating-point numbers.
+     */
+    max = 10;
+    /**
+     * The step value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
+     * Accepts positive values only. Can be an integer or a floating-point number.
+     */
+    smallStep = 1;
+    /**
+     * Specifies that every n<sup>th</sup> tick will be large and will have a label
+     * ([see example]({% slug predefinedsteps_slider %}#toc-large-steps)).
+     * Accepts positive integer values only.
+     */
+    largeStep = null;
+    /**
+     * Sets the width between each two ticks along the track ([see example]({% slug ticks_slider %}#toc-width)). The value
+     * has to be set in pixels. If no `fixedTickWidth` is provided, the Slider automatically adjusts the tick width to
+     * accommodate the elements within the size of the component.
+     */
+    fixedTickWidth;
+    /**
+     * Determines whether the Slider is disabled ([see example]({% slug disabledstate_slider %})). To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_slider#toc-managing-the-slider-disabled-state-in-reactive-forms).
+     */
+    disabled = false;
+    /**
+     * Determines whether the Slider is in its read-only state ([see example]({% slug readonly_slider %})).
+     *
+     * @default false
+     */
+    readonly = false;
+    /**
+     * Specifies the [tabindex](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the Slider.
+     */
+    tabindex = 0;
+    /**
+     * Fires each time the user focuses the component.
+     */
+    onFocus = new EventEmitter();
+    /**
+     * Fires each time the component is blurred.
+     */
+    onBlur = new EventEmitter();
+    /**
+     * Fires each time the user selects a new value.
+     */
+    valueChange = new EventEmitter();
+    direction;
+    get horizontalClass() {
+        return !this.vertical;
+    }
+    get verticalClass() {
+        return this.vertical;
+    }
+    sliderClass = true;
+    get disabledClass() {
+        return this.disabled;
+    }
+    wrapper;
+    track;
+    sliderSelection;
+    ticksContainer;
+    ticks;
+    labelTemplate;
+    subscriptions = new Subscription();
+    isFocused;
+    isDragged;
+    control;
     constructor(localizationService, injector, renderer, ngZone, changeDetector, hostElement) {
         this.localizationService = localizationService;
         this.injector = injector;
@@ -24,96 +125,9 @@ export class SliderBase {
         this.ngZone = ngZone;
         this.changeDetector = changeDetector;
         this.hostElement = hostElement;
-        /**
-         * Defines the title of the ticks ([see example]({% slug ticks_slider %}#toc-titles)). The default title
-         * for each tick is its Slider value. If you use a callback function, the function accepts an argument
-         * that holds the value of the component and returns a string with the new title.
-         */
-        this.title = identity;
-        /**
-         * Denotes the location of the tick marks in the Slider ([see example]({% slug ticks_slider %}#toc-placement)).
-         *
-         * The available options are:
-         * * `before`&mdash;The tick marks are located to the top side of the horizontal track or to the left side of a vertical track.
-         * * `after`&mdash;The tick marks are located to the bottom side of the horizontal track or to the right side of the vertical track.
-         * * `both`&mdash; (Default) The tick marks are located on both sides of the track.
-         * * `none`&mdash;The tick marks are not visible. The actual elements are not added to the DOM tree.
-         */
-        this.tickPlacement = 'both';
-        /**
-         * If `vertical` is set to `true`, the orientation of the Slider changes from horizontal to vertical
-         * ([see example]({% slug orientation_slider %})).
-         */
-        this.vertical = false;
-        /**
-         * The minimum value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
-         * The attribute accepts both integers and floating-point numbers.
-         */
-        this.min = 0;
-        /**
-         * The maximum value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
-         * The attribute accepts both integers and floating-point numbers.
-         */
-        this.max = 10;
-        /**
-         * The step value of the Slider ([see example]({% slug predefinedsteps_slider %}#toc-small-steps)).
-         * Accepts positive values only. Can be an integer or a floating-point number.
-         */
-        this.smallStep = 1;
-        /**
-         * Specifies that every n<sup>th</sup> tick will be large and will have a label
-         * ([see example]({% slug predefinedsteps_slider %}#toc-large-steps)).
-         * Accepts positive integer values only.
-         */
-        this.largeStep = null;
-        /**
-         * Determines whether the Slider is disabled ([see example]({% slug disabledstate_slider %})). To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_slider#toc-managing-the-slider-disabled-state-in-reactive-forms).
-         */
-        this.disabled = false;
-        /**
-         * Determines whether the Slider is in its read-only state ([see example]({% slug readonly_slider %})).
-         *
-         * @default false
-         */
-        this.readonly = false;
-        /**
-         * Specifies the [tabindex](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the Slider.
-         */
-        this.tabindex = 0;
-        /**
-         * Fires each time the user focuses the component.
-         */
-        this.onFocus = new EventEmitter();
-        /**
-         * Fires each time the component is blurred.
-         */
-        this.onBlur = new EventEmitter();
-        /**
-         * Fires each time the user selects a new value.
-         */
-        this.valueChange = new EventEmitter();
-        this.sliderClass = true;
-        this.subscriptions = new Subscription();
-        /**
-         * @hidden
-         */
-        this.ifEnabled = (callback, event) => {
-            if (!this.isDisabled) {
-                callback.call(this, event);
-            }
-        };
         validatePackage(packageMetadata);
         this.direction = localizationService.rtl ? 'rtl' : 'ltr';
     }
-    get horizontalClass() {
-        return !this.vertical;
-    }
-    get verticalClass() {
-        return this.vertical;
-    }
-    get disabledClass() {
-        return this.disabled;
-    }
     /**
      * @hidden
      * Called when the status of the component changes to or from `disabled`.
@@ -143,6 +157,14 @@ export class SliderBase {
     get isDisabled() {
         return this.disabled || this.readonly;
     }
+    /**
+     * @hidden
+     */
+    ifEnabled = (callback, event) => {
+        if (!this.isDisabled) {
+            callback.call(this, event);
+        }
+    };
     /**
      * @hidden
      * Used by the FloatingLabel to determine if the component is empty.
@@ -182,10 +204,10 @@ export class SliderBase {
             }
         });
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderBase, deps: [{ token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SliderBase, selector: "kendo-slider-base", inputs: { title: "title", tickPlacement: "tickPlacement", vertical: "vertical", min: "min", max: "max", smallStep: "smallStep", largeStep: "largeStep", fixedTickWidth: "fixedTickWidth", disabled: "disabled", readonly: "readonly", tabindex: "tabindex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-slider-horizontal": "this.horizontalClass", "class.k-slider-vertical": "this.verticalClass", "class.k-slider": "this.sliderClass", "class.k-disabled": "this.disabledClass" } }, queries: [{ propertyName: "labelTemplate", first: true, predicate: LabelTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrap"], descendants: true, static: true }, { propertyName: "track", first: true, predicate: ["track"], descendants: true, static: true }, { propertyName: "sliderSelection", first: true, predicate: ["sliderSelection"], descendants: true, static: true }, { propertyName: "ticksContainer", first: true, predicate: ["ticks"], descendants: true, read: ElementRef }, { propertyName: "ticks", first: true, predicate: ["ticks"], descendants: true }], ngImport: i0, template: ``, isInline: true });
 }
-SliderBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderBase, deps: [{ token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-SliderBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SliderBase, selector: "kendo-slider-base", inputs: { title: "title", tickPlacement: "tickPlacement", vertical: "vertical", min: "min", max: "max", smallStep: "smallStep", largeStep: "largeStep", fixedTickWidth: "fixedTickWidth", disabled: "disabled", readonly: "readonly", tabindex: "tabindex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-slider-horizontal": "this.horizontalClass", "class.k-slider-vertical": "this.verticalClass", "class.k-slider": "this.sliderClass", "class.k-disabled": "this.disabledClass" } }, queries: [{ propertyName: "labelTemplate", first: true, predicate: LabelTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrap"], descendants: true, static: true }, { propertyName: "track", first: true, predicate: ["track"], descendants: true, static: true }, { propertyName: "sliderSelection", first: true, predicate: ["sliderSelection"], descendants: true, static: true }, { propertyName: "ticksContainer", first: true, predicate: ["ticks"], descendants: true, read: ElementRef }, { propertyName: "ticks", first: true, predicate: ["ticks"], descendants: true }], ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderBase, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-slider-base',

package/{esm2020 → esm2022}/sliders-common/slider-model.base.mjs

@@ -9,6 +9,12 @@ import { isPresent } from '../common/utils';
  * @hidden
  */
 export class SliderModelBase {
+    props;
+    wrapper;
+    track;
+    renderer;
+    button;
+    tickSizes;
     constructor(props, wrapper, track, renderer, button) {
         this.props = props;
         this.wrapper = wrapper;

package/{esm2020 → esm2022}/sliders-common/slider-ticks.component.mjs

@@ -11,21 +11,29 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 class SliderTick {
+    value;
+    classes = {
+        'k-tick': true
+    };
+    large;
     constructor(value) {
         this.value = value;
-        this.classes = {
-            'k-tick': true
-        };
     }
 }
 /**
  * @hidden
  */
 export class SliderTicksComponent {
-    constructor() {
-        this.wrapperClasses = 'k-reset k-slider-items';
-        this.ticks = [];
-    }
+    wrapperClasses = 'k-reset k-slider-items';
+    tickTitle;
+    vertical;
+    step;
+    largeStep;
+    min;
+    max;
+    labelTemplate;
+    tickElements;
+    ticks = [];
     ngOnChanges(_) {
         this.createTicks();
     }
@@ -57,9 +65,8 @@ export class SliderTicksComponent {
             'k-last': (!first && !this.vertical) || (first && this.vertical)
         };
     }
-}
-SliderTicksComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderTicksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SliderTicksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SliderTicksComponent, isStandalone: true, selector: "[kendoSliderTicks]", inputs: { tickTitle: "tickTitle", vertical: "vertical", step: "step", largeStep: "largeStep", min: "min", max: "max", labelTemplate: "labelTemplate" }, host: { properties: { "class": "this.wrapperClasses" } }, viewQueries: [{ propertyName: "tickElements", predicate: ["tickElement"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderTicksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SliderTicksComponent, isStandalone: true, selector: "[kendoSliderTicks]", inputs: { tickTitle: "tickTitle", vertical: "vertical", step: "step", largeStep: "largeStep", min: "min", max: "max", labelTemplate: "labelTemplate" }, host: { properties: { "class": "this.wrapperClasses" } }, viewQueries: [{ propertyName: "tickElements", predicate: ["tickElement"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
     <li #tickElement *ngFor="let tick of ticks;"
         [ngClass]="tick.classes"
         title="{{ tickTitle(tick.value) }}"
@@ -78,7 +85,8 @@ SliderTicksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
         {{ tickTitle(value) }}
      </ng-template>
   `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SliderTicksComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderTicksComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoSliderTicks]',

package/{esm2020 → esm2022}/switch/events/blur-event.mjs

@@ -6,4 +6,8 @@
  * Arguments for the `blur` event of the Switch component.
  */
 export class SwitchBlurEvent {
+    /**
+     * The original DOM [`blur`](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event) event.
+     */
+    originalEvent;
 }

package/{esm2020 → esm2022}/switch/events/focus-event.mjs

@@ -6,4 +6,8 @@
  * Arguments for the `focus` event of the Switch component.
  */
 export class SwitchFocusEvent {
+    /**
+     * The original DOM [`focus`](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event) event.
+     */
+    originalEvent;
 }