import React, { useState } from 'react'; import { Button, Drawer, theme } from 'antd'; const App: React.FC = () => { const { token } = theme.useToken(); const [open, setOpen] = useState(false); const showDrawer = () => { setOpen(true); }; const onClose = () => { setOpen(false); }; const containerStyle: React.CSSProperties = { position: 'relative', height: 200, padding: 48, overflow: 'hidden', background: token.colorFillAlter, border: `1px solid ${token.colorBorderSecondary}`, borderRadius: token.borderRadiusLG, }; return ( <div style={containerStyle}> Render in this <div style={{ marginTop: 16 }}> <Button type="primary" onClick={showDrawer}> Open </Button> </div> <Drawer title="Basic Drawer" placement="right" closable={false} onClose={onClose} open={open} getContainer={false} > <p>Some contents...</p> </Drawer> </div> ); }; export default App;