@progress/kendo-angular-inputs 17.0.0-develop.9 → 17.0.1-develop.1

package/{esm2020 → esm2022}/colorpicker/flatcolorpicker-header.component.mjs

@@ -14,18 +14,28 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class FlatColorPickerHeaderComponent {
+    localizationService;
+    renderer;
+    hostClasses = true;
+    clearButton;
+    activeView;
+    views;
+    preview;
+    innerTabIndex = -1;
+    value;
+    selection;
+    viewChange = new EventEmitter();
+    valuePaneClick = new EventEmitter();
+    clearButtonClick = new EventEmitter();
+    tabOut = new EventEmitter();
+    viewButtonsCollection;
+    clearButtonElement;
+    dropletSliderIcon = dropletSliderIcon;
+    paletteIcon = paletteIcon;
+    dropletSlashIcon = dropletSlashIcon;
     constructor(localizationService, renderer) {
         this.localizationService = localizationService;
         this.renderer = renderer;
-        this.hostClasses = true;
-        this.innerTabIndex = -1;
-        this.viewChange = new EventEmitter();
-        this.valuePaneClick = new EventEmitter();
-        this.clearButtonClick = new EventEmitter();
-        this.tabOut = new EventEmitter();
-        this.dropletSliderIcon = dropletSliderIcon;
-        this.paletteIcon = paletteIcon;
-        this.dropletSlashIcon = dropletSlashIcon;
     }
     ngAfterViewInit() {
         if (this.viewButtonsCollection.length > 0) {
@@ -60,9 +70,8 @@ export class FlatColorPickerHeaderComponent {
             this.tabOut.emit(ev);
         }
     }
-}
-FlatColorPickerHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerHeaderComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-FlatColorPickerHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FlatColorPickerHeaderComponent, isStandalone: true, selector: "[kendoFlatColorPickerHeader]", inputs: { clearButton: "clearButton", activeView: "activeView", views: "views", preview: "preview", innerTabIndex: "innerTabIndex", value: "value", selection: "selection" }, outputs: { viewChange: "viewChange", valuePaneClick: "valuePaneClick", clearButtonClick: "clearButtonClick", tabOut: "tabOut" }, host: { properties: { "class.k-coloreditor-header": "this.hostClasses", "class.k-hstack": "this.hostClasses" } }, viewQueries: [{ propertyName: "clearButtonElement", first: true, predicate: ["clearButton"], descendants: true, read: ElementRef }, { propertyName: "viewButtonsCollection", predicate: ["viewButtons"], descendants: true, read: ElementRef }], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerHeaderComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FlatColorPickerHeaderComponent, isStandalone: true, selector: "[kendoFlatColorPickerHeader]", inputs: { clearButton: "clearButton", activeView: "activeView", views: "views", preview: "preview", innerTabIndex: "innerTabIndex", value: "value", selection: "selection" }, outputs: { viewChange: "viewChange", valuePaneClick: "valuePaneClick", clearButtonClick: "clearButtonClick", tabOut: "tabOut" }, host: { properties: { "class.k-coloreditor-header": "this.hostClasses", "class.k-hstack": "this.hostClasses" } }, viewQueries: [{ propertyName: "clearButtonElement", first: true, predicate: ["clearButton"], descendants: true, read: ElementRef }, { propertyName: "viewButtonsCollection", predicate: ["viewButtons"], descendants: true, read: ElementRef }], ngImport: i0, template: `
         <div class="k-coloreditor-header-actions k-hstack">
             <div 
                 *ngIf="viewButtons" 
@@ -118,7 +127,8 @@ FlatColorPickerHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
             </div>
         </div>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerHeaderComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector

package/{esm2020 → esm2022}/colorpicker/flatcolorpicker.component.mjs

@@ -34,118 +34,25 @@ import * as i2 from "@progress/kendo-angular-l10n";
  * through a gradient that renders an hsv canvas. It supports previewing the selected color, reverting it to its previous state or clearing it completely.
  */
 export class FlatColorPickerComponent {
-    constructor(host, service, localizationService, cdr, renderer, ngZone, injector) {
-        this.host = host;
-        this.service = service;
-        this.localizationService = localizationService;
-        this.cdr = cdr;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        this.injector = injector;
-        this.hostClasses = true;
-        this.ariaRole = 'textbox';
-        /**
-         * Sets the read-only state of the FlatColorPicker.
-         *
-         * @default false
-         */
-        this.readonly = false;
-        /**
-         * Sets the disabled state of the FlatColorPicker. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_flatcolorpicker#toc-managing-the-flatcolorpicker-disabled-state-in-reactive-forms).
-         *
-         * @default false
-         */
-        this.disabled = false;
-        /**
-         * Specifies the output format of the FlatColorPicker.
-         *
-         * If the input value is in a different format, it will be parsed into the specified output `format`.
-         *
-         * The supported values are:
-         * * `rgba` (default)
-         * * `hex`
-         */
-        this.format = 'rgba';
-        /**
-         * Specifies whether the FlatColorPicker should display a 'Clear color' button.
-         *
-         * @default true
-         */
-        this.clearButton = true;
-        /**
-         * Displays `Apply` and `Cancel` action buttons and a color preview pane.
-         *
-         * When enabled, the component value will not change immediately upon
-         * color selection, but only after the `Apply` button is clicked.
-         *
-         * The `Cancel` button reverts the current selection to its
-         * initial state i.e. to the current value.
-         *
-         * @default true
-         */
-        this.preview = true;
-        /**
-         * Configures the layout of the `Apply` and `Cancel` action buttons.
-         * * `start`
-         * * `center`
-         * * `end` (default)
-         * * `stretch`
-         */
-        this.actionsLayout = 'end';
-        /**
-         * Specifies the views that will be rendered. Default value is gradient and palette.
-         */
-        this.views = ['gradient', 'palette'];
-        /**
-         * Fires each time the component value is changed.
-         */
-        this.valueChange = new EventEmitter();
-        /**
-         * Fires when the user cancels the current color selection.
-         *
-         * The event is emitted on preview pane or on 'Cancel' button click.
-         */
-        this.cancel = new EventEmitter();
-        /**
-         * Fires each time the view is about to change.
-         * Used to provide a two-way binding for the `activeView` property.
-         */
-        this.activeViewChange = new EventEmitter();
-        /**
-         * @hidden
-         * Fires each time the clear button is clicked.
-         */
-        this.clearButtonClick = new EventEmitter();
-        /**
-         * @hidden
-         */
-        this.actionButtonClick = new EventEmitter();
-        this._tabindex = 0;
-        this._gradientSettings = {
-            opacity: true,
-            delay: 0,
-            gradientSliderStep: DRAGHANDLE_MOVE_SPEED,
-            gradientSliderSmallStep: DRAGHANDLE_MOVE_SPEED_SMALL_STEP
-        };
-        this._paletteSettings = {};
-        this.subscriptions = new Subscription();
-        this.internalNavigation = false;
-        this.notifyNgChanged = () => { };
-        this.notifyNgTouched = () => { };
-        validatePackage(packageMetadata);
-        this.dynamicRTLSubscription = this.localizationService.changes.subscribe(({ rtl }) => {
-            this.direction = rtl ? 'rtl' : 'ltr';
-        });
-    }
+    host;
+    service;
+    localizationService;
+    cdr;
+    renderer;
+    ngZone;
+    injector;
+    hostClasses = true;
     get disabledClass() {
         return this.disabled;
     }
     get ariaReadonly() {
         return this.readonly;
     }
+    direction;
     get hostTabindex() {
         return this.tabindex?.toString() || '0';
     }
+    ariaRole = 'textbox';
     get isControlInvalid() {
         return (this.control?.invalid)?.toString();
     }
@@ -176,6 +83,28 @@ export class FlatColorPickerComponent {
     focusHandler(ev) {
         this.internalNavigation = ev.target !== this.host.nativeElement;
     }
+    /**
+     * Sets the read-only state of the FlatColorPicker.
+     *
+     * @default false
+     */
+    readonly = false;
+    /**
+     * Sets the disabled state of the FlatColorPicker. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_flatcolorpicker#toc-managing-the-flatcolorpicker-disabled-state-in-reactive-forms).
+     *
+     * @default false
+     */
+    disabled = false;
+    /**
+     * Specifies the output format of the FlatColorPicker.
+     *
+     * If the input value is in a different format, it will be parsed into the specified output `format`.
+     *
+     * The supported values are:
+     * * `rgba` (default)
+     * * `hex`
+     */
+    format = 'rgba';
     /**
      * Specifies the initially selected color.
      */
@@ -203,6 +132,42 @@ export class FlatColorPickerComponent {
     get tabindex() {
         return !this.disabled ? this._tabindex : undefined;
     }
+    /**
+     * Specifies whether the FlatColorPicker should display a 'Clear color' button.
+     *
+     * @default true
+     */
+    clearButton = true;
+    /**
+     * Displays `Apply` and `Cancel` action buttons and a color preview pane.
+     *
+     * When enabled, the component value will not change immediately upon
+     * color selection, but only after the `Apply` button is clicked.
+     *
+     * The `Cancel` button reverts the current selection to its
+     * initial state i.e. to the current value.
+     *
+     * @default true
+     */
+    preview = true;
+    /**
+     * Configures the layout of the `Apply` and `Cancel` action buttons.
+     * * `start`
+     * * `center`
+     * * `end` (default)
+     * * `stretch`
+     */
+    actionsLayout = 'end';
+    /**
+     * Sets the initially active view in the FlatColorPicker. The property supports two-way binding.
+     * * `gradient` (default)
+     * * `palette`
+     */
+    activeView;
+    /**
+     * Specifies the views that will be rendered. Default value is gradient and palette.
+     */
+    views = ['gradient', 'palette'];
     /**
      * Configures the gradient view.
      */
@@ -221,6 +186,54 @@ export class FlatColorPickerComponent {
     get paletteSettings() {
         return this._paletteSettings;
     }
+    /**
+     * Fires each time the component value is changed.
+     */
+    valueChange = new EventEmitter();
+    /**
+     * Fires when the user cancels the current color selection.
+     *
+     * The event is emitted on preview pane or on 'Cancel' button click.
+     */
+    cancel = new EventEmitter();
+    /**
+     * Fires each time the view is about to change.
+     * Used to provide a two-way binding for the `activeView` property.
+     */
+    activeViewChange = new EventEmitter();
+    /**
+     * @hidden
+     * Fires each time the clear button is clicked.
+     */
+    clearButtonClick = new EventEmitter();
+    /**
+     * @hidden
+     */
+    actionButtonClick = new EventEmitter();
+    header;
+    headerElement;
+    gradient;
+    gradientElement;
+    palette;
+    footer;
+    /**
+     * @hidden
+     */
+    selection;
+    focused;
+    _value;
+    _tabindex = 0;
+    _gradientSettings = {
+        opacity: true,
+        delay: 0,
+        gradientSliderStep: DRAGHANDLE_MOVE_SPEED,
+        gradientSliderSmallStep: DRAGHANDLE_MOVE_SPEED_SMALL_STEP
+    };
+    _paletteSettings = {};
+    dynamicRTLSubscription;
+    subscriptions = new Subscription();
+    internalNavigation = false;
+    control;
     /**
      * @hidden
      */
@@ -236,6 +249,19 @@ export class FlatColorPickerComponent {
         }
         return this.activeView === 'gradient' ? this.gradient : this.palette;
     }
+    constructor(host, service, localizationService, cdr, renderer, ngZone, injector) {
+        this.host = host;
+        this.service = service;
+        this.localizationService = localizationService;
+        this.cdr = cdr;
+        this.renderer = renderer;
+        this.ngZone = ngZone;
+        this.injector = injector;
+        validatePackage(packageMetadata);
+        this.dynamicRTLSubscription = this.localizationService.changes.subscribe(({ rtl }) => {
+            this.direction = rtl ? 'rtl' : 'ltr';
+        });
+    }
     ngOnInit() {
         this.selection = this.value;
         this.control = this.injector.get(NgControl, null);
@@ -467,6 +493,8 @@ export class FlatColorPickerComponent {
             throw new Error("Invalid configuration: The current activeView is not present in the views collection");
         }
     }
+    notifyNgChanged = () => { };
+    notifyNgTouched = () => { };
     initDomEvents() {
         if (!this.host) {
             return;
@@ -486,29 +514,28 @@ export class FlatColorPickerComponent {
         this.gradientElement && this.renderer.removeAttribute(this.gradientElement.nativeElement, 'role');
         this.gradientElement && this.renderer.removeAttribute(this.gradientElement.nativeElement, 'aria-label');
     }
-}
-FlatColorPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerComponent, deps: [{ token: i0.ElementRef }, { token: i1.FlatColorPickerService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-FlatColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FlatColorPickerComponent, isStandalone: true, selector: "kendo-flatcolorpicker", inputs: { readonly: "readonly", disabled: "disabled", format: "format", value: "value", tabindex: "tabindex", clearButton: "clearButton", preview: "preview", actionsLayout: "actionsLayout", activeView: "activeView", views: "views", gradientSettings: "gradientSettings", paletteSettings: "paletteSettings" }, outputs: { valueChange: "valueChange", cancel: "cancel", activeViewChange: "activeViewChange", clearButtonClick: "clearButtonClick", actionButtonClick: "actionButtonClick" }, host: { listeners: { "keydown.enter": "enterHandler($event)", "keydown.escape": "escapeHandler()", "focusin": "focusHandler($event)" }, properties: { "class.k-flatcolorpicker": "this.hostClasses", "class.k-coloreditor": "this.hostClasses", "class.k-disabled": "this.disabledClass", "attr.aria-disabled": "this.isDisabled", "attr.aria-readonly": "this.ariaReadonly", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabindex", "attr.role": "this.ariaRole", "attr.aria-invalid": "this.isControlInvalid", "class.k-readonly": "this.readonly" } }, providers: [
-        {
-            multi: true,
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => FlatColorPickerComponent)
-        },
-        {
-            provide: KendoInput,
-            useExisting: forwardRef(() => FlatColorPickerComponent)
-        },
-        FlatColorPickerService,
-        FlatColorPickerLocalizationService,
-        {
-            provide: LocalizationService,
-            useExisting: FlatColorPickerLocalizationService
-        },
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.flatcolorpicker'
-        }
-    ], viewQueries: [{ propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerElement", first: true, predicate: ["header"], descendants: true, read: ElementRef }, { propertyName: "gradient", first: true, predicate: ["gradient"], descendants: true }, { propertyName: "gradientElement", first: true, predicate: ["gradient"], descendants: true, read: ElementRef }, { propertyName: "palette", first: true, predicate: ["palette"], descendants: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true }], exportAs: ["kendoFlatColorPicker"], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerComponent, deps: [{ token: i0.ElementRef }, { token: i1.FlatColorPickerService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FlatColorPickerComponent, isStandalone: true, selector: "kendo-flatcolorpicker", inputs: { readonly: "readonly", disabled: "disabled", format: "format", value: "value", tabindex: "tabindex", clearButton: "clearButton", preview: "preview", actionsLayout: "actionsLayout", activeView: "activeView", views: "views", gradientSettings: "gradientSettings", paletteSettings: "paletteSettings" }, outputs: { valueChange: "valueChange", cancel: "cancel", activeViewChange: "activeViewChange", clearButtonClick: "clearButtonClick", actionButtonClick: "actionButtonClick" }, host: { listeners: { "keydown.enter": "enterHandler($event)", "keydown.escape": "escapeHandler()", "focusin": "focusHandler($event)" }, properties: { "class.k-flatcolorpicker": "this.hostClasses", "class.k-coloreditor": "this.hostClasses", "class.k-disabled": "this.disabledClass", "attr.aria-disabled": "this.isDisabled", "attr.aria-readonly": "this.ariaReadonly", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabindex", "attr.role": "this.ariaRole", "attr.aria-invalid": "this.isControlInvalid", "class.k-readonly": "this.readonly" } }, providers: [
+            {
+                multi: true,
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => FlatColorPickerComponent)
+            },
+            {
+                provide: KendoInput,
+                useExisting: forwardRef(() => FlatColorPickerComponent)
+            },
+            FlatColorPickerService,
+            FlatColorPickerLocalizationService,
+            {
+                provide: LocalizationService,
+                useExisting: FlatColorPickerLocalizationService
+            },
+            {
+                provide: L10N_PREFIX,
+                useValue: 'kendo.flatcolorpicker'
+            }
+        ], viewQueries: [{ propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerElement", first: true, predicate: ["header"], descendants: true, read: ElementRef }, { propertyName: "gradient", first: true, predicate: ["gradient"], descendants: true }, { propertyName: "gradientElement", first: true, predicate: ["gradient"], descendants: true, read: ElementRef }, { propertyName: "palette", first: true, predicate: ["palette"], descendants: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true }], exportAs: ["kendoFlatColorPicker"], usesOnChanges: true, ngImport: i0, template: `
         <ng-container kendoFlatColorPickerLocalizedMessages
             i18n-flatColorPickerNoColor="kendo.flatcolorpicker.flatColorPickerNoColor|The aria-label applied to the FlatColorPicker component when the value is empty."
             flatColorPickerNoColor="Flatcolorpicker no color chosen"
@@ -606,7 +633,8 @@ FlatColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
             (actionButtonClick)="onAction($event)"
             (tabOut)="firstFocusable.focus()"></div>
 `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedColorPickerMessagesDirective, selector: "[kendoColorPickerLocalizedMessages], [kendoFlatColorPickerLocalizedMessages], [kendoColorGradientLocalizedMessages], [kendoColorPaletteLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FlatColorPickerHeaderComponent, selector: "[kendoFlatColorPickerHeader]", inputs: ["clearButton", "activeView", "views", "preview", "innerTabIndex", "value", "selection"], outputs: ["viewChange", "valuePaneClick", "clearButtonClick", "tabOut"] }, { kind: "component", type: ColorGradientComponent, selector: "kendo-colorgradient", inputs: ["id", "opacity", "disabled", "readonly", "clearButton", "delay", "value", "contrastTool", "tabindex", "format", "gradientSliderStep", "gradientSliderSmallStep"], outputs: ["valueChange"], exportAs: ["kendoColorGradient"] }, { kind: "component", type: ColorPaletteComponent, selector: "kendo-colorpalette", inputs: ["id", "format", "value", "columns", "palette", "tabindex", "disabled", "readonly", "tileSize"], outputs: ["selectionChange", "valueChange", "cellSelection"], exportAs: ["kendoColorPalette"] }, { kind: "component", type: FlatColorPickerActionButtonsComponent, selector: "[kendoFlatColorPickerActionButtons]", inputs: ["innerTabIndex"], outputs: ["actionButtonClick", "tabOut"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendoFlatColorPicker',

package/{esm2020 → esm2022}/colorpicker/localization/colorgradient-localization.service.mjs

@@ -12,6 +12,7 @@ import * as i2 from "./flatcolorpicker-localization.service";
  * @hidden
  */
 export class ColorGradientLocalizationService extends LocalizationService {
+    flatColorPickerLocalization;
     constructor(prefix, messageService, _rtl, flatColorPickerLocalization) {
         super(prefix, messageService, _rtl);
         this.flatColorPickerLocalization = flatColorPickerLocalization;
@@ -22,10 +23,10 @@ export class ColorGradientLocalizationService extends LocalizationService {
         }
         return super.get(shortKey);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorGradientLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: FlatColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorGradientLocalizationService });
 }
-ColorGradientLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorGradientLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: FlatColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-ColorGradientLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorGradientLocalizationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorGradientLocalizationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorGradientLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,

package/{esm2020 → esm2022}/colorpicker/localization/colorpalette-localization.service.mjs

@@ -12,6 +12,7 @@ import * as i2 from "./flatcolorpicker-localization.service";
  * @hidden
  */
 export class ColorPaletteLocalizationService extends LocalizationService {
+    flatColorPickerLocalization;
     constructor(prefix, messageService, _rtl, flatColorPickerLocalization) {
         super(prefix, messageService, _rtl);
         this.flatColorPickerLocalization = flatColorPickerLocalization;
@@ -22,10 +23,10 @@ export class ColorPaletteLocalizationService extends LocalizationService {
         }
         return super.get(shortKey);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPaletteLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: FlatColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPaletteLocalizationService });
 }
-ColorPaletteLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPaletteLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: FlatColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-ColorPaletteLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPaletteLocalizationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPaletteLocalizationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPaletteLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,

package/{esm2020 → esm2022}/colorpicker/localization/colorpicker-localization.service.mjs

@@ -13,10 +13,10 @@ export class ColorPickerLocalizationService extends LocalizationService {
     constructor(prefix, messageService, _rtl) {
         super(prefix, messageService, _rtl);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerLocalizationService });
 }
-ColorPickerLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPickerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-ColorPickerLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPickerLocalizationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPickerLocalizationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,

package/{esm2020 → esm2022}/colorpicker/localization/custom-messages.component.mjs

@@ -11,6 +11,7 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * Custom component messages override default component messages.
  */
 export class ColorPickerCustomMessagesComponent extends ColorPickerMessages {
+    service;
     constructor(service) {
         super();
         this.service = service;
@@ -18,15 +19,15 @@ export class ColorPickerCustomMessagesComponent extends ColorPickerMessages {
     get override() {
         return true;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerCustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColorPickerCustomMessagesComponent, isStandalone: true, selector: "kendo-colorpicker-messages, kendo-flatcolorpicker-messages, kendo-colorgradient-messages, kendo-colorpalette-messages", providers: [
+            {
+                provide: ColorPickerMessages,
+                useExisting: forwardRef(() => ColorPickerCustomMessagesComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
 }
-ColorPickerCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPickerCustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-ColorPickerCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ColorPickerCustomMessagesComponent, isStandalone: true, selector: "kendo-colorpicker-messages, kendo-flatcolorpicker-messages, kendo-colorgradient-messages, kendo-colorpalette-messages", providers: [
-        {
-            provide: ColorPickerMessages,
-            useExisting: forwardRef(() => ColorPickerCustomMessagesComponent)
-        }
-    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPickerCustomMessagesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerCustomMessagesComponent, decorators: [{
             type: Component,
             args: [{
                     providers: [

package/{esm2020 → esm2022}/colorpicker/localization/flatcolorpicker-localization.service.mjs

@@ -12,6 +12,7 @@ import * as i2 from "./colorpicker-localization.service";
  * @hidden
  */
 export class FlatColorPickerLocalizationService extends LocalizationService {
+    colorPickerLocalization;
     constructor(prefix, messageService, _rtl, colorPickerLocalization) {
         super(prefix, messageService, _rtl);
         this.colorPickerLocalization = colorPickerLocalization;
@@ -22,10 +23,10 @@ export class FlatColorPickerLocalizationService extends LocalizationService {
         }
         return super.get(shortKey);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: ColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerLocalizationService });
 }
-FlatColorPickerLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: ColorPickerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-FlatColorPickerLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerLocalizationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatColorPickerLocalizationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatColorPickerLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,

package/{esm2020 → esm2022}/colorpicker/localization/localized-colorpicker-messages.directive.mjs

@@ -11,19 +11,20 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class LocalizedColorPickerMessagesDirective extends ColorPickerMessages {
+    service;
     constructor(service) {
         super();
         this.service = service;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedColorPickerMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: LocalizedColorPickerMessagesDirective, isStandalone: true, selector: "[kendoColorPickerLocalizedMessages], [kendoFlatColorPickerLocalizedMessages], [kendoColorGradientLocalizedMessages], [kendoColorPaletteLocalizedMessages]", providers: [
+            {
+                provide: ColorPickerMessages,
+                useExisting: forwardRef(() => LocalizedColorPickerMessagesDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 });
 }
-LocalizedColorPickerMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedColorPickerMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-LocalizedColorPickerMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedColorPickerMessagesDirective, isStandalone: true, selector: "[kendoColorPickerLocalizedMessages], [kendoFlatColorPickerLocalizedMessages], [kendoColorGradientLocalizedMessages], [kendoColorPaletteLocalizedMessages]", providers: [
-        {
-            provide: ColorPickerMessages,
-            useExisting: forwardRef(() => LocalizedColorPickerMessagesDirective)
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedColorPickerMessagesDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedColorPickerMessagesDirective, decorators: [{
             type: Directive,
             args: [{
                     providers: [