ngx-input-color
Version:
Angular color input component and color picker (with HSL, HSV, RGB, CMYK, HEX, alpha, eye-dropper, etc)
47 lines (46 loc) • 2.42 kB
TypeScript
import { OnDestroy, ElementRef, Renderer2, ViewContainerRef, AfterViewInit, EventEmitter } from '@angular/core';
import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
import { ColorInspector } from '../models/ColorInspector.enum';
import { OutputType } from '../utils/color-helper';
import * as i0 from "@angular/core";
export declare class NgxInputColorDirective implements AfterViewInit, OnDestroy, ControlValueAccessor, Validator {
private _doc;
private el;
private renderer;
private viewContainerRef;
setInputBackgroundColor: boolean;
defaultInspector: ColorInspector;
simpleMode: boolean;
outputType: OutputType;
theme: 'light' | 'dark' | 'auto';
private boundInputHandler;
private _targetInput?;
set ngxInputColor(el: HTMLInputElement | ElementRef<HTMLInputElement> | null | undefined | '');
change: EventEmitter<string>;
private color?;
private colorPickerComponentRef?;
private backdrop?;
private colorPickerEl?;
private isHostInput;
inValid: boolean;
isDisabled: boolean;
_onChange: (value: string) => void;
_onTouched: () => void;
_onValidateChange: () => void;
constructor(_doc: Document, el: ElementRef, renderer: Renderer2, viewContainerRef: ViewContainerRef);
ngAfterViewInit(): void;
ngOnDestroy(): void;
onClick(ev: Event): void;
writeValue(value: any): void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
setDisabledState(disabled: boolean): void;
registerOnValidatorChange(fn: () => void): void;
validate(control: AbstractControl): ValidationErrors | null;
private toggleColorPicker;
setPosition(): void;
private destroyColorPicker;
private emitChange;
static ɵfac: i0.ɵɵFactoryDeclaration<NgxInputColorDirective, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<NgxInputColorDirective, "[ngxInputColor]", never, { "setInputBackgroundColor": { "alias": "setInputBackgroundColor"; "required": false; }; "defaultInspector": { "alias": "defaultInspector"; "required": false; }; "simpleMode": { "alias": "simpleMode"; "required": false; }; "outputType": { "alias": "outputType"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "ngxInputColor": { "alias": "ngxInputColor"; "required": false; }; }, { "change": "change"; }, never, never, false, never>;
}