import{jsx as n,jsxs as l,Fragment as f}from"react/jsx-runtime";import{memo as b,useEffect as h,useRef as u,useState as x}from"react";import{useAtom as y}from"jotai";import{useLocation as S}from"react-router-dom";import{useMount as v,breakpoints as k}from"@redocly/theme/core/openapi";import{isSidebarOpenedAtom as $}from"../../jotai/app.js";import{SidebarActions as g}from"./SidebarActions.js";import{styled as w}from"../../styled-components.js";const j=w.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: ${k.small}) {
    position: sticky;
    z-index: auto;
    width: ${({collapsedSidebar:e})=>e?"var(--sidebar-width)":"auto"};
    display: flex;
  }
  @media print {
    display: none;
  }
`;function O({scrollYOffset:e,className:a,children:d,collapsedSidebar:i}){const[t,p]=x("0px"),m=u(null),o=S(),[s,r]=y($);return h(()=>{o.hash&&r(!1)},[o.pathname,o.hash,r]),v(()=>{const c=e();p(`${c}px`)}),n(f,{children:l(j,{open:!!s,className:a,offsetTop:t,style:{top:t},ref:m,collapsedSidebar:i,children:[i||s?d:null,n(g,{})]})})}const C=b(O);export{C as StickyResponsiveSidebar};
