/** * Helper функции для упрощения работы с темплейтами воронки * * Эти функции помогают избежать дублирования кода при создании props * для TemplateLayout компонента */ import type { ScreenDefinition, TypographyVariant } from "./types"; import { TEMPLATE_DEFAULTS, TEMPLATE_DEFAULTS_CENTERED, } from "@/components/funnel/templates/constants"; /** * Тип preset для быстрого выбора стиля темплейта */ export type TemplatePreset = "left" | "center"; /** * Конфигурация action кнопки для темплейта */ export interface ActionButtonConfig { children?: React.ReactNode; defaultText: string; disabled: boolean; onClick: () => void; } /** * Опции для создания props темплейта */ export interface CreateTemplateLayoutOptions { /** * Preset стиля: 'left' (по умолчанию) или 'center' */ preset?: TemplatePreset; /** * Конфигурация action кнопки внизу экрана */ actionButton?: ActionButtonConfig; /** * Кастомные defaults для title (переопределяют preset) */ titleDefaults?: Partial; /** * Кастомные defaults для subtitle (переопределяют preset) */ subtitleDefaults?: Partial; /** * Контент над заголовком (иконки, изображения) */ childrenAboveTitle?: React.ReactNode; /** * Контент над кнопкой (выбранная дата, дополнительная информация) */ childrenAboveButton?: React.ReactNode; /** * Контент под кнопкой (privacy banner, дополнительные элементы) */ childrenUnderButton?: React.ReactNode; } /** * Конфигурация навигации для темплейта */ export interface TemplateNavigation { canGoBack: boolean; onBack: () => void; } /** * Helper функция для создания props для TemplateLayout компонента * * Упрощает создание темплейтов, предоставляя единообразный способ * настройки всех параметров с использованием preset-ов и опциональных * переопределений * * @example * ```typescript * const layoutProps = createTemplateLayoutProps( * screen, * { canGoBack, onBack }, * screenProgress, * { * preset: 'left', * actionButton: { * defaultText: "Next", * disabled: false, * onClick: onContinue, * }, * } * ); * * return {children}; * ``` */ export function createTemplateLayoutProps( screen: ScreenDefinition, navigation: TemplateNavigation, screenProgress?: { current: number; total: number }, options?: CreateTemplateLayoutOptions ) { // Выбираем preset на основе опций const defaults = options?.preset === "center" ? TEMPLATE_DEFAULTS_CENTERED : TEMPLATE_DEFAULTS; return { screen, canGoBack: navigation.canGoBack, onBack: navigation.onBack, screenProgress, // Используем кастомные defaults если переданы, иначе defaults из preset titleDefaults: options?.titleDefaults ?? defaults.title, subtitleDefaults: options?.subtitleDefaults ?? defaults.subtitle, // Конфигурация action кнопки actionButtonOptions: options?.actionButton, // Slots для дополнительного контента childrenAboveTitle: options?.childrenAboveTitle, childrenAboveButton: options?.childrenAboveButton, childrenUnderButton: options?.childrenUnderButton, }; }