Rehberli tur API’si · Needless UI

İçe aktarma

import-tour.ts

import { NuiTour, type NuiTourStep } from '@needless-ui/angular/tour';

Rehberli bir tur.

NuiTour: Özellikler
Ad	Tür	Varsayılan	Açıklama
`steps`Girdi	`NuiTourStep[]`	`[]`	Adımlar, sırasıyla.
`open`Çift yönlü	`boolean`	`false`	Turun açık olup olmadığı.
`step`Çift yönlü	`number`	`0`	Gösterilen adım, 0’dan başlayarak.
`labels`Girdi	`Partial<NuiTourLabels>`		Gösterdiği her metin; çeviri için.
`finished`Çıktı	`void`		Son adım tamamlandığında tetiklenir.
`dismissed`Çıktı	`number`		Tur erken biterse, bittiği adımı yayar.
`start`Metot	`(from?: number) => void`		Turu ilk adımdan ya da verilen adımdan başlatır.
`end`Metot	`(finished: boolean) => void`		Turu tamamlanmış ya da yarıda bırakılmış olarak bitirir.

Turun bir adımı.

NuiTourStep: Özellikler
Ad	Tür	Varsayılan	Açıklama
`target`Özellik	`string \| Element \| (() => Element \| null)`		Adımın gösterdiği öğe. Hedef yoksa kart ortada görünür.
`title`Özellik	`string`		Kartın başlığı.
`content`Özellik	`string \| TemplateRef`		Kartın metni ya da bir şablon.
`side`Özellik	`'top' \| 'bottom' \| 'start' \| 'end'`	`'bottom'`	Kartın hedefin hangi yanına yerleşeceği.
`align`Özellik	`'start' \| 'center' \| 'end'`	`'center'`	Kartın hedefle nasıl hizalandığı.
`padding`Özellik	`number`	`8`	Spot ışığında hedefin çevresinde bırakılan boşluk, piksel cinsinden.
`interactive`Özellik	`boolean`	`false`	Kart açıkken hedef kullanılabilir.
`beforeShow`Özellik	`() => void \| Promise<void>`		Adım gösterilmeden önce çalışır. Bir promise döndürürse tur onu bekler.