"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FoldableListBlockItem = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const uikit_1 = require("@gravity-ui/uikit");
const components_1 = require("../../../components/index.js");
const Link_1 = tslib_1.__importDefault(require("../../../components/Link/Link.js"));
const utils_1 = require("../../../utils/index.js");
const b = (0, utils_1.block)('FoldableListBlockItem');
const FoldableListBlockItem = ({ title: itemTitle, text: itemText, link, listStyle = 'dash', isOpened, onClick, }) => {
    const { onKeyDown } = (0, uikit_1.useActionHandlers)(onClick);
    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), itemScope: true, role: 'listitem', children: [(0, jsx_runtime_1.jsxs)("button", { className: b('title'), onClick: onClick, "aria-expanded": isOpened, onKeyDown: onKeyDown, children: [(0, jsx_runtime_1.jsx)(components_1.HTML, { children: itemTitle }), (0, jsx_runtime_1.jsx)(components_1.ToggleArrow, { open: isOpened, size: 16, type: 'vertical', iconType: "navigation", className: b('arrow') })] }), (0, jsx_runtime_1.jsx)(components_1.Foldable, { isOpened: isOpened, children: (0, jsx_runtime_1.jsxs)("div", { className: b('text'), "aria-hidden": !isOpened, children: [(0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: itemText, modifiers: {
                                constructor: true,
                                constructorListStyle: true,
                                constructorListStyleDash: listStyle === 'dash',
                            } }), link && (0, jsx_runtime_1.jsx)(Link_1.default, { ...link, tabIndex: isOpened ? 0 : -1, className: b('link') })] }) })] }));
};
exports.FoldableListBlockItem = FoldableListBlockItem;
//# sourceMappingURL=FoldableListBlockItem.js.map
