"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PagePinnableAside = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const MenuOnOutlineMd_1 = require("../../icons/MenuOnOutlineMd");
const PinButton_1 = require("../PinButton");
const classNames_1 = require("../utils/classNames");
const constants_1 = require("./constants");
const styles_1 = require("./styles");
const useLogic_1 = require("./useLogic");
/**
 * Открепляемый aside
 */
const PagePinnableAside = ({ children, className, ...restProps }) => {
    const { isPinned, togglePin } = (0, useLogic_1.useLogic)(restProps);
    return ((0, jsx_runtime_1.jsxs)(styles_1.Aside, { "$isPinned": isPinned, children: [(0, jsx_runtime_1.jsx)(styles_1.Dummy, { "$isPinned": isPinned, children: (0, jsx_runtime_1.jsx)(MenuOnOutlineMd_1.MenuOnOutlineMd, {}) }), (0, jsx_runtime_1.jsxs)(styles_1.Content, { "$isPinned": isPinned, className: (0, classNames_1.classNames)(className, constants_1.pinnableAsideClassnames.content), children: [(0, jsx_runtime_1.jsx)(styles_1.ChildrenWrapper, { children: children }), (0, jsx_runtime_1.jsx)(styles_1.Footer, { children: (0, jsx_runtime_1.jsx)(PinButton_1.PinButton, { isPinned: isPinned, isUseCollapse: false, onClick: togglePin }) })] })] }));
};
exports.PagePinnableAside = PagePinnableAside;
