@lobehub/ui/es/Layout/Layout.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"Layout.mjs","names":["LayoutHeader","LayoutToc","LayoutMain","LayoutSidebar","DraggablePanel","LayoutSidebarInner","LayoutFooter"],"sources":["../../src/Layout/Layout.tsx"],"sourcesContent":["'use client';\n\nimport { useResponsive } from 'antd-style';\nimport { memo, useEffect, useMemo, useState } from 'react';\n\nimport DraggablePanel from '@/DraggablePanel';\n\nimport LayoutFooter from './components/LayoutFooter';\nimport LayoutHeader from './components/LayoutHeader';\nimport LayoutMain from './components/LayoutMain';\nimport LayoutSidebar from './components/LayoutSidebar';\nimport LayoutSidebarInner from './components/LayoutSidebarInner';\nimport LayoutToc from './components/LayoutToc';\nimport { styles } from './style';\nimport type { LayoutProps } from './type';\n\nconst Layout = memo<LayoutProps>(\n  ({ helmet, headerHeight = 64, header, footer, sidebar, asideWidth, toc, children, tocWidth }) => {\n    // Convert headerHeight prop to CSS variable\n    const cssVariables = useMemo<Record<string, string>>(\n      () => ({\n        '--layout-header-height': `${headerHeight}px`,\n      }),\n      [headerHeight],\n    );\n    const { mobile, laptop } = useResponsive();\n    const [expand, setExpand] = useState(true);\n    useEffect(() => {\n      setExpand(Boolean(laptop));\n    }, [laptop]);\n\n    return (\n      <div style={cssVariables}>\n        {helmet}\n        {header && (\n          <LayoutHeader headerHeight={headerHeight}>\n            {header}\n            {mobile && toc && <LayoutToc>{toc}</LayoutToc>}\n          </LayoutHeader>\n        )}\n        <LayoutMain>\n          {!mobile && !sidebar && <nav style={{ width: tocWidth }} />}\n          {!mobile && sidebar && (\n            <LayoutSidebar headerHeight={headerHeight}>\n              <DraggablePanel\n                expand={expand}\n                maxWidth={asideWidth}\n                onExpandChange={setExpand}\n                placement=\"left\"\n              >\n                <LayoutSidebarInner headerHeight={headerHeight}>{sidebar}</LayoutSidebarInner>\n              </DraggablePanel>\n            </LayoutSidebar>\n          )}\n          <section className={styles.content}>{children}</section>\n          {!mobile && toc && <LayoutToc tocWidth={tocWidth}>{toc}</LayoutToc>}\n        </LayoutMain>\n        {footer && <LayoutFooter>{footer}</LayoutFooter>}\n      </div>\n    );\n  },\n);\n\nexport default Layout;\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,SAAS,MACZ,EAAE,QAAQ,eAAe,IAAI,QAAQ,QAAQ,SAAS,YAAY,KAAK,UAAU,eAAe;CAE/F,MAAM,eAAe,eACZ,EACL,0BAA0B,GAAG,aAAa,KAC3C,GACD,CAAC,aAAa,CACf;CACD,MAAM,EAAE,QAAQ,WAAW,eAAe;CAC1C,MAAM,CAAC,QAAQ,aAAa,SAAS,KAAK;AAC1C,iBAAgB;AACd,YAAU,QAAQ,OAAO,CAAC;IACzB,CAAC,OAAO,CAAC;AAEZ,QACE,qBAAC;EAAI,OAAO;;GACT;GACA,UACC,qBAACA;IAA2B;eACzB,QACA,UAAU,OAAO,oBAACC,+BAAW,MAAgB;KACjC;GAEjB,qBAACC;IACE,CAAC,UAAU,CAAC,WAAW,oBAAC,SAAI,OAAO,EAAE,OAAO,UAAU,GAAI;IAC1D,CAAC,UAAU,WACV,oBAACC;KAA4B;eAC3B,oBAACC;MACS;MACR,UAAU;MACV,gBAAgB;MAChB,WAAU;gBAEV,oBAACC;OAAiC;iBAAe;QAA6B;OAC/D;MACH;IAElB,oBAAC;KAAQ,WAAW,OAAO;KAAU;MAAmB;IACvD,CAAC,UAAU,OAAO,oBAACJ;KAAoB;eAAW;MAAgB;OACxD;GACZ,UAAU,oBAACK,kCAAc,SAAsB;;GAC5C;EAGX;AAED,qBAAe"}