mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-23 18:50:06 +08:00
1 line
129 KiB
JavaScript
1 line
129 KiB
JavaScript
(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["377f587c"],{"377f587c":function(e,t,r){"use strict";r.d(t,"__esModule",{value:!0}),r.d(t,"default",{enumerable:!0,get:function(){return g;}});var n=r("777fffbe"),s=r("f19d2b93"),i=n._(r("769c016e")),o=n._(r("67074e5d")),a=n._(r("3098b24f")),c=n._(r("84b131b4")),p=n._(r("97c488ea")),l=r("9c86e52a"),d=n._(r("c96b0d01")),m=r("5b220c3d");function u(){let{texts:e}=(0,l.useRouteMeta)();return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)("div",{className:"markdown",children:[(0,s.jsxs)("h2",{id:"when-to-use",children:[(0,s.jsx)(p.default,{"aria-hidden":"true",tabIndex:"-1",href:"#when-to-use",sourceType:"a",children:(0,s.jsx)("span",{className:"icon icon-link"})}),"When To Use"]}),(0,s.jsx)("p",{children:e[0].value}),(0,s.jsxs)("ul",{children:[(0,s.jsx)("li",{children:e[1].value}),(0,s.jsx)("li",{children:e[2].value}),(0,s.jsx)("li",{children:e[3].value})]}),(0,s.jsxs)("blockquote",{children:[(0,s.jsx)("p",{children:e[4].value}),(0,s.jsxs)("p",{children:[e[5].value,(0,s.jsx)("code",{children:e[6].value}),e[7].value,(0,s.jsx)("code",{children:e[8].value}),e[9].value,(0,s.jsx)("code",{children:e[10].value}),e[11].value,(0,s.jsx)("code",{children:e[12].value}),e[13].value,(0,s.jsx)("code",{children:e[14].value}),e[15].value]})]}),(0,s.jsxs)("h2",{id:"examples",children:[(0,s.jsx)(p.default,{"aria-hidden":"true",tabIndex:"-1",href:"#examples",sourceType:"a",children:(0,s.jsx)("span",{className:"icon icon-link"})}),"Examples"]})]}),(0,s.jsx)(c.default,{items:[{demo:{id:"drawer-demo-basic-right"},previewerProps:{title:"Basic",filename:"components/drawer/demo/basic-right.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React, { useState } from 'react';\nimport { Button, Drawer } from 'antd';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <Button type=\"primary\" onClick={showDrawer}>\n Open\n </Button>\n <Drawer title=\"Basic Drawer\" onClose={onClose} open={open}>\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n",description:"<p>Basic drawer.</p>"}},{demo:{id:"drawer-demo-placement"},previewerProps:{title:"Custom Placement",filename:"components/drawer/demo/placement.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { Button, Drawer, Radio, Space } from \'antd\';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const [placement, setPlacement] = useState(\'left\');\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n const onChange = (e) => {\n setPlacement(e.target.value);\n };\n return (\n <>\n <Space>\n <Radio.Group value={placement} onChange={onChange}>\n <Radio value="top">top</Radio>\n <Radio value="right">right</Radio>\n <Radio value="bottom">bottom</Radio>\n <Radio value="left">left</Radio>\n </Radio.Group>\n <Button type="primary" onClick={showDrawer}>\n Open\n </Button>\n </Space>\n <Drawer\n title="Basic Drawer"\n placement={placement}\n closable={false}\n onClose={onClose}\n open={open}\n key={placement}\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>The Drawer can appear from any edge of the screen.</p>"}},{demo:{id:"drawer-demo-loading"},previewerProps:{version:"5.17.0",title:"Loading",filename:"components/drawer/demo/loading.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React from \'react\';\nimport { Button, Drawer } from \'antd\';\nconst App = () => {\n const [open, setOpen] = React.useState(false);\n const [loading, setLoading] = React.useState(true);\n const showLoading = () => {\n setOpen(true);\n setLoading(true);\n\n // Simple loading mock. You should add cleanup logic in real world.\n setTimeout(() => {\n setLoading(false);\n }, 2000);\n };\n return (\n <>\n <Button type="primary" onClick={showLoading}>\n Open Drawer\n </Button>\n <Drawer\n closable\n destroyOnClose\n title={<p>Loading Drawer</p>}\n placement="right"\n open={open}\n loading={loading}\n onClose={() => setOpen(false)}\n >\n <Button\n type="primary"\n style={{\n marginBottom: 16,\n }}\n onClick={showLoading}\n >\n Reload\n </Button>\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>Set the loading status of Drawer.</p>"}},{demo:{id:"drawer-demo-extra"},previewerProps:{title:"Extra Actions",filename:"components/drawer/demo/extra.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { Button, Drawer, Radio, Space } from \'antd\';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const [placement, setPlacement] = useState(\'right\');\n const showDrawer = () => {\n setOpen(true);\n };\n const onChange = (e) => {\n setPlacement(e.target.value);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <Space>\n <Radio.Group value={placement} onChange={onChange}>\n <Radio value="top">top</Radio>\n <Radio value="right">right</Radio>\n <Radio value="bottom">bottom</Radio>\n <Radio value="left">left</Radio>\n </Radio.Group>\n <Button type="primary" onClick={showDrawer}>\n Open\n </Button>\n </Space>\n <Drawer\n title="Drawer with extra actions"\n placement={placement}\n width={500}\n onClose={onClose}\n open={open}\n extra={\n <Space>\n <Button onClick={onClose}>Cancel</Button>\n <Button type="primary" onClick={onClose}>\n OK\n </Button>\n </Space>\n }\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>Extra actions should be placed at corner of drawer in Ant Design, you can use <code>extra</code> prop for that.</p>"}},{demo:{id:"drawer-demo-render-in-current"},previewerProps:{title:"Render in current dom",filename:"components/drawer/demo/render-in-current.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React, { useState } from 'react';\nimport { Button, Drawer, theme } from 'antd';\nconst App = () => {\n const { token } = theme.useToken();\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n const containerStyle = {\n position: 'relative',\n height: 200,\n padding: 48,\n overflow: 'hidden',\n background: token.colorFillAlter,\n border: `1px solid ${token.colorBorderSecondary}`,\n borderRadius: token.borderRadiusLG,\n };\n return (\n <div style={containerStyle}>\n Render in this\n <div\n style={{\n marginTop: 16,\n }}\n >\n <Button type=\"primary\" onClick={showDrawer}>\n Open\n </Button>\n </div>\n <Drawer\n title=\"Basic Drawer\"\n placement=\"right\"\n closable={false}\n onClose={onClose}\n open={open}\n getContainer={false}\n >\n <p>Some contents...</p>\n </Drawer>\n </div>\n );\n};\nexport default App;\n",description:"<p>Render in current dom. custom container, check <code>getContainer</code>.</p>\n<blockquote>\n<p>Note: <code>style</code> and <code>className</code> props are moved to Drawer panel in v5 which is aligned with Modal component. Original <code>style</code> and <code>className</code> props are replaced by <code>rootStyle</code> and <code>rootClassName</code>.</p>\n</blockquote>\n<blockquote>\n<p>When <code>getContainer</code> returns a DOM node, you need to manually set <code>rootStyle</code> to <code>{ position: 'absolute' }</code>, see <a href=\"https://github.com/ant-design/ant-design/issues/41951#issuecomment-1521099152\">#41951</a>.</p>\n</blockquote>"}},{demo:{id:"drawer-demo-form-in-drawer"},previewerProps:{title:"Submit form in drawer",filename:"components/drawer/demo/form-in-drawer.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { PlusOutlined } from \'@ant-design/icons\';\nimport { Button, Col, DatePicker, Drawer, Form, Input, Row, Select, Space } from \'antd\';\nconst { Option } = Select;\nconst App = () => {\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <Button type="primary" onClick={showDrawer} icon={<PlusOutlined />}>\n New account\n </Button>\n <Drawer\n title="Create a new account"\n width={720}\n onClose={onClose}\n open={open}\n styles={{\n body: {\n paddingBottom: 80,\n },\n }}\n extra={\n <Space>\n <Button onClick={onClose}>Cancel</Button>\n <Button onClick={onClose} type="primary">\n Submit\n </Button>\n </Space>\n }\n >\n <Form layout="vertical" hideRequiredMark>\n <Row gutter={16}>\n <Col span={12}>\n <Form.Item\n name="name"\n label="Name"\n rules={[\n {\n required: true,\n message: \'Please enter user name\',\n },\n ]}\n >\n <Input placeholder="Please enter user name" />\n </Form.Item>\n </Col>\n <Col span={12}>\n <Form.Item\n name="url"\n label="Url"\n rules={[\n {\n required: true,\n message: \'Please enter url\',\n },\n ]}\n >\n <Input\n style={{\n width: \'100%\',\n }}\n addonBefore="http://"\n addonAfter=".com"\n placeholder="Please enter url"\n />\n </Form.Item>\n </Col>\n </Row>\n <Row gutter={16}>\n <Col span={12}>\n <Form.Item\n name="owner"\n label="Owner"\n rules={[\n {\n required: true,\n message: \'Please select an owner\',\n },\n ]}\n >\n <Select placeholder="Please select an owner">\n <Option value="xiao">Xiaoxiao Fu</Option>\n <Option value="mao">Maomao Zhou</Option>\n </Select>\n </Form.Item>\n </Col>\n <Col span={12}>\n <Form.Item\n name="type"\n label="Type"\n rules={[\n {\n required: true,\n message: \'Please choose the type\',\n },\n ]}\n >\n <Select placeholder="Please choose the type">\n <Option value="private">Private</Option>\n <Option value="public">Public</Option>\n </Select>\n </Form.Item>\n </Col>\n </Row>\n <Row gutter={16}>\n <Col span={12}>\n <Form.Item\n name="approver"\n label="Approver"\n rules={[\n {\n required: true,\n message: \'Please choose the approver\',\n },\n ]}\n >\n <Select placeholder="Please choose the approver">\n <Option value="jack">Jack Ma</Option>\n <Option value="tom">Tom Liu</Option>\n </Select>\n </Form.Item>\n </Col>\n <Col span={12}>\n <Form.Item\n name="dateTime"\n label="DateTime"\n rules={[\n {\n required: true,\n message: \'Please choose the dateTime\',\n },\n ]}\n >\n <DatePicker.RangePicker\n style={{\n width: \'100%\',\n }}\n getPopupContainer={(trigger) => trigger.parentElement}\n />\n </Form.Item>\n </Col>\n </Row>\n <Row gutter={16}>\n <Col span={24}>\n <Form.Item\n name="description"\n label="Description"\n rules={[\n {\n required: true,\n message: \'please enter url description\',\n },\n ]}\n >\n <Input.TextArea rows={4} placeholder="please enter url description" />\n </Form.Item>\n </Col>\n </Row>\n </Form>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>Use a form in Drawer with a submit button.</p>",style:"\n.site-form-in-drawer-wrapper {\n position: absolute;\n inset-inline-end: 0;\n bottom: 0;\n width: 100%;\n padding: 10px 16px;\n text-align: right;\n background: #fff;\n border-top: 1px solid #e9e9e9;\n}\n```\n"}},{demo:{id:"drawer-demo-user-profile"},previewerProps:{title:"Preview drawer",filename:"components/drawer/demo/user-profile.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { Avatar, Col, Divider, Drawer, List, Row } from \'antd\';\nconst DescriptionItem = ({ title, content }) => (\n <div className="site-description-item-profile-wrapper">\n <p className="site-description-item-profile-p-label">{title}:</p>\n {content}\n </div>\n);\nconst App = () => {\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <List\n dataSource={[\n {\n id: 1,\n name: \'Lily\',\n },\n {\n id: 2,\n name: \'Lily\',\n },\n ]}\n bordered\n renderItem={(item) => (\n <List.Item\n key={item.id}\n actions={[\n <a onClick={showDrawer} key={`a-${item.id}`}>\n View Profile\n </a>,\n ]}\n >\n <List.Item.Meta\n avatar={\n <Avatar src="https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png" />\n }\n title={<a href="https://ant.design/index-cn">{item.name}</a>}\n description="Progresser XTech"\n />\n </List.Item>\n )}\n />\n <Drawer width={640} placement="right" closable={false} onClose={onClose} open={open}>\n <p\n className="site-description-item-profile-p"\n style={{\n marginBottom: 24,\n }}\n >\n User Profile\n </p>\n <p className="site-description-item-profile-p">Personal</p>\n <Row>\n <Col span={12}>\n <DescriptionItem title="Full Name" content="Lily" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Account" content="AntDesign@example.com" />\n </Col>\n </Row>\n <Row>\n <Col span={12}>\n <DescriptionItem title="City" content="HangZhou" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Country" content="China\u{1F1E8}\u{1F1F3}" />\n </Col>\n </Row>\n <Row>\n <Col span={12}>\n <DescriptionItem title="Birthday" content="February 2,1900" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Website" content="-" />\n </Col>\n </Row>\n <Row>\n <Col span={24}>\n <DescriptionItem\n title="Message"\n content="Make things as simple as possible but no simpler."\n />\n </Col>\n </Row>\n <Divider />\n <p className="site-description-item-profile-p">Company</p>\n <Row>\n <Col span={12}>\n <DescriptionItem title="Position" content="Programmer" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Responsibilities" content="Coding" />\n </Col>\n </Row>\n <Row>\n <Col span={12}>\n <DescriptionItem title="Department" content="XTech" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Supervisor" content={<a>Lin</a>} />\n </Col>\n </Row>\n <Row>\n <Col span={24}>\n <DescriptionItem\n title="Skills"\n content="C / C + +, data structures, software engineering, operating systems, computer networks, databases, compiler theory, computer architecture, Microcomputer Principle and Interface Technology, Computer English, Java, ASP, etc."\n />\n </Col>\n </Row>\n <Divider />\n <p className="site-description-item-profile-p">Contacts</p>\n <Row>\n <Col span={12}>\n <DescriptionItem title="Email" content="AntDesign@example.com" />\n </Col>\n <Col span={12}>\n <DescriptionItem title="Phone Number" content="+86 181 0000 0000" />\n </Col>\n </Row>\n <Row>\n <Col span={24}>\n <DescriptionItem\n title="Github"\n content={\n <a href="http://github.com/ant-design/ant-design/">\n github.com/ant-design/ant-design/\n </a>\n }\n />\n </Col>\n </Row>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>Use Drawer to quickly preview details of an object, such as those in a list.</p>",style:"\n.site-description-item-profile-wrapper {\n margin-bottom: 7px;\n color: rgba(0, 0, 0, 0.65);\n font-size: 14px;\n line-height: 1.5715;\n}\n\n.ant-drawer-body p.site-description-item-profile-p {\n display: block;\n margin-bottom: 16px;\n color: rgba(0, 0, 0, 0.85);\n font-size: 16px;\n line-height: 1.5715;\n}\n\n.site-description-item-profile-p-label {\n display: inline-block;\n margin-inline-end: 8px;\n color: rgba(0, 0, 0, 0.85);\n}\n```\n"}},{demo:{id:"drawer-demo-multi-level-drawer"},previewerProps:{title:"Multi-level drawer",filename:"components/drawer/demo/multi-level-drawer.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { Button, Drawer } from \'antd\';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const [childrenDrawer, setChildrenDrawer] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n const showChildrenDrawer = () => {\n setChildrenDrawer(true);\n };\n const onChildrenDrawerClose = () => {\n setChildrenDrawer(false);\n };\n return (\n <>\n <Button type="primary" onClick={showDrawer}>\n Open drawer\n </Button>\n <Drawer title="Multi-level drawer" width={520} closable={false} onClose={onClose} open={open}>\n <Button type="primary" onClick={showChildrenDrawer}>\n Two-level drawer\n </Button>\n <Drawer\n title="Two-level Drawer"\n width={320}\n closable={false}\n onClose={onChildrenDrawerClose}\n open={childrenDrawer}\n >\n This is two-level drawer\n </Drawer>\n </Drawer>\n </>\n );\n};\nexport default App;\n',description:"<p>Open a new drawer on top of an existing drawer to handle multi branch tasks.</p>"}},{demo:{id:"drawer-demo-size"},previewerProps:{title:"Preset size",filename:"components/drawer/demo/size.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React, { useState } from 'react';\nimport { Button, Drawer, Space } from 'antd';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const [size, setSize] = useState();\n const showDefaultDrawer = () => {\n setSize('default');\n setOpen(true);\n };\n const showLargeDrawer = () => {\n setSize('large');\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <Space>\n <Button type=\"primary\" onClick={showDefaultDrawer}>\n Open Default Size (378px)\n </Button>\n <Button type=\"primary\" onClick={showLargeDrawer}>\n Open Large Size (736px)\n </Button>\n </Space>\n <Drawer\n title={`${size} Drawer`}\n placement=\"right\"\n size={size}\n onClose={onClose}\n open={open}\n extra={\n <Space>\n <Button onClick={onClose}>Cancel</Button>\n <Button type=\"primary\" onClick={onClose}>\n OK\n </Button>\n </Space>\n }\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n",description:"<p>The default width (or height) of Drawer is <code>378px</code>, and there is a preset large size <code>736px</code>.</p>"}},{demo:{id:"drawer-demo-classnames"},previewerProps:{title:"Customize className for build-in module",filename:"components/drawer/demo/classNames.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React, { useState } from 'react';\nimport { Button, ConfigProvider, Drawer, Space } from 'antd';\nimport { createStyles, useTheme } from 'antd-style';\nconst useStyle = createStyles(({ token }) => ({\n 'my-drawer-body': {\n background: token.blue1,\n },\n 'my-drawer-mask': {\n boxShadow: `inset 0 0 15px #fff`,\n },\n 'my-drawer-header': {\n background: token.green1,\n },\n 'my-drawer-footer': {\n color: token.colorPrimary,\n },\n 'my-drawer-content': {\n borderLeft: '2px dotted #333',\n },\n}));\nconst App = () => {\n const [open, setOpen] = useState([false, false]);\n const { styles } = useStyle();\n const token = useTheme();\n const toggleDrawer = (idx, target) => {\n setOpen((p) => {\n p[idx] = target;\n return [...p];\n });\n };\n const classNames = {\n body: styles['my-drawer-body'],\n mask: styles['my-drawer-mask'],\n header: styles['my-drawer-header'],\n footer: styles['my-drawer-footer'],\n content: styles['my-drawer-content'],\n };\n const drawerStyles = {\n mask: {\n backdropFilter: 'blur(10px)',\n },\n content: {\n boxShadow: '-10px 0 10px #666',\n },\n header: {\n borderBottom: `1px solid ${token.colorPrimary}`,\n },\n body: {\n fontSize: token.fontSizeLG,\n },\n footer: {\n borderTop: `1px solid ${token.colorBorder}`,\n },\n };\n return (\n <>\n <Space>\n <Button type=\"primary\" onClick={() => toggleDrawer(0, true)}>\n Open\n </Button>\n <Button type=\"primary\" onClick={() => toggleDrawer(1, true)}>\n ConfigProvider\n </Button>\n </Space>\n <Drawer\n title=\"Basic Drawer\"\n placement=\"right\"\n footer=\"Footer\"\n onClose={() => toggleDrawer(0, false)}\n open={open[0]}\n classNames={classNames}\n styles={drawerStyles}\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n <ConfigProvider\n drawer={{\n classNames,\n styles: drawerStyles,\n }}\n >\n <Drawer\n title=\"Basic Drawer\"\n placement=\"right\"\n footer=\"Footer\"\n onClose={() => toggleDrawer(1, false)}\n open={open[1]}\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </ConfigProvider>\n </>\n );\n};\nexport default App;\n",description:"<p>Set the <code>className</code> of the build-in module (header, body, footer, mask, wrapper) of the drawer through the <code>classNames</code>.</p>"}},{demo:{id:"drawer-demo-config-provider"},previewerProps:{debug:!0,title:"ConfigProvider",filename:"components/drawer/demo/config-provider.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useRef, useState } from \'react\';\nimport { Button, ConfigProvider, Drawer } from \'antd\';\nconst App = () => {\n const domRef = useRef(null);\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <ConfigProvider getPopupContainer={() => domRef.current}>\n <div ref={domRef} className="site-drawer-render-in-current-wrapper">\n <Button type="primary" onClick={showDrawer}>\n Open\n </Button>\n <Drawer\n rootStyle={{\n position: \'absolute\',\n }}\n title="ConfigProvider"\n placement="right"\n onClose={onClose}\n open={open}\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </div>\n </ConfigProvider>\n );\n};\nexport default App;\n',description:"<p>config by ConfigProvider.</p>"}},{demo:{id:"drawer-demo-no-mask"},previewerProps:{debug:!0,title:"No mask",filename:"components/drawer/demo/no-mask.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React, { useState } from 'react';\nimport { Button, Drawer } from 'antd';\nconst App = () => {\n const [open, setOpen] = useState(false);\n const showDrawer = () => {\n setOpen(true);\n };\n const onClose = () => {\n setOpen(false);\n };\n return (\n <>\n <Button type=\"primary\" onClick={showDrawer}>\n Open\n </Button>\n <Drawer\n title=\"Drawer without mask\"\n placement=\"right\"\n mask={false}\n onClose={onClose}\n open={open}\n styles={{\n mask: {\n width: 333,\n background: 'red',\n borderRadius: 20,\n boxShadow: '-5px 0 5px green',\n overflow: 'hidden',\n },\n }}\n >\n <p>Some contents...</p>\n <p>Some contents...</p>\n <p>Some contents...</p>\n </Drawer>\n </>\n );\n};\nexport default App;\n",description:"<p>Remove mask.</p>"}},{demo:{id:"drawer-demo-render-panel"},previewerProps:{debug:!0,title:"_InternalPanelDoNotUseOrYouWillBeFired",filename:"components/drawer/demo/render-panel.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React from 'react';\nimport { Drawer } from 'antd';\n\n/** Test usage. Do not use in your production. */\nconst { _InternalPanelDoNotUseOrYouWillBeFired: InternalDrawer } = Drawer;\nexport default () => (\n <div\n style={{\n padding: 32,\n background: '#e6e6e6',\n }}\n >\n <InternalDrawer\n title=\"Hello Title\"\n style={{\n height: 300,\n }}\n footer=\"Footer!\"\n >\n Hello Content\n </InternalDrawer>\n </div>\n);\n",description:"<p>Debug usage. Do not use in your production.</p>"}},{demo:{id:"drawer-demo-scroll-debug"},previewerProps:{debug:!0,title:"Scroll Debug",filename:"components/drawer/demo/scroll-debug.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:'import React, { useState } from \'react\';\nimport { Drawer, Modal, Space, Switch } from \'antd\';\nconst App = () => {\n const [drawer, setDrawer] = useState(false);\n const [drawer2, setDrawer2] = useState(false);\n const [modal, setModal] = useState(false);\n const [modal2, setModal2] = useState(false);\n return (\n <div\n style={{\n position: \'relative\',\n zIndex: 999999,\n }}\n >\n <Space>\n <Switch\n checkedChildren="Drawer"\n unCheckedChildren="Drawer"\n checked={drawer}\n onChange={() => setDrawer(!drawer)}\n />\n <Switch\n checkedChildren="Drawer2"\n unCheckedChildren="Drawer2"\n checked={drawer2}\n onChange={() => setDrawer2(!drawer2)}\n />\n <Switch\n checkedChildren="Modal"\n unCheckedChildren="Modal"\n checked={modal}\n onChange={() => setModal(!modal)}\n />\n <Switch\n checkedChildren="Modal2"\n unCheckedChildren="Modal2"\n checked={modal2}\n onChange={() => setModal2(!modal2)}\n />\n </Space>\n <Drawer title="Drawer" open={drawer}>\n Some contents...\n <Drawer title="Drawer Sub" open={drawer}>\n Sub contents...\n </Drawer>\n </Drawer>\n <Drawer title="Drawer2" open={drawer2}>\n Some contents...\n </Drawer>\n <Modal title="Modal" open={modal}>\n Some contents...\n </Modal>\n <Modal title="Modal2" open={modal2}>\n Some contents...\n </Modal>\n </div>\n );\n};\nexport default App;\n',description:"<p>Scroll lock debug with Modal & Drawer.</p>"}},{demo:{id:"drawer-demo-component-token"},previewerProps:{debug:!0,title:"Component Token",filename:"components/drawer/demo/component-token.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React from 'react';\nimport { ConfigProvider, Drawer } from 'antd';\n\n/** Test usage. Do not use in your production. */\nconst { _InternalPanelDoNotUseOrYouWillBeFired: InternalDrawer } = Drawer;\nexport default () => (\n <ConfigProvider\n theme={{\n components: {\n Drawer: {\n footerPaddingBlock: 0,\n footerPaddingInline: 0,\n },\n },\n }}\n >\n <div\n style={{\n padding: 32,\n background: '#e6e6e6',\n }}\n >\n <InternalDrawer\n title=\"Hello Title\"\n style={{\n height: 300,\n }}\n footer=\"Footer!\"\n >\n Hello Content\n </InternalDrawer>\n </div>\n </ConfigProvider>\n);\n",description:"<p>Component Token Debug.</p>"}}]}),(0,s.jsxs)("div",{className:"markdown",children:[(0,s.jsxs)("h2",{id:"api",children:[(0,s.jsx)(p.default,{"aria-hidden":"true",tabIndex:"-1",href:"#api",sourceType:"a",children:(0,s.jsx)("span",{className:"icon icon-link"})}),"API"]}),(0,s.jsxs)("p",{children:[e[16].value,(0,s.jsx)(p.default,{to:"/docs/react/common-props",sourceType:"Link",children:e[17].value})]})]}),(0,s.jsx)(i.default,{type:"info",title:"Note",children:(0,s.jsxs)("p",{children:[e[18].value,(0,s.jsx)("code",{children:e[19].value}),e[20].value,(0,s.jsx)("code",{children:e[21].value}),e[22].value,(0,s.jsx)("code",{children:e[23].value}),e[24].value,(0,s.jsx)("code",{children:e[25].value}),e[26].value]})}),(0,s.jsxs)("div",{className:"markdown",children:[(0,s.jsxs)(o.default,{className:"component-api-table",children:[(0,s.jsx)("thead",{children:(0,s.jsxs)("tr",{children:[(0,s.jsx)("th",{children:e[27].value}),(0,s.jsx)("th",{children:e[28].value}),(0,s.jsx)("th",{children:e[29].value}),(0,s.jsx)("th",{children:e[30].value}),(0,s.jsx)("th",{children:e[31].value})]})}),(0,s.jsxs)("tbody",{children:[(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[32].value}),(0,s.jsx)("td",{children:e[33].value}),(0,s.jsx)("td",{children:e[34].value}),(0,s.jsx)("td",{children:e[35].value}),(0,s.jsx)("td",{children:e[36].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[37].value}),(0,s.jsx)("td",{children:e[38].value}),(0,s.jsx)("td",{children:e[39].value}),(0,s.jsx)("td",{children:e[40].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[41].value}),(0,s.jsxs)("td",{children:[e[42].value,(0,s.jsx)("code",{children:e[43].value}),e[44].value]}),(0,s.jsx)("td",{children:e[45].value}),(0,s.jsx)("td",{children:e[46].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[47].value}),(0,s.jsx)("td",{children:e[48].value}),(0,s.jsx)("td",{children:(0,s.jsx)(p.default,{to:"#semantic-dom",sourceType:"Link",children:e[49].value})}),(0,s.jsx)("td",{children:e[50].value}),(0,s.jsx)("td",{children:e[51].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[52].value}),(0,s.jsxs)("td",{children:[e[53].value,(0,s.jsx)("code",{children:e[54].value}),e[55].value,(0,s.jsx)("code",{children:e[56].value})]}),(0,s.jsx)("td",{children:e[57].value}),(0,s.jsx)("td",{children:e[58].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[59].value}),(0,s.jsx)("td",{children:e[60].value}),(0,s.jsx)("td",{children:e[61].value}),(0,s.jsx)("td",{children:e[62].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[63].value}),(0,s.jsx)("td",{children:e[64].value}),(0,s.jsx)("td",{children:e[65].value}),(0,s.jsx)("td",{children:e[66].value}),(0,s.jsx)("td",{children:e[67].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[68].value}),(0,s.jsx)("td",{children:e[69].value}),(0,s.jsx)("td",{children:e[70].value}),(0,s.jsx)("td",{children:e[71].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[72].value}),(0,s.jsx)("td",{children:e[73].value}),(0,s.jsx)("td",{children:e[74].value}),(0,s.jsx)("td",{children:e[75].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[76].value}),(0,s.jsx)("td",{children:e[77].value}),(0,s.jsx)("td",{children:e[78].value}),(0,s.jsx)("td",{children:e[79].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[80].value}),(0,s.jsx)("td",{children:e[81].value}),(0,s.jsx)("td",{children:e[82].value}),(0,s.jsx)("td",{children:e[83].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[84].value}),(0,s.jsxs)("td",{children:[e[85].value,(0,s.jsx)("code",{children:e[86].value}),e[87].value,(0,s.jsx)("code",{children:e[88].value}),e[89].value]}),(0,s.jsx)("td",{children:e[90].value}),(0,s.jsx)("td",{children:e[91].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[92].value}),(0,s.jsx)("td",{children:e[93].value}),(0,s.jsx)("td",{children:e[94].value}),(0,s.jsx)("td",{children:e[95].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[96].value}),(0,s.jsx)("td",{children:e[97].value}),(0,s.jsx)("td",{children:e[98].value}),(0,s.jsx)("td",{children:e[99].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[100].value}),(0,s.jsx)("td",{children:e[101].value}),(0,s.jsx)("td",{children:e[102].value}),(0,s.jsx)("td",{children:e[103].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[104].value}),(0,s.jsx)("td",{children:e[105].value}),(0,s.jsxs)("td",{children:[(0,s.jsx)("code",{children:e[106].value}),e[107].value,(0,s.jsx)("code",{children:e[108].value}),e[109].value,(0,s.jsx)("code",{children:e[110].value}),e[111].value,(0,s.jsx)("code",{children:e[112].value})]}),(0,s.jsx)("td",{children:(0,s.jsx)("code",{children:e[113].value})}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[114].value}),(0,s.jsx)("td",{children:e[115].value}),(0,s.jsx)("td",{children:e[116].value}),(0,s.jsx)("td",{children:e[117].value}),(0,s.jsx)("td",{children:e[118].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[119].value}),(0,s.jsxs)("td",{children:[e[120].value,(0,s.jsx)("strong",{children:e[121].value}),e[122].value,(0,s.jsx)("code",{children:e[123].value})]}),(0,s.jsx)("td",{children:e[124].value}),(0,s.jsx)("td",{children:e[125].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[126].value}),(0,s.jsxs)("td",{children:[e[127].value,(0,s.jsx)("code",{children:e[128].value}),e[129].value]}),(0,s.jsx)("td",{children:e[130].value}),(0,s.jsx)("td",{children:e[131].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[132].value}),(0,s.jsx)("td",{children:e[133].value}),(0,s.jsx)("td",{children:(0,s.jsx)(p.default,{to:"#semantic-dom",sourceType:"Link",children:e[134].value})}),(0,s.jsx)("td",{children:e[135].value}),(0,s.jsx)("td",{children:e[136].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[137].value}),(0,s.jsxs)("td",{children:[e[138].value,(0,s.jsx)("code",{children:e[139].value}),e[140].value,(0,s.jsx)("code",{children:e[141].value})]}),(0,s.jsx)("td",{children:e[142].value}),(0,s.jsx)("td",{children:e[143].value}),(0,s.jsx)("td",{children:e[144].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[145].value}),(0,s.jsx)("td",{children:e[146].value}),(0,s.jsx)("td",{children:e[147].value}),(0,s.jsx)("td",{children:e[148].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[149].value}),(0,s.jsx)("td",{children:e[150].value}),(0,s.jsx)("td",{children:e[151].value}),(0,s.jsx)("td",{children:e[152].value}),(0,s.jsx)("td",{children:e[153].value})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[154].value}),(0,s.jsx)("td",{children:e[155].value}),(0,s.jsx)("td",{children:e[156].value}),(0,s.jsx)("td",{children:e[157].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[158].value}),(0,s.jsx)("td",{children:e[159].value}),(0,s.jsx)("td",{children:e[160].value}),(0,s.jsx)("td",{children:e[161].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[162].value}),(0,s.jsxs)("td",{children:[e[163].value,(0,s.jsx)("code",{children:e[164].value}),e[165].value]}),(0,s.jsx)("td",{children:e[166].value}),(0,s.jsx)("td",{children:e[167].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[168].value}),(0,s.jsx)("td",{children:e[169].value}),(0,s.jsx)("td",{children:e[170].value}),(0,s.jsx)("td",{children:e[171].value}),(0,s.jsx)("td",{})]}),(0,s.jsxs)("tr",{children:[(0,s.jsx)("td",{children:e[172].value}),(0,s.jsx)("td",{children:e[173].value}),(0,s.jsx)("td",{children:e[174].value}),(0,s.jsx)("td",{children:e[175].value}),(0,s.jsx)("td",{children:e[176].value})]})]})]}),(0,s.jsxs)("h2",{id:"semantic-dom",children:[(0,s.jsx)(p.default,{"aria-hidden":"true",tabIndex:"-1",href:"#semantic-dom",sourceType:"a",children:(0,s.jsx)("span",{className:"icon icon-link"})}),"Semantic DOM"]})]}),(0,s.jsx)(l.DumiDemo,{demo:{id:"drawer-demo-_semantic"},previewerProps:{simplify:"true",filename:"components/drawer/demo/_semantic.tsx",pkgDependencyList:{"@ant-design/compatible":"^5.1.3","@ant-design/happy-work-theme":"^1.0.0","@ant-design/tools":"^18.0.2","@antfu/eslint-config":"^3.8.0","@antv/g6":"^4.8.24","@biomejs/biome":"^1.9.4","@codecov/webpack-plugin":"^1.2.1","@codesandbox/sandpack-react":"^2.19.9","@dnd-kit/core":"^6.1.0","@dnd-kit/modifiers":"^7.0.0","@dnd-kit/sortable":"^8.0.0","@dnd-kit/utilities":"^3.2.2","@emotion/css":"^11.13.4","@emotion/react":"^11.13.3","@emotion/server":"^11.11.0","@eslint-react/eslint-plugin":"^1.15.0","@ianvs/prettier-plugin-sort-imports":"^4.3.1","@inquirer/prompts":"^7.0.0","@madccc/duplicate-package-checker-webpack-plugin":"^1.0.0","@microflash/rehype-figure":"^2.1.1","@npmcli/run-script":"^9.0.1","@octokit/rest":"^21.0.2","@qixian.cs/github-contributors-list":"^2.0.2","@size-limit/file":"^11.1.6","@stackblitz/sdk":"^1.11.0","@testing-library/dom":"^10.4.0","@testing-library/jest-dom":"^6.6.2","@testing-library/react":"^16.0.1","@testing-library/user-event":"^14.5.2","@types/adm-zip":"^0.5.5","@types/ali-oss":"^6.16.11","@types/cli-progress":"^3.11.6","@types/fs-extra":"^11.0.4","@types/gtag.js":"^0.0.20","@types/http-server":"^0.12.4","@types/isomorphic-fetch":"^0.0.39","@types/jest":"^29.5.13","@types/jest-axe":"^3.5.9","@types/jest-environment-puppeteer":"^5.0.6","@types/jest-image-snapshot":"^6.4.0","@types/jquery":"^3.5.31","@types/jsdom":"^21.1.7","@types/lodash":"^4.17.12","@types/minimist":"^1.2.5","@types/node":"^22.7.7","@types/nprogress":"^0.2.3","@types/pixelmatch":"^5.2.6","@types/pngjs":"^6.0.5","@types/prismjs":"^1.26.4","@types/progress":"^2.0.7","@types/qs":"^6.9.16","@types/react":"^18.3.11","@types/react-copy-to-clipboard":"^5.0.7","@types/react-dom":"^18.3.1","@types/react-highlight-words":"^0.20.0","@types/react-resizable":"^3.0.8","@types/semver":"^7.5.8","@types/spinnies":"^0.5.3","@types/tar":"^6.1.13","@types/throttle-debounce":"^5.0.2","@types/warning":"^3.0.3","adm-zip":"^0.5.16","ali-oss":"^6.21.0","antd-img-crop":"^4.23.0","antd-style":"^3.7.0","antd-token-previewer":"^2.0.8",axios:"^1.7.7",chalk:"^4.1.2",cheerio:"^1.0.0","circular-dependency-plugin":"^5.2.2","cli-progress":"^3.12.0","cross-env":"^7.0.3","cross-fetch":"^4.0.0",dekko:"^0.2.1",dotenv:"^16.4.5",dumi:"~2.4.13","dumi-plugin-color-chunk":"^1.1.2",eslint:"^9.13.0","eslint-plugin-compat":"^6.0.1","eslint-plugin-jest":"^28.8.3","eslint-plugin-jsx-a11y":"^6.10.0","eslint-plugin-react-hooks":"^5.0.0","eslint-plugin-react-refresh":"^0.4.13","fast-glob":"^3.3.2","fetch-jsonp":"^1.3.0","fs-extra":"^11.2.0","gh-pages":"^6.2.0",glob:"^11.0.0",html2sketch:"^1.0.2","http-server":"^14.1.1",husky:"^9.1.6","identity-obj-proxy":"^3.0.0",immer:"^10.1.1","is-ci":"^3.0.1","isomorphic-fetch":"^3.0.0",jest:"^29.7.0","jest-axe":"^9.0.0","jest-canvas-mock":"^2.5.2","jest-environment-jsdom":"^29.7.0","jest-environment-node":"^29.7.0","jest-image-snapshot":"^6.4.0","jest-puppeteer":"^10.1.2",jquery:"^3.7.1",jsdom:"^25.0.1","jsonml-to-react-element":"^1.1.11","jsonml.js":"^0.1.0","lint-staged":"^15.2.10",lodash:"^4.17.21","lunar-typescript":"^1.7.5","lz-string":"^1.5.0",minimist:"^1.2.8",mockdate:"^3.0.5","node-fetch":"^3.3.2","node-notifier":"^10.0.1",nprogress:"^0.2.0",open:"^10.1.0",ora:"^8.1.0","p-all":"^5.0.0",pixelmatch:"^6.0.0",pngjs:"^7.0.0",prettier:"^3.3.3","pretty-format":"^29.7.0",prismjs:"^1.29.0",puppeteer:"^23.6.0",qs:"^6.13.0","rc-footer":"^0.6.8","rc-tween-one":"^3.0.6","rc-virtual-list":"^3.15.0",react:"^18.3.1","react-copy-to-clipboard":"^5.1.0","react-countup":"^6.5.3","react-dom":"^18.3.1","react-draggable":"^4.4.6","react-fast-marquee":"^1.6.5","react-highlight-words":"^0.20.0","react-infinite-scroll-component":"^6.1.0","react-intersection-observer":"^9.13.1","react-resizable":"^3.0.5","react-router-dom":"^6.27.0","react-sticky-box":"^2.0.5","regenerator-runtime":"^0.14.1","rehype-stringify":"^10.0.1",remark:"^15.0.1","remark-cli":"^12.0.1","remark-gfm":"^4.0.0","remark-lint":"^10.0.0","remark-lint-no-undefined-references":"^5.0.0","remark-preset-lint-recommended":"^7.0.0","remark-rehype":"^11.1.1",rimraf:"^6.0.1",runes2:"^1.1.4",semver:"^7.6.3",sharp:"^0.33.5","simple-git":"^3.27.0","size-limit":"^11.1.6",spinnies:"^0.5.1",sylvanas:"^0.6.1",tar:"^7.4.3","tar-fs":"^3.0.6",terser:"^5.36.0",tsx:"4.11.2",typedoc:"^0.26.10",typescript:"~5.6.3","vanilla-jsoneditor":"^2.0.0","vanilla-tilt":"^1.8.1",webpack:"^5.95.0","webpack-bundle-analyzer":"^4.10.2","xhr-mock":"^2.5.1","@ant-design/colors":"^7.1.0","@ant-design/cssinjs":"^1.21.1","@ant-design/cssinjs-utils":"^1.1.1","@ant-design/icons":"^5.5.1","@ant-design/react-slick":"~1.1.2","@babel/runtime":"^7.25.7","@ctrl/tinycolor":"^3.6.1","@rc-component/color-picker":"~2.0.1","@rc-component/mutate-observer":"^1.1.0","@rc-component/qrcode":"~1.0.0","@rc-component/tour":"~1.15.1","@rc-component/trigger":"^2.2.5",classnames:"^2.5.1","copy-to-clipboard":"^3.3.3",dayjs:"^1.11.11","rc-cascader":"~3.30.0","rc-checkbox":"~3.3.0","rc-collapse":"~3.9.0","rc-dialog":"~9.6.0","rc-drawer":"~7.2.0","rc-dropdown":"~4.2.0","rc-field-form":"~2.5.1","rc-image":"~7.11.0","rc-input":"~1.6.3","rc-input-number":"~9.3.0","rc-mentions":"~2.17.0","rc-menu":"~9.16.0","rc-motion":"^2.9.3","rc-notification":"~5.6.2","rc-pagination":"~4.3.0","rc-picker":"~4.8.1","rc-progress":"~4.0.0","rc-rate":"~2.13.0","rc-resize-observer":"^1.4.0","rc-segmented":"~2.5.0","rc-select":"~14.16.3","rc-slider":"~11.1.7","rc-steps":"~6.0.1","rc-switch":"~4.1.0","rc-table":"~7.48.1","rc-tabs":"~15.4.0","rc-textarea":"~1.8.2","rc-tooltip":"~6.2.1","rc-tree":"~5.10.1","rc-tree-select":"~5.24.4","rc-upload":"~4.8.1","rc-util":"^5.43.0","scroll-into-view-if-needed":"^3.1.0","throttle-debounce":"^5.0.2"},jsx:"import React from 'react';\nimport { Drawer, Typography } from 'antd';\nimport SemanticPreview from '../../../.dumi/components/SemanticPreview';\nimport useLocale from '../../../.dumi/hooks/useLocale';\nconst locales = {\n cn: {\n mask: '\u906E\u7F69\u5C42\u5143\u7D20',\n content: 'Drawer \u5BB9\u5668\u5143\u7D20',\n header: '\u5934\u90E8\u5143\u7D20',\n body: '\u5185\u5BB9\u5143\u7D20',\n footer: '\u5E95\u90E8\u5143\u7D20',\n },\n en: {\n mask: 'Mask element',\n content: 'Drawer container element',\n header: 'Header element',\n body: 'Body element',\n footer: 'Footer element',\n },\n};\nconst App = () => {\n const [locale] = useLocale(locales);\n return (\n <SemanticPreview\n semantics={[\n {\n name: 'mask',\n desc: locale.mask,\n version: '5.13.0',\n },\n {\n name: 'content',\n desc: locale.content,\n version: '5.13.0',\n },\n {\n name: 'header',\n desc: locale.header,\n version: '5.13.0',\n },\n {\n name: 'body',\n desc: locale.body,\n version: '5.13.0',\n },\n {\n name: 'footer',\n desc: locale.footer,\n version: '5.13.0',\n },\n ]}\n height={300}\n >\n <Drawer\n title=\"Title\"\n placement=\"right\"\n footer={<Typography.Link>Footer</Typography.Link>}\n closable={false}\n open\n getContainer={false}\n >\n <p>Some contents...</p>\n </Drawer>\n </SemanticPreview>\n );\n};\nexport default App;\n"}}),(0,s.jsx)("div",{className:"markdown",children:(0,s.jsxs)("h2",{id:"design-token",children:[(0,s.jsx)(p.default,{"aria-hidden":"true",tabIndex:"-1",href:"#design-token",sourceType:"a",children:(0,s.jsx)("span",{className:"icon icon-link"})}),"Design Token"]})}),(0,s.jsx)(a.default,{component:"Drawer"})]});}var g=function(){return(0,s.jsx)(l.DumiPage,{children:(0,s.jsx)(m.Suspense,{fallback:(0,s.jsx)(d.default,{}),children:(0,s.jsx)(u,{})})});};}}]); |