w-funnel/src/lib/funnel/templateHelpers.ts
gofnnp c1e9d3e2d6 auth
add auth to email template
2025-10-05 14:12:46 +04:00

131 lines
3.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/**
* 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<TypographyVariant>;
/**
* Кастомные defaults для subtitle (переопределяют preset)
*/
subtitleDefaults?: Partial<TypographyVariant>;
/**
* Контент над заголовком (иконки, изображения)
*/
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 <TemplateLayout {...layoutProps}>{children}</TemplateLayout>;
* ```
*/
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,
};
}