Renk seçici API’si · Needless UI

İçe aktarma

import-color-picker.ts

import { NuiColorPicker, nuiParseColor } from '@needless-ui/angular/color-picker';

OKLCH’de çalışan bir renk seçici.

NuiColorPicker: Özellikler
Ad	Tür	Varsayılan	Açıklama
`value`Çift yönlü	`string`	`''`	Biçime göre yazılmış renk. Bir renk seçilene kadar boştur.
`format`Çift yönlü	`'hex' \| 'rgb' \| 'hsl' \| 'oklch' \| 'p3'`	`'hex'`	Değerin nasıl yazılacağı.
`formats`Girdi	`NuiColorFormat[]`	`hex, rgb, hsl, oklch`	Biçim düğmesinin sırayla dolaştığı biçimler.
`gamut`Girdi	`'srgb' \| 'p3'`	`'srgb'`	Renk alanının kapsadığı renkler: sRGB ya da Display P3.
`alpha`Girdi	`boolean`	`true`	Opaklık kaydırıcısını gösterir.
`swatches`Girdi	`NuiColorSwatch[]`	`[]`	Adlarıyla birlikte, seçilebilecek renkler.
`contrastWith`Girdi	`string`		Kontrastın denetleneceği arka plan.
`eyeDropper`Girdi	`boolean`	`true`	Tarayıcıda varsa damlalığı gösterir.
`disabled`Girdi	`boolean`	`false`	Değiştirilemez.
`labels`Girdi	`Partial<NuiColorPickerLabels>`		Seçicinin söylediği her metin; çeviri için.
`color`Özellik	`Signal<NuiColor>`		OKLCH’de seçilen renk.

Renkler için fonksiyonlar.

Helpers: Özellikler
Ad	Tür	Açıklama
`nuiParseColor`Metot	`(text: string) => NuiColor \| null`	Herhangi bir CSS sözdizimiyle yazılmış rengi okur.
`nuiFormatColor`Metot	`(color, format?) => string`	Bir rengi belirli bir biçimde yazar.
`nuiToGamut`Metot	`(color, gamut?: 'srgb' \| 'p3') => NuiColor`	Bir rengi, CSS’in yaptığı gibi sRGB ya da Display P3 gamına alır.
`nuiContrast`Metot	`(color, background) => number`	Bir rengin arka plan üzerindeki WCAG 2 kontrast oranı.