ng-antd-color-picker
Version:
The angular version of the color-picker component based on antd styles.
64 lines • 5.86 kB
JavaScript
import { Component, Input } from '@angular/core';
import { generateColor } from '../util/util';
import * as i0 from "@angular/core";
export class GradientComponent {
constructor() {
this.colors = [];
this.direction = 'to right';
this.type = 'hue';
this.gradientColors = '';
}
ngOnInit() {
this.useMemo();
}
ngOnChanges(changes) {
const { colors, type } = changes;
if (colors || type) {
this.useMemo();
}
}
useMemo() {
this.gradientColors = this.colors
.map((color, idx) => {
const result = generateColor(color);
if (this.type === 'alpha' && idx === this.colors.length - 1) {
result.setAlpha(1);
}
return result.toRgbString();
})
.join(',');
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.1", ngImport: i0, type: GradientComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.1", type: GradientComponent, isStandalone: true, selector: "color-gradient", inputs: { colors: "colors", direction: "direction", type: "type" }, usesOnChanges: true, ngImport: i0, template: `
<div
class="ant-color-picker-gradient"
style="position: absolute; inset: 0"
[style.background]="'linear-gradient(' + direction + ', ' + gradientColors + ')'"
>
<ng-content></ng-content>
</div>
`, isInline: true }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.1", ngImport: i0, type: GradientComponent, decorators: [{
type: Component,
args: [{
selector: 'color-gradient',
standalone: true,
template: `
<div
class="ant-color-picker-gradient"
style="position: absolute; inset: 0"
[style.background]="'linear-gradient(' + direction + ', ' + gradientColors + ')'"
>
<ng-content></ng-content>
</div>
`
}]
}], ctorParameters: () => [], propDecorators: { colors: [{
type: Input
}], direction: [{
type: Input
}], type: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JhZGllbnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctYW50ZC1jb2xvci1waWNrZXIvc3JjL2xpYi9jb21wb25lbnRzL2dyYWRpZW50LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBb0MsTUFBTSxlQUFlLENBQUM7QUFJbkYsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGNBQWMsQ0FBQzs7QUFlN0MsTUFBTSxPQUFPLGlCQUFpQjtJQU81QjtRQU5TLFdBQU0sR0FBdUIsRUFBRSxDQUFDO1FBQ2hDLGNBQVMsR0FBVyxVQUFVLENBQUM7UUFDL0IsU0FBSSxHQUFrQixLQUFLLENBQUM7UUFFckMsbUJBQWMsR0FBVyxFQUFFLENBQUM7SUFFYixDQUFDO0lBRWhCLFFBQVE7UUFDTixJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDakIsQ0FBQztJQUVELFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxNQUFNLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxHQUFHLE9BQU8sQ0FBQztRQUNqQyxJQUFJLE1BQU0sSUFBSSxJQUFJLEVBQUU7WUFDbEIsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1NBQ2hCO0lBQ0gsQ0FBQztJQUVELE9BQU87UUFDTCxJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQyxNQUFNO2FBQzlCLEdBQUcsQ0FBQyxDQUFDLEtBQUssRUFBRSxHQUFHLEVBQUUsRUFBRTtZQUNsQixNQUFNLE1BQU0sR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDcEMsSUFBSSxJQUFJLENBQUMsSUFBSSxLQUFLLE9BQU8sSUFBSSxHQUFHLEtBQUssSUFBSSxDQUFDLE1BQU0sQ0FBQyxNQUFNLEdBQUcsQ0FBQyxFQUFFO2dCQUMzRCxNQUFNLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDO2FBQ3BCO1lBQ0QsT0FBTyxNQUFNLENBQUMsV0FBVyxFQUFFLENBQUM7UUFDOUIsQ0FBQyxDQUFDO2FBQ0QsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ2YsQ0FBQzs4R0E5QlUsaUJBQWlCO2tHQUFqQixpQkFBaUIsbUtBVmxCOzs7Ozs7OztHQVFUOzsyRkFFVSxpQkFBaUI7a0JBYjdCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGdCQUFnQjtvQkFDMUIsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLFFBQVEsRUFBRTs7Ozs7Ozs7R0FRVDtpQkFDRjt3REFFVSxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkNoYW5nZXMsIE9uSW5pdCwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL2ludGVyZmFjZXMvY29sb3InO1xuaW1wb3J0IHsgSHNiYUNvbG9yVHlwZSB9IGZyb20gJy4uL2ludGVyZmFjZXMvdHlwZSc7XG5pbXBvcnQgeyBnZW5lcmF0ZUNvbG9yIH0gZnJvbSAnLi4vdXRpbC91dGlsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY29sb3ItZ3JhZGllbnQnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwiYW50LWNvbG9yLXBpY2tlci1ncmFkaWVudFwiXG4gICAgICBzdHlsZT1cInBvc2l0aW9uOiBhYnNvbHV0ZTsgaW5zZXQ6IDBcIlxuICAgICAgW3N0eWxlLmJhY2tncm91bmRdPVwiJ2xpbmVhci1ncmFkaWVudCgnICsgZGlyZWN0aW9uICsgJywgJyArIGdyYWRpZW50Q29sb3JzICsgJyknXCJcbiAgICA+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG4gIGBcbn0pXG5leHBvcnQgY2xhc3MgR3JhZGllbnRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIGNvbG9yczogQ29sb3JbXSB8IHN0cmluZ1tdID0gW107XG4gIEBJbnB1dCgpIGRpcmVjdGlvbjogc3RyaW5nID0gJ3RvIHJpZ2h0JztcbiAgQElucHV0KCkgdHlwZTogSHNiYUNvbG9yVHlwZSA9ICdodWUnO1xuXG4gIGdyYWRpZW50Q29sb3JzOiBzdHJpbmcgPSAnJztcblxuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy51c2VNZW1vKCk7XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgY29uc3QgeyBjb2xvcnMsIHR5cGUgfSA9IGNoYW5nZXM7XG4gICAgaWYgKGNvbG9ycyB8fCB0eXBlKSB7XG4gICAgICB0aGlzLnVzZU1lbW8oKTtcbiAgICB9XG4gIH1cblxuICB1c2VNZW1vKCk6IHZvaWQge1xuICAgIHRoaXMuZ3JhZGllbnRDb2xvcnMgPSB0aGlzLmNvbG9yc1xuICAgICAgLm1hcCgoY29sb3IsIGlkeCkgPT4ge1xuICAgICAgICBjb25zdCByZXN1bHQgPSBnZW5lcmF0ZUNvbG9yKGNvbG9yKTtcbiAgICAgICAgaWYgKHRoaXMudHlwZSA9PT0gJ2FscGhhJyAmJiBpZHggPT09IHRoaXMuY29sb3JzLmxlbmd0aCAtIDEpIHtcbiAgICAgICAgICByZXN1bHQuc2V0QWxwaGEoMSk7XG4gICAgICAgIH1cbiAgICAgICAgcmV0dXJuIHJlc3VsdC50b1JnYlN0cmluZygpO1xuICAgICAgfSlcbiAgICAgIC5qb2luKCcsJyk7XG4gIH1cbn1cbiJdfQ==