"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TableBlock = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const components_1 = require("../../components/index.js");
const grid_1 = require("../../gravity-blocks/grid/index.js");
const utils_1 = require("../../utils/index.js");
const b = (0, utils_1.block)('table-block');
const TableBlock = (props) => {
    const { title, table } = props;
    const tableMicrodataScript = React.useMemo(() => {
        const json = JSON.stringify({
            '@context': 'https://schema.org',
            '@type': 'Table',
            name: title,
            description: table.caption,
            accessMode: 'textual',
            accessibilityFeature: 'tableOfContents',
        });
        return (0, jsx_runtime_1.jsx)("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: json } });
    }, [title, table.caption]);
    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [tableMicrodataScript, (0, jsx_runtime_1.jsx)(grid_1.Grid, { className: b('content'), children: (0, jsx_runtime_1.jsxs)(grid_1.Row, { className: b('row'), children: [(0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 4, [grid_1.GridColumnSize.All]: 12 }, children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { tagName: "h2", contentClassName: b('title'), content: title, modifiers: {
                                    constructor: true,
                                } }) }), (0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 8, [grid_1.GridColumnSize.All]: 12 }, children: (0, jsx_runtime_1.jsx)(components_1.Table, { className: b('table'), ...table }) })] }) })] }));
};
exports.TableBlock = TableBlock;
exports.default = exports.TableBlock;
//# sourceMappingURL=Table.js.map
