# Tour Компонент для проведения пошагового обучения пользователя ( `onboarding` ) по элементам интерфейса. Позволяет подсвечивать нужные элементы и показывать рядом с ними подсказки. Props (свойства) для компонента Tour: [{"name":"view","type":{"name":"enum","raw":"\"default\"","value":[{"value":"\"default\""}]}},{"name":"size","type":{"name":"enum","raw":"\"s\"","value":[{"value":"\"s\""}]}},{"name":"steps","type":{"name":"TourStep[]"}},{"name":"current","type":{"name":"number"}},{"name":"defaultCurrent","type":{"name":"number"}},{"name":"open","type":{"name":"boolean"}},{"name":"defaultOpen","type":{"name":"boolean"}},{"name":"onChange","type":{"name":"((current: number) => void)"}},{"name":"renderStep","type":{"name":"(current: number, length: number, last: boolean, step: TourStep) => ReactNode"}},{"name":"onClose","type":{"name":"(() => void)"}},{"name":"withOverlay","type":{"name":"boolean"}},{"name":"zIndex","type":{"name":"ZIndex"}},{"name":"offset","type":{"name":"[number, number]"}},{"name":"highlightOffset","type":{"name":"number"}},{"name":"overlayColor","type":{"name":"Color"}}] Компонент является полностью контролируемым. Для его работы необходимо управлять состоянием видимости ( `open` ) и текущим шагом ( `current` ) извне. Ключевым параметром является массив  `steps` . Каждый элемент этого массива — это объект, описывающий один шаг тура. 
## Пример В примере ниже показано, как создать тур по нескольким элементам на странице. Управление состоянием (текущий шаг, открыт/закрыт тур) осуществляется с помощью хуков  `useState`  и  `useRef` .