"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.StickyResponsiveSidebar=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),styled_components_1=__importDefault(require("styled-components")),theme_1=require("@redocly/theme"),jotai_1=require("jotai"),react_router_dom_1=require("react-router-dom"),app_1=require("../../jotai/app"),SidebarActions_1=require("./SidebarActions"),StyledStickySidebar=styled_components_1.default.div`
  overflow: hidden;
  flex-direction: column;
  backface-visibility: hidden;
  height: ${({offsetTop:e})=>`calc(100vh - ${e})`};
  top: 0;
  flex: 0 0 auto;
  position: fixed;
  display: ${({open:e})=>e?"flex":"none"};
  z-index: 2;
  width: 100%;
  background: var(--sidebar-bg-color);
  border-right: ${({collapsedSidebar:e})=>e?"1px solid var(--sidebar-border-color)":"auto"};

  @media screen and (min-width: ${theme_1.breakpoints.small}) {
    position: sticky;
    z-index: auto;
    width: ${({collapsedSidebar:e})=>e?"var(--sidebar-width)":"auto"};
    display: flex;
  }
  @media print {
    display: none;
  }
`;function StickyResponsiveSidebarComponent({scrollYOffset:e,className:t,children:i,collapsedSidebar:r}){const[o,a]=(0,react_1.useState)("0px"),s=(0,react_1.useRef)(null),d=(0,react_router_dom_1.useLocation)(),[n,c]=(0,jotai_1.useAtom)(app_1.isSidebarOpenedAtom);return(0,react_1.useEffect)((()=>{d.hash&&c(!1)}),[d.pathname,d.hash,c]),(0,theme_1.useMount)((()=>{const t=e();a(`${t}px`)})),(0,jsx_runtime_1.jsx)(jsx_runtime_1.Fragment,{children:(0,jsx_runtime_1.jsxs)(StyledStickySidebar,{open:n,className:t,offsetTop:o,style:{top:o},ref:s,collapsedSidebar:r,children:[r||n?i:null,(0,jsx_runtime_1.jsx)(SidebarActions_1.SidebarActions,{})]})})}exports.StickyResponsiveSidebar=(0,react_1.memo)(StickyResponsiveSidebarComponent);
//# sourceMappingURL=StickyResponsiveSidebar.js.map