import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment, memo } from 'react';
import { Link } from '@gravity-ui/uikit';
import { i18n } from "../../../i18n/md-hints/index.js";
import { cn } from "../../../classname.js";
import "./MarkdownHints.css";
const b = cn('markdown-hints');
export const MarkdownHints = memo(function MarkdownHints() {
    const hints = [
        { title: i18n('header_title'), hint: i18n('header_hint') },
        { title: i18n('italic_title'), hint: i18n('italic_hint') },
        { title: i18n('bold_title'), hint: i18n('bold_hint') },
        { title: i18n('strikethrough_title'), hint: i18n('strikethrough_hint') },
        { title: i18n('blockquote_title'), hint: i18n('blockquote_hint') },
        { title: i18n('code_title'), hint: i18n('code_hint') },
        { title: i18n('link_title'), hint: i18n('link_hint') },
        { title: i18n('image_title'), hint: i18n('image_hint') },
        { title: i18n('list_title'), hint: i18n('list_hint') },
        { title: i18n('numbered-list_title'), hint: i18n('numbered-list_hint') },
    ];
    return (_jsxs("div", { className: b(), children: [_jsx("div", { className: b('grid'), children: hints.map((hint, index) => (_jsxs(Fragment, { children: [_jsx("span", { className: b('title'), children: hint.title }), _jsx("span", { className: b('hint'), children: hint.hint })] }, `md-hint-${index}`))) }), _jsx(Link, { href: i18n('documentation_link'), target: "_blank", className: b('docs-link'), children: i18n('documentation') })] }));
});
MarkdownHints.displayName = 'MarkdownHints';
//# sourceMappingURL=MarkdownHints.js.map
