import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { ArrowRotateRight } from '@gravity-ui/icons';
import { Button, Text } from '@gravity-ui/uikit';
import { block } from "../../../utils/cn.js";
import { Suggestions } from "../../molecules/Suggestions/index.js";
import { i18n } from "./i18n/index.js";
import "./EmptyContainer.css";
const b = block('empty-container');
/**
 * EmptyContainer component - displays a welcome screen with image, title, description,
 * and suggestions
 *
 * @param props - Component props
 * @returns React component
 */
export function EmptyContainer(props) {
    const { image, title, description, suggestionTitle, suggestions = [], onSuggestionClick, alignment, layout = 'grid', wrapText = false, showMore, showMoreText, className, qa, } = props;
    const hasContent = title || description || (suggestions && suggestions.length > 0);
    // Define alignment for each element
    const imageAlignment = (alignment === null || alignment === void 0 ? void 0 : alignment.image) || 'left';
    const titleAlignment = (alignment === null || alignment === void 0 ? void 0 : alignment.title) || 'left';
    const descriptionAlignment = (alignment === null || alignment === void 0 ? void 0 : alignment.description) || 'left';
    // Define text for "Show more" button with localization support
    const showMoreButtonText = showMoreText || i18n('show-more-button');
    return (_jsx("div", { className: b(null, className), "data-qa": qa, children: _jsx("div", { className: b('content'), children: hasContent && (_jsxs(_Fragment, { children: [_jsxs("div", { className: b('welcome-section'), children: [image && (_jsx("div", { className: b('image-container', { align: imageAlignment }), children: image })), _jsxs("div", { className: b('text-container'), children: [title && (_jsx(Text, { variant: "header-2", className: b('title', { align: titleAlignment }), children: title })), description && (_jsx(Text, { variant: "body-2", color: "complementary", className: b('description', { align: descriptionAlignment }), children: description }))] })] }), suggestions && suggestions.length > 0 && onSuggestionClick && (_jsxs("div", { className: b('suggestions-section'), children: [suggestionTitle && (_jsx("div", { className: b('suggestions-title'), children: typeof suggestionTitle === 'string' ? (_jsx(Text, { variant: "subheader-3", color: "primary", children: suggestionTitle })) : (suggestionTitle) })), _jsx("div", { children: _jsx(Suggestions, { items: suggestions, onClick: onSuggestionClick, layout: layout, wrapText: wrapText }) }), showMore && (_jsx("div", { className: b('show-more'), children: _jsxs(Button, { view: "flat-secondary", size: "l", onClick: showMore, className: b('show-more-button'), children: [_jsx(Button.Icon, { children: _jsx(ArrowRotateRight, {}) }), showMoreButtonText] }) }))] }))] })) }) }));
}
//# sourceMappingURL=EmptyContainer.js.map
