@progress/kendo-angular-inputs 21.4.1 → 22.0.0

package/esm2022/colorpicker/flatcolorpicker-header.component.mjs

@@ -1,244 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { Component, HostBinding, Input, Output, EventEmitter, ViewChild, ViewChildren, QueryList, ElementRef, Renderer2 } from '@angular/core';
-import { dropletSlashIcon, dropletSliderIcon, paletteIcon } from '@progress/kendo-svg-icons';
-import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { NgClass } from '@angular/common';
-import { ButtonComponent } from '@progress/kendo-angular-buttons';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-l10n";
-/**
- * @hidden
- */
-export class FlatColorPickerHeaderComponent {
-    localizationService;
-    renderer;
-    hostClasses = true;
-    clearButton;
-    activeView;
-    views;
-    preview;
-    innerTabIndex = -1;
-    value;
-    selection;
-    size;
-    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;
-    }
-    ngAfterViewInit() {
-        if (this.viewButtonsCollection.length > 0) {
-            this.viewButtonsCollection.forEach((button) => {
-                const buttonElem = button.nativeElement;
-                const isViewActive = buttonElem.getAttribute('aria-pressed') === 'true';
-                if (isViewActive) {
-                    this.renderer.addClass(buttonElem, 'k-selected');
-                }
-            });
-        }
-    }
-    onViewButtonClick(view) {
-        this.activeView = view;
-        this.viewChange.emit(view);
-    }
-    get viewButtons() {
-        return this.views && this.views.indexOf('gradient') >= 0 && this.views.indexOf('palette') >= 0;
-    }
-    getViewButtonIcon(view) {
-        return view === 'gradient' ? 'color-canvas' : 'palette';
-    }
-    getViewButtonsSVGIcon(view) {
-        return view === 'gradient' ? this.dropletSliderIcon : this.paletteIcon;
-    }
-    getText(text) {
-        return this.localizationService.get(text);
-    }
-    onHeaderTabOut(ev, index) {
-        if (index === 0) {
-            ev.preventDefault();
-            this.tabOut.emit(ev);
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FlatColorPickerHeaderComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FlatColorPickerHeaderComponent, isStandalone: true, selector: "[kendoFlatColorPickerHeader]", inputs: { clearButton: "clearButton", activeView: "activeView", views: "views", preview: "preview", innerTabIndex: "innerTabIndex", value: "value", selection: "selection", size: "size" }, 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">
-          @if (viewButtons) {
-            <div
-              class="k-button-group k-button-group-flat"
-              role="group"
-              >
-              @for (view of views; track view; let i = $index) {
-                <button
-                  kendoButton
-                  type="button"
-                  #viewButtons
-                  fillMode="flat"
-                  [tabindex]="innerTabIndex.toString()"
-                  (click)="onViewButtonClick(view)"
-                  [icon]="getViewButtonIcon(view)"
-                  [svgIcon]="getViewButtonsSVGIcon(view)"
-                  (keydown.shift.tab)="onHeaderTabOut($event, i)"
-                  [size]="size"
-                  [attr.title]="getText(view === 'gradient' ? 'gradientView' : 'paletteView')"
-                  [attr.aria-label]="getText(view === 'gradient' ? 'gradientView' : 'paletteView')"
-                  [attr.aria-pressed]="activeView === view"
-                  [ngClass]="activeView === view ? 'k-selected' : ''">
-                </button>
-              }
-            </div>
-          }
-        </div>
-        <div class="k-spacer"></div>
-        <div class="k-coloreditor-header-actions k-hstack">
-          @if (clearButton) {
-            <button
-              kendoButton
-              type="button"
-              [tabindex]="innerTabIndex.toString()"
-              #clearButton
-              [size]="size"
-              fillMode="flat"
-              icon="reset-color"
-              [svgIcon]="dropletSlashIcon"
-              class="k-coloreditor-reset"
-              [attr.aria-label]="getText('clearButton')"
-              [attr.title]="getText('clearButton')"
-              (click)="clearButtonClick.emit()">
-            </button>
-          }
-          @if (preview) {
-            <div class="k-coloreditor-preview k-vstack" aria-hidden="true">
-              <span
-                class="k-coloreditor-preview-color k-color-preview"
-                [attr.title]="getText('previewColor')"
-                [style.background-color]="selection">
-              </span>
-              <span class="k-coloreditor-current-color k-color-preview"
-                [style.background-color]="value"
-                [attr.title]="getText('revertSelection')"
-                (click)="valuePaneClick.emit($event)">
-              </span>
-            </div>
-          }
-        </div>
-        `, isInline: true, dependencies: [{ 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: "18.2.14", ngImport: i0, type: FlatColorPickerHeaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/component-selector
-                    selector: '[kendoFlatColorPickerHeader]',
-                    template: `
-        <div class="k-coloreditor-header-actions k-hstack">
-          @if (viewButtons) {
-            <div
-              class="k-button-group k-button-group-flat"
-              role="group"
-              >
-              @for (view of views; track view; let i = $index) {
-                <button
-                  kendoButton
-                  type="button"
-                  #viewButtons
-                  fillMode="flat"
-                  [tabindex]="innerTabIndex.toString()"
-                  (click)="onViewButtonClick(view)"
-                  [icon]="getViewButtonIcon(view)"
-                  [svgIcon]="getViewButtonsSVGIcon(view)"
-                  (keydown.shift.tab)="onHeaderTabOut($event, i)"
-                  [size]="size"
-                  [attr.title]="getText(view === 'gradient' ? 'gradientView' : 'paletteView')"
-                  [attr.aria-label]="getText(view === 'gradient' ? 'gradientView' : 'paletteView')"
-                  [attr.aria-pressed]="activeView === view"
-                  [ngClass]="activeView === view ? 'k-selected' : ''">
-                </button>
-              }
-            </div>
-          }
-        </div>
-        <div class="k-spacer"></div>
-        <div class="k-coloreditor-header-actions k-hstack">
-          @if (clearButton) {
-            <button
-              kendoButton
-              type="button"
-              [tabindex]="innerTabIndex.toString()"
-              #clearButton
-              [size]="size"
-              fillMode="flat"
-              icon="reset-color"
-              [svgIcon]="dropletSlashIcon"
-              class="k-coloreditor-reset"
-              [attr.aria-label]="getText('clearButton')"
-              [attr.title]="getText('clearButton')"
-              (click)="clearButtonClick.emit()">
-            </button>
-          }
-          @if (preview) {
-            <div class="k-coloreditor-preview k-vstack" aria-hidden="true">
-              <span
-                class="k-coloreditor-preview-color k-color-preview"
-                [attr.title]="getText('previewColor')"
-                [style.background-color]="selection">
-              </span>
-              <span class="k-coloreditor-current-color k-color-preview"
-                [style.background-color]="value"
-                [attr.title]="getText('revertSelection')"
-                (click)="valuePaneClick.emit($event)">
-              </span>
-            </div>
-          }
-        </div>
-        `,
-                    standalone: true,
-                    imports: [ButtonComponent, NgClass]
-                }]
-        }], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.Renderer2 }], propDecorators: { hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-coloreditor-header']
-            }, {
-                type: HostBinding,
-                args: ['class.k-hstack']
-            }], clearButton: [{
-                type: Input
-            }], activeView: [{
-                type: Input
-            }], views: [{
-                type: Input
-            }], preview: [{
-                type: Input
-            }], innerTabIndex: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], selection: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], viewChange: [{
-                type: Output
-            }], valuePaneClick: [{
-                type: Output
-            }], clearButtonClick: [{
-                type: Output
-            }], tabOut: [{
-                type: Output
-            }], viewButtonsCollection: [{
-                type: ViewChildren,
-                args: ['viewButtons', { read: ElementRef }]
-            }], clearButtonElement: [{
-                type: ViewChild,
-                args: ['clearButton', { read: ElementRef }]
-            }] } });