@kne-components/components-core 0.4.37 → 0.4.38

package/build/static/js/{2242.59326c7a.chunk.js → 2242.a5c4c8d4.chunk.js}

@@ -1,2 +1,2 @@
-"use strict";(self.webpackChunk_kne_components_components_core=self.webpackChunk_kne_components_components_core||[]).push([[2242,2723],{5633:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.Descriptions});t(55664);var a=t(87923)},9745:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(50196),o=t(13050),l=t(63743);const d={name:"FilePreview",summary:"<p>\u6587\u4ef6\u9884\u89c8</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"FilePreview_143ff",style:"",list:[{title:"HtmlPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FilePreview, HtmlPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <HtmlPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/demo2.html"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"PdfPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { PdfPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <PdfPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/resume.pdf"}\n      renderTextLayer={true}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"TextPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { TextPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <TextPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/demo.txt"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"ImagePreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { ImagePreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <ImagePreview url={getPublicPath("components-core") + "/mock/resume.png"} />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"unknown",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { UnknownPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <UnknownPreview url={getPublicPath("components-core") + "/mock/demo.des"} />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"office",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {default: FilePreview} = _FilePreview;\nconst {getPublicPath} = remoteLoader;\nconst {PureGlobal} = _Global;\nconst BaseExample = () => {\n    return (\n        <PureGlobal\n            preset={{\n                apis: {\n                    file: {\n                        getUrl: {\n                            loader:()=>{\n                                return "http://ieee802.org:80/secmail/docIZSEwEqHFr.doc";\n                            },\n                        },\n                    },\n                },\n            }}\n        >\n            <FilePreview\n                id="63bb2013-c743-4d2d-9d91-935c865f1c4d"\n                originName="docIZSEwEqHFr.doc"\n            />\n        </PureGlobal>\n    );\n};\n\nrender(<BaseExample/>);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]},{title:"audio",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { AudioPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <AudioPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/audio.wav"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]},{title:"video",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { VideoPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <VideoPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/video.mp4"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]}]}}},12027:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(87227),o=t(55199);const l={name:"StateBar",summary:"<p>\u7528\u4e8e State Bar</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stateOption</td>\n<td>state\u64cd\u4f5c\u5217\u8868</td>\n<td>string</td>\n<td>{key: string, tab: ReactNode}[]</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>\u5f53\u524d\u6fc0\u6d3b tab \u9762\u677f\u7684 key</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>\u5f53\u524dtab\u5c55\u793a\u6837\u5f0f</td>\n<td>'tab'\u3001'radio'\u3001'step'</td>\n<td>'tab'</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u4e8b\u4ef6\u8fd4\u56de\u9009\u4e2d\u7684key</td>\n<td>(value: string) =&gt; void</td>\n<td></td>\n</tr>\n<tr>\n<td>tabBarExtraContent</td>\n<td>\u5c55\u793a\u5728state bar\u53f3\u4fa7</td>\n<td>ReactNode</td>\n<td>null</td>\n</tr>\n<tr>\n<td>isInner</td>\n<td>\u5e95\u90e8\u7ebf\u5ef6\u5c55\u81f3\u603b\u957f</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<h3>Mapping</h3>\n<h4>stateOption</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>key</td>\n<td>\u5bf9\u5e94 activeKey</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>tab</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u6587\u5b57</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"StateBar_de00a",style:"",list:[{title:"State Bar",description:"State Bar",code:'const { default: StateBar } = _StateBar;\nconst { Button, Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [size, setSize] = useState("default");\n  const [isInner, setIsInner] = useState(false);\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={isInner}\n        options={[\n          { label: "inner", value: true },\n          { label: "normal", value: false },\n        ]}\n        onChange={(e) => {\n          setIsInner(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          { label: "large", value: "large" },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <StateBar\n        size={size}\n        isInner={isInner}\n        stateOption={[\n          { tab: "\u5168\u90e8", key: "1" },\n          { tab: "\u79d1\u76ee\u4e00", key: "2" },\n          {\n            tab: "\u79d1\u76ee\u4e8c",\n            key: "3",\n          },\n          { tab: "\u79d1\u76ee\u4e09", key: "4" },\n          { tab: "\u79d1\u76ee\u56db", key: "5" },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Radio State Bar",description:"Radio State Bar",code:'const { default: StateBar } = _StateBar;\nconst { Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseStateExample = () => {\n  const [size, setSize] = useState("default");\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          { label: "large", value: "large" },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <StateBar\n        size={size}\n        type="radio"\n        stateOption={[\n          { tab: "\u5168\u90e8", key: "1" },\n          { tab: "\u79d1\u76ee\u4e00", key: "2" },\n          { tab: "\u79d1\u76ee\u4e8c", key: "3" },\n          { tab: "\u79d1\u76ee\u4e09", key: "4" },\n          { tab: "\u79d1\u76ee\u56db", key: "5" },\n          { tab: "\u79d1\u76ee\u4e001", key: "22" },\n          { tab: "\u79d1\u76ee\u4e8c2", key: "33" },\n          { tab: "\u79d1\u76ee\u4e093", key: "44" },\n          { tab: "\u79d1\u76ee\u56db4", key: "55", style: { cursor: "copy" } },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseStateExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Step State Bar",description:"Step State Bar",code:'const { default: StateBar } = _StateBar;\n\nconst BaseStateExample = () => {\n  return (\n    <StateBar\n      type="step"\n      stateOption={[\n        { tab: "\u5168\u90e8", key: "1" },\n        { tab: "\u79d1\u76ee\u4e00", key: "2" },\n        { tab: "\u79d1\u76ee\u4e8c", key: "3" },\n        { tab: "\u79d1\u76ee\u4e09", key: "4" },\n        { tab: "\u79d1\u76ee\u56db", key: "5" },\n        { tab: "\u79d1\u76ee\u4e001", key: "22" },\n        { tab: "\u79d1\u76ee\u4e8c2", key: "33" },\n        { tab: "\u79d1\u76ee\u4e093", key: "44" },\n        { tab: "\u79d1\u76ee\u56db4", key: "55", className: "last" },\n      ]}\n      tabBarExtraContent={<div>\u6d4b\u8bd5</div>}\n    />\n  );\n};\n\nrender(<BaseStateExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a}]}]}}},17540:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(63361),o=t(63743),l=t(53132),d=t(94679),r=t(55199);const i={name:"Features",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u7cfb\u7edf\u4e2d\u9700\u8981\u901a\u8fc7\u4e00\u4e9b\u6761\u4ef6\uff0c\u7cfb\u7edf\u6027\u5730\u8ba9\u6574\u4e2a\u7cfb\u7edf\u7684\u67d0\u4e9b\u529f\u80fd\u5c4f\u853d\u6216\u8005\u6709\u53e6\u5916\u7684\u4e00\u4e9b\u5c55\u73b0\u65b9\u5f0f\uff0c\u53ef\u4ee5\u7528\u8be5\u7ec4\u4ef6\u6765\u5b9e\u73b0</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u5168\u5c40\u6027\u914d\u7f6e\uff0c\u4e00\u6b21\u6027\u58f0\u660e\uff0c\u907f\u514d\u5c06\u5404\u79cd\u5224\u65ad\u8bed\u53e5\u6563\u843d\u5728\u9879\u76ee\u5404\u5904\u9020\u6210\u96be\u4ee5\u7ef4\u62a4</li>\n<li>\u5177\u6709\u7279\u5f81\u5224\u65ad\u548c\u4f9d\u8d56\u6027\u5224\u65ad\uff0c\u5373\u5f53\u7cfb\u7edf\u63cf\u8ff0\u6027\u6587\u4ef6\u4e2d\u542b\u6709\u67d0\u4e2a\u6a21\u5757\u4e14\u542b\u6709\u6240\u6709\u4f9d\u8d56\u9879\u6a21\u5757\u5219\u5224\u65ad\u8be5\u7ec4\u4ef6\u4e3a\u6b63\u5e38\u72b6\u6001\uff0c\u5176\u4ed6\u60c5\u51b5\u4e3a\u5173\u95ed\u72b6\u6001</li>\n<li>\u53ef\u4ee5\u901a\u8fc7\u914d\u7f6e\u6587\u4ef6\u7ed9\u6b63\u5e38\u72b6\u6001\u548c\u5173\u95ed\u72b6\u6001\u7684\u7ec4\u4ef6\u4f20\u9012\u4e0d\u540c\u7684props\u6765\u63a7\u5236\u4e24\u79cd\u72b6\u6001\u4e0b\u7ec4\u4ef6\u7684\u4e0d\u540c\u903b\u8f91</li>\n<li>\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\uff0c\u7ec4\u4ef6\u7684id\u662f\u7b80\u5199\uff0c\u53ea\u9700\u8981\u4fdd\u8bc1\u540c\u4e00\u5c42\u7ea7\u7684\u7ec4\u4ef6id\u4e0d\u91cd\u590d\u5c31\u53ef\u4ee5\u4e86\uff0c\u5b83\u7684\u771f\u5b9eid\u4f1a\u901a\u8fc7\u5176\u6240\u5728\u7684\u4e0a\u4e0b\u7ea7\u5173\u7cfb\uff0c\u901a\u8fc7\u5192\u53f7\u5c06\u6bcf\u4e00\u5c42\u7684\u7ec4\u4ef6id\u94fe\u63a5\u8d77\u6765\u7ec4\u6210\u5176\u771f\u5b9e\u7684id\uff0c\u4f60\u53ef\u4ee5\u6253\u5f00\u8c03\u8bd5\u6a21\u5f0f\u67e5\u770b\u6bcf\u4e00\u4e2a\u7ec4\u4ef6\u5b9e\u9645\u8fd0\u884c\u65f6\u7684id\u548c\u5224\u65ad\u72b6\u6001</li>\n<li>\u7ec4\u4ef6\u7684type\u53ef\u4ee5\u8bbe\u7f6e\u4e3a\u4e09\u79cd\uff1asystem,module,feature\u3002system\u4e3a\u914d\u7f6e\u6587\u4ef6\u6700\u9876\u7ea7\u7ec4\u4ef6\uff0cmodule\u4e3a\u529f\u80fd\u6a21\u5757\uff0c\u9ed8\u8ba4Layout\u7684Page\u7ec4\u4ef6openFeatures\u4e3atrue\u65f6\u5b83\u7684name\u4f1a\u88ab\u8bbe\u7f6e\u6210module\uff0cfeature\u4e3a\u5177\u4f53\u7684\u529f\u80fd\u9879</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6a21\u5757\u6216\u529f\u80fdid\uff0c\u901a\u8fc7Global\u91cc\u9762\u7684preset\u7684features\u914d\u7f6e\u786e\u5b9a\u8be5\u6a21\u5757\u5f00\u542f\u6216\u8005\u5173\u95ed</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>features \u53c2\u6570\u8bbe\u7f6e</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>debug</td>\n<td>\u662f\u5426\u5f00\u542f\u8c03\u8bd5\u6a21\u5f0f\uff0c\u5f00\u542f\u540e\u63a7\u5236\u53f0\u4f1a\u6253\u5370\u6240\u6709\u6a21\u5757\u7684id\u548c\u5224\u65ad\u7ed3\u679c</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>profile</td>\n<td>\u6a21\u5757\u914d\u7f6e\u5217\u8868\uff0c\u5177\u4f53\u53c2\u8003\u4e0b\u9762profile\u53c2\u6570\u8bf4\u660e</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>profile\u53c2\u6570\u8bf4\u660e</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6a21\u5757\u7684\u552f\u4e00\u6807\u8bc6\u7b26\uff0c\u9700\u8981\u4fdd\u8bc1\u5728\u5f53\u524d\u4e00\u7ea7\u4e2d\u4e0d\u91cd\u590d\uff0c\u5b9e\u9645id\u4e3a\u6240\u6709\u7236\u7ea7\u7684id\u7528\u2019:\u2018\u94fe\u63a5\u7684\u5b57\u7b26\u4e32</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>\u53ef\u80fd\u53d6\u503c\u4e3asystem,module,feature\uff0c\u6ce8\u610f\u6700\u5916\u5c42\u7684type\u5fc5\u987b\u4e3asystem</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>\u6a21\u5757\u7684\u4e2d\u6587\u540d\u79f0\uff0c\u4e0d\u53c2\u4e0e\u5224\u65ad\uff0c\u53ea\u6807\u8bc6\u6a21\u5757\u540d\u5e2e\u52a9\u5f00\u53d1\u8005\u8bc6\u522b</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>close</td>\n<td>\u6a21\u5757\u662f\u5426\u5173\u95ed\uff0c\u53ef\u4ee5\u7f3a\u7701\u8be5\u503c\uff0c\u7f3a\u7701\u65f6profile\u91cc\u9762\u5b58\u5728\u67d0id\u7684\u6a21\u5757\u5373\u4e3a\u6a21\u5757\u5f00\u542f\uff0c\u4e0d\u5b58\u5728\u5373\u4e3a\u5173\u95ed\u3002\u5728\u7279\u6b8a\u60c5\u51b5\u4e0b\uff0c\u5728profile\u5b58\u5728\u8be5\u6a21\u5757\u914d\u7f6e\u4f46\u662f\u5e0c\u671b\u5176\u5173\u95ed\u65f6\u53ef\u4ee5\u663e\u793a\u6307\u5b9a\u8be5\u53c2\u6570\u4e3atrue\u6765\u5173\u95ed\u6a21\u5757</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>dependencies</td>\n<td>\u4f9d\u8d56\u6a21\u5757\u5217\u8868\uff0c\u6bcf\u4e00\u9879\u4e3a\u4e00\u4e2a\u6a21\u5757id\uff08\u8be5id\u5fc5\u987b\u4e3a\u5b8c\u6574\u7684id\u4e32\uff0c\u5373\u5e26\u6709\u6240\u6709\u7236\u7ea7id\u7684\u7528\u2019:\u2018\u94fe\u63a5\u8d77\u6765\u7684\u5b57\u7b26\u4e32\uff09,\u5f53\u6240\u6709id\u7684\u6307\u4ee3\u6a21\u5757\u90fd\u88ab\u5224\u65ad\u5f00\u542f\u65f6\uff0c\u8be5\u6a21\u5757\u88ab\u5224\u65ad\u4e3a\u5f00\u542f</td>\n<td>array[string]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>options</td>\n<td>\u6a21\u5757\u5f00\u542f\u65f6\u83b7\u53d6\u7684\u53c2\u6570</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rejectedOptions</td>\n<td>\u6a21\u5757\u5173\u95ed\u65f6\u83b7\u53d6\u7684\u53c2\u6570</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u88ab\u63a7\u5236\u7684\u6a21\u5757\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230({isPass,options})\u53c2\u6570 isPass\u4e3a\u6a21\u5757\u662f\u5426\u5f00\u542f\uff0coptions\u5728\u6a21\u5757\u5f00\u542f\u65f6\u4e3aoptions\u53c2\u6570\uff0c\u5728\u6a21\u5757\u5173\u95ed\u65f6\u4e3arejectedOptions\u53c2\u6570\uff0c\u5176\u4e0d\u4e3afunction\u7c7b\u578b\u65f6\u5f53\u6a21\u5757\u5173\u95ed\u5219\u4e0d\u663e\u793achildren\uff0c\u6a21\u5757\u5f00\u542f\u65f6\u6b63\u5e38\u663e\u793achildren</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"Features_98f77",style:"",list:[{title:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u4e00\u5f00\u542f\u529f\u80fd\u4e8c\u5173\u95ed\u7684\u60c5\u51b5",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u4e00\u5f00\u542f\u529f\u80fd\u4e8c\u5173\u95ed\u7684\u60c5\u51b5",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                    dependencies: ["erc:client"],\n                  },\n                ],\n              },\n              {\n                id: "position",\n                type: "module",\n                name: "\u804c\u4f4d",\n                children: [\n                  {\n                    id: "position-list",\n                    type: "feature",\n                    options: [],\n                    rejectedOptions: [],\n                  },\n                ],\n              },\n              {\n                id: "client",\n                type: "module",\n                name: "\u5ba2\u6237",\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <PermissionsPage name="home" openFeatures>\n          <Features id="test">\u529f\u80fd\u6a21\u5757\u4e00</Features>\n          <Features id="test2">\u529f\u80fd\u6a21\u5757\u4e8c</Features>\n        </PermissionsPage>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l}]},{title:"\u5c55\u793a\u4e86\u6253\u5f00\u9875\u9762\u7279\u6027\u914d\u7f6e\u5f00\u542f\u548c\u5173\u95ed\u7684\u60c5\u51b5",description:"\u5c55\u793a\u4e86\u6253\u5f00\u9875\u9762\u7279\u6027\u914d\u7f6e\u5f00\u542f\u548c\u5173\u95ed\u7684\u60c5\u51b5",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst { Route, Routes } = Router;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                  },\n                  {\n                    id: "test2",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd2",\n                    dependencies: ["erc:client"],\n                  },\n                ],\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Layout\n        navigation={{\n          isFixed: false,\n          list: [\n            {\n              key: "position",\n              title: "\u804c\u4f4d",\n              path: "/position",\n            },\n            {\n              key: "client",\n              title: "\u5ba2\u6237",\n              path: "/client",\n            },\n          ],\n        }}\n      >\n        <Routes>\n          <Route\n            index\n            element={\n              <PermissionsPage name="home" openFeatures>\n                home\u9875\u9762\u6a21\u5757\n                <div>\n                  <Features id="test">\u5f00\u542f\u6a21\u5757</Features>\n                  <Features id="test2">\u5173\u95ed\u6a21\u5757</Features>\n                </div>\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path="/position"\n            element={\n              <PermissionsPage name="position" openFeatures>\n                position\u9875\u9762\u6a21\u5757\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path="/client"\n            element={\n              <PermissionsPage name="client">\n                client\u9875\u9762\u6a21\u5757,\u672a\u6253\u5f00features\n              </PermissionsPage>\n            }\n          />\n        </Routes>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l},{name:"Router",packageName:"react-router-dom",component:d}]},{title:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u5f00\u542f\u548c\u5173\u95ed\u53c2\u6570\u83b7\u53d6",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u5f00\u542f\u548c\u5173\u95ed\u53c2\u6570\u83b7\u53d6",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst { useState } = React;\nconst { Button, Space } = antd;\nconst BaseExample = () => {\n  const [close, setClose] = useState(false);\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                    options: {\n                      state: "\u5f00\u542f",\n                    },\n                    rejectedOptions: {\n                      state: "\u5173\u95ed",\n                    },\n                    close: close,\n                  },\n                ],\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Space direction="vertical">\n        <Button\n          onClick={() => {\n            setClose((value) => !value);\n          }}\n        >\n          \u5207\u6362\n        </Button>\n        <Layout navigation={{ isFixed: false }}>\n          <PermissionsPage name="home" openFeatures>\n            <Features id="test">\n              {({ isPass, options }) => {\n                return isPass\n                  ? "\u6a21\u5757\u5f00\u542f,options:" + JSON.stringify(options)\n                  : "\u6a21\u5757\u5173\u95ed,options:" + JSON.stringify(options);\n              }}\n            </Features>\n          </PermissionsPage>\n        </Layout>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l},{name:"antd",packageName:"antd",component:r}]}]}}},18495:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"FetchButton",summary:"<p>\u7528\u4e8e\u70b9\u51fb\u540e\u52a0\u8f7d\u6570\u636e\u7684\u6309\u94ae</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"FetchButton_8e1c9",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FetchButton } = _FetchButton;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <FetchButton\n        api={{\n          loader: async () => {\n            return new Promise((resolve, reject) => {\n              setTimeout(() => {\n                resolve({ data: "xxxxx" });\n              }, 1000);\n            });\n          },\n        }}\n        onClick={(data) => {\n          console.log(data);\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </FetchButton>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FetchButton",packageName:"@components/FetchButton",component:t(86454)}]}]}}},20031:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(24474),o=t(13050),l=t(21079),d=t(55199);const r={name:"FileList",summary:"<p>\u6587\u4ef6\u5217\u8868\u5c55\u793a\uff0c\u9884\u89c8\uff0c\u4e0a\u4f20</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td></td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"FileList_a785a",style:"",list:[{title:"\u5b8c\u6574\u793a\u4f8b",description:"\u63d0\u4f9b\u4e00\u4e2a\u4e0a\u4f20\u6587\u4ef6\uff0c\u663e\u793a\u6587\u4ef6\u5217\u8868\uff0c\u9884\u89c8\u6587\u4ef6\u7684\u5c55\u793a",code:'const { default: FileList } = _FileList;\nconst { createWithRemoteLoader, getPublicPath } = remoteLoader;\nconst { useState } = React;\nconst { uniqueId } = lodash;\n\nconst ajax = {\n  postForm: (config) => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              id: "uBFNeYQBnHRXlZaTGZpA",\n              originalName: config.file.name,\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n};\n\nconst apis = {\n  onSave: async ({ data }) => {\n    return {\n      ossId: uniqueId("oss_"),\n      filename: data.originalName,\n      date: new Date(),\n      userName: "\u54c8\u54c8\u54c8",\n    };\n  },\n  onDelete: (item) => {},\n};\n\nconst preset = {\n  apis: {\n    file: {\n      getUrl: {\n        loader: async ({ params }) => {\n          const mapping = {\n            "01": "/avatar.png",\n            "02": "/mock/resume.pdf",\n            "03": "/mock/resume.pdf",\n          };\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(getPublicPath("components-core") + mapping["03"]);\n            }, 100);\n          });\n        },\n      },\n    },\n    previewOffice: {\n      loader: async () => {\n        return new Promise((resolve) => {\n          setTimeout(() => {\n            resolve({\n              name: "\u6d4b\u8bd5\u5f00\u53d1_\u590f\u6c38\u6631_\u672c\u79d1_5\u5e74.docx",\n              data: [\n                {\n                  id: "gWw26Y0BeK_D6zxND5vh",\n                  originalName: "attachment/gWw26Y0BeK_D6zxND5vh.pdf",\n                  url:\n                    getPublicPath("components-core") +\n                    "/mock/resume.pdf",\n                },\n              ],\n            });\n          }, 0);\n        });\n      },\n    },\n    ossUpload: ({ file }) => {\n      return ajax.postForm({ file });\n    },\n  },\n};\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-core:Global@PureGlobal"],\n})(({ remoteModules }) => {\n  const [PureGlobal] = remoteModules;\n  const [list, setList] = useState([\n    {\n      id: "1",\n      filename: "avatar.pdf",\n    },\n    {\n      id: "2",\n      filename: "\u6d4b\u8bd5\u5f00\u53d1_\u590f\u6c38\u6631_\u672c\u79d1_5\u5e74.docx",\n    },\n  ]);\n  return (\n    <PureGlobal preset={preset}>\n      <FileList\n        defaultPreviewFileId="1"\n        list={list}\n        setList={setList}\n        apis={apis}\n      />\n    </PureGlobal>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"lodash",packageName:"lodash",component:l}]},{title:"\u4e0a\u4f20\u6587\u4ef6\u5217\u8868",description:"\u5c55\u793a\u4e00\u4e2a\u4e0a\u4f20\u6587\u4ef6\u5c55\u793a\u4e0a\u4f20\u6210\u529f\u6587\u4ef6\u5217\u8868",code:'const { FileUpload } = _FileList;\nconst { createWithRemoteLoader, getPublicPath } = remoteLoader;\nconst { useState } = React;\nconst { uniqueId } = lodash;\n\nconst ajax = {\n  postForm: (config) => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              id: "uBFNeYQBnHRXlZaTGZpA",\n              originalName: config.file.name,\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n};\n\nconst apis = {\n  onSave: async ({ data }) => {\n    const id = uniqueId();\n    return {\n      ossId: id,\n      filename: data.originalName,\n      date: new Date(),\n      userName: "\u54c8\u54c8\u54c8",\n    };\n  },\n  onDelete: (item) => {},\n};\n\nconst preset = {\n  apis: {\n    file: {\n      getUrl: {\n        loader: async ({ params }) => {\n          const mapping = {\n            "01": "/avatar.png",\n            "02": "/mock/demo.html",\n            "03": "/mock/1_\u738b\u6676\u7b80\u5386-2023_06_2.pdf",\n          };\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(getPublicPath("components-core") + mapping["03"]);\n            }, 1000);\n          });\n        },\n      },\n    },\n    ossUpload: ({ file }) => {\n      return ajax.postForm({ file });\n    },\n  },\n};\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-core:Global@PureGlobal"],\n})(({ remoteModules }) => {\n  const [PureGlobal] = remoteModules;\n  const [list, setList] = useState([]);\n  return (\n    <PureGlobal preset={preset}>\n      <FileUpload list={list} setList={setList} apis={apis} />\n      <div>\u975e\u53d7\u63a7\u60c5\u51b5</div>\n      <FileUpload\n        setList={(fileList) => {\n          console.log(">>>>>>>>>>", fileList);\n        }}\n        apis={apis}\n      />\n    </PureGlobal>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"lodash",packageName:"lodash",component:l}]},{title:"\u62d6\u62fd\u4e0a\u4f20",description:"\u5c55\u793a\u4e00\u4e2a\u62d6\u62fd\u4e0a\u4f20\u6587\u4ef6\uff0c\u5f97\u5230File\u5bf9\u8c61",code:'const { DragArea, DragAreaOuter, UploadButton, DragButton } = _FileList;\nconst { Row, Col, Divider, Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <DragAreaOuter\n      title={\n        <Row>\n          <Col flex={1}>\u6807\u9898</Col>\n          <Col>\n            <Space split={<Divider type="vertical" />}>\n              <DragButton />\n              <UploadButton>\u4e0a\u4f20</UploadButton>\n            </Space>\n          </Col>\n        </Row>\n      }\n      onFileSelected={(fileList) => {\n        console.log(fileList);\n      }}\n    >\n      <DragArea />\n    </DragAreaOuter>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"antd",packageName:"antd",component:d}]}]}}},21763:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(53132),o=t(63743),l=t(55199);const d={name:"Layout",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6bcf\u4e2a\u767b\u5f55\u540e\u7684\u7cfb\u7edf\u9875\u9762\u90fd\u5e94\u8be5\u5728Layout\u7684\u6846\u67b6\u4e4b\u4e0b\uff0c\u5b83\u5b9a\u4e49\u4e86\u9875\u9762\u7684\u57fa\u672c\u6846\u67b6\u3002\u6839\u636e\u8bbe\u8ba1\u5bf9\u4e8e\u9875\u9762\u7684\u4e0d\u540c\u8981\u6c42\uff0c\u9002\u5f53\u9009\u62e9\u4e0d\u540c\u7684\u7ec4\u5408</p>\n<h3>\u7279\u70b9</h3>\n<p>Layout\u5c06\u6574\u4e2a\u9875\u9762\u5212\u5206\u6210\u4ee5\u4e0b\u51e0\u4e2a\u533a\u57df</p>\n<ol>\n<li>\u5bfc\u822a\u533a</li>\n<li>\u5185\u5bb9\u533a</li>\n<li>\u5de6\u83dc\u5355\u533a</li>\n<li>\u53f3\u64cd\u4f5c\u533a</li>\n<li>\u9875\u5934\u533a</li>\n<li>\u9875\u5934\u4fe1\u606f\u533a</li>\n<li>\u9875\u9762\u6807\u9898\u533a</li>\n</ol>\n<p>\u901a\u8fc7\u7ed9Page\u914d\u7f6e\u4e0d\u540c\u7684\u53c2\u6570\u5b9e\u73b0\u4e0d\u540c\u533a\u57df\u7684\u663e\u793a</p>\n<h3>\u6ce8\u610f</h3>\n<ul>\n<li>Page\u7684name\u53c2\u6570\u5fc5\u987b\u8981\u4f20\uff0c\u7528\u6765\u5728\u9875\u9762\u8df3\u8f6c\u65f6\u786e\u5b9aPage\u662f\u4e0d\u662f\u540c\u4e00\u4e2a\uff0c\u51b3\u5b9a\u7740Page\u662f\u5426\u8d70install\u5468\u671f</li>\n<li>Page\u7ec4\u4ef6\u7684\u53c2\u6570\u662f\u901a\u8fc7Context\u4fdd\u5b58\u5728Layout\u4e2d\u7684\uff0c\u8fd9\u6837\u505a\u7684\u76ee\u7684\u662f\u4e3a\u4e86\u8ba9\u9875\u9762\u8df3\u8f6c\u65f6\uff0c\u9664\u9875\u9762\u533a\u4ee5\u5916\u7684\u533a\u57df\u5728\u524d\u540e\u4fe9\u9875\u9762\u5dee\u522b\u4e0d\u5927\u7684\u60c5\u51b5\u4e0b\u8d70\u66f4\u65b0\u5468\u671f\u800c\u4e0d\u662finstall\u5468\u671f\uff0c\u4ee5\u6b64\u5e26\u6765\u66f4\u5feb\u7684\u6e32\u67d3\u901f\u5ea6\u907f\u514d\u4e0d\u5fc5\u8981\u7684\u91cd\u590d\u5b89\u88c5\u548c\u5378\u8f7d</li>\n<li>\u8bf7\u5c3d\u91cf\u901a\u8fc7Page\u63d0\u4f9b\u7684\u53c2\u6570\u6765\u914d\u7f6e\u51fa\u8bbe\u8ba1\u8981\u6c42\u7684\u9875\u9762\uff0c\u4e0d\u8981\u81ea\u884c\u7528css\u5b9e\u73b0\uff0c\u4ee5\u4fbf\u4e8eLayout\u7ec4\u4ef6\u80fd\u4ece\u6574\u4f53\u63a7\u5236\u9875\u9762\u7684\u57fa\u672c\u5f62\u5f0f\u548c\u4e0d\u540c\u533a\u57df\u7684padding\u548cmargin\uff0c\u8ba9\u7cfb\u7edf\u66f4\u52a0\u7edf\u4e00\u5316\u6807\u51c6\u5316</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>navigation</td>\n<td>\u5bfc\u822a\u53c2\u6570\u53c2\u8003 Navigation \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u4e00\u822c\u653e\u7f6ePage\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Page</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>menu</td>\n<td>\u5de6\u83dc\u5355\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filter</td>\n<td>\u9875\u9762\u6807\u9898\u4f4d\u7f6e\u7b5b\u9009\u5668\u53c2\u6570,\u53c2\u8003 Filter \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>menuOpen</td>\n<td>\u5de6\u83dc\u5355\u662f\u5426\u9ed8\u8ba4\u6253\u5f00</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuWidth</td>\n<td>\u5de6\u83dc\u5355\u5bbd\u5ea6</td>\n<td>string</td>\n<td>240px</td>\n</tr>\n<tr>\n<td>menuFixed</td>\n<td>\u5de6\u83dc\u5355\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuCloseButton</td>\n<td>\u63a7\u5236\u5de6\u83dc\u5355\u663e\u793a\u9690\u85cf\u7684\u6309\u94ae\u662f\u5426\u663e\u793a</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>header</td>\n<td>\u9875\u5934\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>headerFixed</td>\n<td>\u9875\u5934\u533a\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>headerInfo</td>\n<td>\u9875\u5934\u4fe1\u606f\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>backUrl</td>\n<td>\u53f3\u4fa7\u5185\u5bb9\u533a\u7684\u6807\u9898\u524d\u5c55\u793a\u8fd4\u56de\u6309\u94ae\uff0c\u5e76\u8fd4\u56de\u5230\u8be5url</td>\n<td>\u53c2\u8003 useNavigate</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u9875\u9762\u6807\u9898</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleExtra</td>\n<td>\u9875\u9762\u6807\u9898\u533a\u53f3\u4fa7\u4f4d\u7f6e\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleLeftExtra</td>\n<td>\u9875\u9762\u6807\u9898\u533a\u5de6\u4fa7\u4f4d\u7f6e\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>noMargin</td>\n<td>\u9875\u9762\u5185\u5bb9\u533a\u662f\u5426\u53bb\u6389Margin</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>noPadding</td>\n<td>\u9875\u9762\u5185\u5bb9\u533a\u662f\u5426\u53bb\u6389Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>option</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>optionWidth</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5bbd\u5ea6</td>\n<td>string</td>\n<td>400px</td>\n</tr>\n<tr>\n<td>optionNoPadding</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u662f\u5426\u53bb\u6389Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFixed</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFooter</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5e95\u90e8\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openFeatures</td>\n<td>Page\u662f\u5426\u542f\u7528Features\uff0c\u542f\u7528\u65f6\u5982\u679c\u914d\u7f6e\u6587\u4ef6\u4e2d\u6ca1\u6709\u8be5\u6a21\u5757id\u5219\u5224\u65ad\u4e3a\u6a21\u5757\u5173\u95ed\uff0c\u4f1a\u5c06name\u4f5c\u4e3aFeatures\u7684id\u8fdb\u884c\u8bbe\u7f6e</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<h3>Affix</h3>\n<p>\u53ef\u4ee5\u63a7\u5236\u5176\u4e2d\u7684\u5185\u5bb9\u662f\u5426\u662ffixed\u5e03\u5c40</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>isFixed</td>\n<td>\u5185\u5bb9\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>offsetTop</td>\n<td>\u8ddd\u79bb\u7a97\u53e3\u9876\u90e8\u8fbe\u5230\u6307\u5b9a\u504f\u79fb\u91cf\u540e\u89e6\u53d1</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>offsetBottom</td>\n<td>\u8ddd\u79bb\u7a97\u53e3\u5e95\u90e8\u8fbe\u5230\u6307\u5b9a\u504f\u79fb\u91cf\u540e\u89e6\u53d1</td>\n<td>number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u56fa\u5b9a\u72b6\u6001\u6539\u53d8\u65f6\u89e6\u53d1\u7684\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Menu</h3>\n<p>\u663e\u793a\u4e00\u4e2a\u83dc\u5355\uff0c\u6700\u591a\u652f\u6301\u4e24\u7ea7\uff0c\u652f\u6301\u7b2c\u4e00\u7ea7\u5c55\u5f00\u6536\u8d77\uff0c\u652f\u6301\u8def\u5f84\u5339\u914d\u81ea\u52a8\u9ad8\u4eae</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>\u83dc\u5355\u9879</td>\n<td>array[object]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>\u83dc\u5355\u9879\u663e\u793a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>\u83dc\u5355\u9879\u7684key\u8981\u6c42\u5fc5\u987b\u552f\u4e00</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].iconType</td>\n<td>\u83dc\u5355\u9879\u524d\u9762\u7684icon\u7c7b\u578b\u53c2\u8003 Icon\u7ec4\u4ef6\u7684type\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].path</td>\n<td>\u83dc\u5355\u9879\u7684\u8def\u5f84</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].onClick</td>\n<td>\u83dc\u5355\u9879\u70b9\u51fb\u89e6\u53d1\u4e8b\u4ef6\uff0c\u6ce8\u610f\uff1a\u5982\u679c\u83dc\u5355\u9879\u5df2\u7ecf\u4f20\u5165path\u53c2\u6570\u5219\u8be5\u53c2\u6570\u4e0d\u751f\u6548</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>\u83dc\u5355\u9879\u7684\u7b2c\u4e8c\u7ea7\u9879\u5217\u8868\uff0c\u53c2\u8003items\u53c2\u6570\u3002\u6ce8\u610f\u8be5\u7ec4\u4ef6\u53ea\u652f\u6301\u4e24\u7ea7\u83dc\u5355\uff0c\u6240\u4ee5\u8be5\u53c2\u6570\u5185\u90e8\u7684\u83dc\u5355\u9879\u4e0d\u518d\u652f\u6301children\u53c2\u6570</td>\n<td>array[object]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>currentKey</td>\n<td>\u5f53\u524d\u88ab\u9009\u4e2d\u7684\u83dc\u5355\u9879\u7684key\uff0c\u5982\u679c\u83dc\u5355\u9879\u53c8path\u53c2\u6570\uff0c\u4e0d\u9700\u8981\u4f20\u9012\u8be5\u53c2\u6570\uff0c\u7ec4\u4ef6\u4f1a\u6839\u636e\u8def\u7531\u81ea\u52a8\u5224\u65ad\u9009\u4e2d\u9879</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>currentKey\u4ea7\u751f\u4fee\u6539\u65f6\u89e6\u53d1\u51fd\u6570\uff0c\u6ce8\u610f\uff1a\u5982\u679c\u83dc\u5355\u9879\u5df2\u7ecf\u4f20\u5165path\u53c2\u6570\u5219\u8be5\u53c2\u6570\u4e0d\u751f\u6548</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>allowCollapsed</td>\n<td>\u662f\u5426\u5141\u8bb8\u4e00\u7ea7\u83dc\u5355\u6536\u8d77</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>defaultOpenKeys</td>\n<td>\u521d\u59cb\u5c55\u5f00\u7684 SubMenu \u83dc\u5355\u9879 key \u6570\u7ec4</td>\n<td>string[]</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PermissionsPage</h3>\n<p>\u52a0\u5165\u6743\u9650\u5224\u65ad\u7684Page\uff0c\u9519\u8bef\u7c7b\u578b\u9ed8\u8ba4\u4e3aerror\uff0c\u5373\u5728\u8be5\u9875\u9762\u6ca1\u6709\u6743\u9650\u65f6\u663e\u793a\u9519\u8bef</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>\u6743\u9650\u5217\u8868\u53c2\u8003 Permissions \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"Layout_ebd9b",style:".Layout_ebd9b .layout-content {\n  color: #fff;\n  background: var(--primary-color-4);\n  height: 100%;\n  text-align: center;\n  line-height: 300px;\n}\n.Layout_ebd9b .with-title-layout-content {\n  height: 100%;\n}\n.Layout_ebd9b .layout-menu {\n  background: #ff9c6e;\n  color: #fff;\n  height: 110vh;\n  text-align: center;\n  line-height: 300px;\n}\n.Layout_ebd9b .header {\n  background: #ff9c6e;\n  height: 100px;\n  padding: 10px;\n  color: #fff;\n}\n.Layout_ebd9b .right-options {\n  background: var(--primary-color-4);\n  height: 110vh;\n  color: #fff;\n}\n.Layout_ebd9b .header-info {\n  padding: 10px;\n  height: 100px;\n  background: var(--primary-color-4);\n  color: #fff;\n}",list:[{title:"\u57fa\u7840\u4e0a\u4e0b\u5e03\u5c40",description:"\u5c55\u793a\u6700\u57fa\u7840\u7684\u4e0a\u5bfc\u822a\u680f\uff0c\u4e0b\u5185\u5bb9\u7684\u5e03\u5c40",code:'const { default: Layout, Page } = _Layout;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        enums: {\n          helperGuide: () => [\n            {\n              value: "base-detail",\n              content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863",\n              url: "/",\n            },\n          ],\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <Page name="base" helperGuideName="base-detail">\n          <div className="layout-content">\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Layout",packageName:"@components/Layout",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5e26\u6709\u5de6\u4fa7\u83dc\u5355\u5e03\u5c40",description:"\u5c55\u793a\u5e26\u6709\u5de6\u4fa7\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page, Menu } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        name="left-menu"\n        menuFixed={false}\n        menu={\n          <Menu\n            items={[\n              {\n                label: "\u7236\u7ea7\u6807\u98981",\n                key: "p-0",\n                iconType: "icon-zhanghaodenglu",\n                children: [\n                  {\n                    label: "\u5b50\u6807\u98981",\n                    key: "s-0",\n                    path: "/link1",\n                  },\n                  {\n                    label: "\u5b50\u6807\u98982",\n                    key: "s-1",\n                    path: "/link2",\n                  },\n                ],\n              },\n              {\n                label: "\u7236\u7ea7\u6807\u98982",\n                key: "p-1",\n                iconType: "icon-zhanghaodenglu",\n                children: [\n                  {\n                    label: "\u5b50\u6807\u98981",\n                    key: "s-2",\n                    path: "/link3",\n                  },\n                  {\n                    label: "\u5b50\u6807\u98982",\n                    key: "s-3",\n                    path: "/link4",\n                  },\n                ],\n              },\n              {\n                label: "\u7236\u7ea7\u6807\u98983",\n                key: "p-2",\n                iconType: "icon-zhanghaodenglu",\n                path: "/link5",\n              },\n            ]}\n          />\n        }\n        titleExtra={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        backUrl={"/"}\n        title="\u6807\u9898"\n      >\n        <div className="layout-content with-title-layout-content">\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5de6\u4fa7\u56fa\u5b9a\u5e26Header",description:"\u5c55\u793a\u5e26\u6709header\u7684\u5de6\u4fa7\u56fa\u5b9a\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Space className="container" direction="vertical">\n      <Layout navigation={{ isFixed: false }}>\n        <Page\n          name="with-header"\n          helperGuideName="base-detail"\n          menu={<div className="layout-menu">\u5de6\u4fa7\u83dc\u5355\u533a</div>}\n          titleExtra={\n            <Space>\n              <Button type="primary">\u65b0\u5efa</Button>\n            </Space>\n          }\n          title="\u6807\u9898"\n          hideCloseSvg={true}\n          headerHeight="40px"\n          menuFixed={false}\n          header={<div className="header">header</div>}\n          headerFixed={false}\n          headerInfo={<div className="header-info">header info\u533a\u57df</div>}\n        >\n          <div>\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      enums: {\n        helperGuide: () => [\n          {\n            value: "base-detail",\n            content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863",\n            url: "/",\n          },\n        ],\n      },\n    }}\n  >\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u53f3\u4fa7\u56fa\u5b9a",description:"\u5c55\u793a\u5e26\u6709header\u7684\u53f3\u4fa7\u56fa\u5b9a\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        name="fix-right-menu"\n        optionFixed={false}\n        option={<div className="right-options">\u53f3\u4fa7\u64cd\u4f5c\u533a\u57df</div>}\n        optionFooter={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        titleExtra={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        title="\u6807\u9898"\n        header={<div className="header">header</div>}\n        headerFixed={false}\n        menuFixed={false}\n      >\n        <div>\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5e26\u6709filter\u7684\u5217\u8868\u9875",description:"\u5c55\u793a\u5e26\u6709filter\u7684\u5217\u8868\u9875",code:'const { default: Layout, Page } = layout;\nconst {\n  InputFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  getFilterValue,\n} = filter;\nconst { useState } = React;\nconst { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  const [filter, setFilter] = useState([]);\n  return (\n    <PureGlobal preset={{}}>\n      <Layout navigation={{ isFixed: false }}>\n        <Page\n          name="base"\n          helperGuideName="base-detail"\n          titleExtra={\n            <Space>\n              <Button type="primary">\u6dfb\u52a0</Button>\n            </Space>\n          }\n          filter={{\n            extraExpand: (\n              <Button type="primary" size="small">\n                \u8ba2\u9605\u7b5b\u9009\u9879\n              </Button>\n            ),\n            value: filter,\n            onChange: (value) => {\n              setFilter(value);\n              console.log(getFilterValue(value));\n            },\n            list: [\n              [\n                <InputFilterItem label="\u6587\u5b57" name="text" />,\n                <CityFilterItem label="\u57ce\u5e02" name="city" />,\n                <AdvancedSelectFilterItem\n                  label="\u9ad8\u7ea7\u9009\u62e9"\n                  name="select"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: "\u7b2c\u4e00\u9879", value: 1 },\n                          { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <UserFilterItem\n                  label="\u7528\u6237\u9009\u62e9"\n                  name="user"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7528\u6237\u4e00",\n                            value: 1,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e8c",\n                            value: 2,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e09",\n                            value: 3,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <FunctionSelectFilterItem\n                  label="\u804c\u80fd\u9009\u62e9"\n                  name="function"\n                  onlyAllowLastLevel\n                  single\n                />,\n                <IndustrySelectFilterItem\n                  label="\u884c\u4e1a\u9009\u62e9"\n                  name="industry"\n                  onlyAllowLastLevel\n                />,\n              ],\n              [\n                <UserFilterItem\n                  label="\u804c\u4f4d\u534f\u52a9\u4eba"\n                  name="position_user"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7528\u6237\u4e00",\n                            value: 1,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e8c",\n                            value: 2,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e09",\n                            value: 3,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n              ],\n            ],\n          }}\n        >\n          <div className="layout-content">\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o},{name:"filter",packageName:"@components/Filter",component:t(73604)}]},{title:"\u5de6\u4fa7\u5bfc\u822a\u83dc\u5355",description:"\u5c55\u793a\u4e00\u4e2a\u5de6\u4fa7\u5bfc\u822a\u83dc\u5355",code:'const { Menu } = layout;\nconst { Space } = antd;\nconst { useState } = React;\n\nconst ControlMenu = () => {\n  const [current, setCurrent] = useState();\n  return (\n    <Menu\n      currentKey={current}\n      onChange={setCurrent}\n      items={[\n        {\n          label: "\u7236\u7ea7\u6807\u98981",\n          key: "p-0",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-0",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-1",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98982",\n          key: "p-1",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-2",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-3",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98983",\n          key: "p-2",\n          iconType: "icon-zhanghaodenglu",\n        },\n      ]}\n    />\n  );\n};\n\nconst Example = () => {\n  return (\n    <Space size={10}>\n      <Menu\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <Menu\n        items={[\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-0",\n            path: "/link1",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-1",\n            path: "/link2",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-2",\n            path: "/link3",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-3",\n            path: "/link4",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <ControlMenu />\n    </Space>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l}]},{title:"PageHeader",description:"\u9875\u9762\u5934",code:'const { default: Layout, Page, Menu, PageHeader } = layout;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        menu={<div className="layout-menu">\u5de6\u4fa7\u83dc\u5355\u533a</div>}\n        title="\u6807\u9898"\n        hideCloseSvg={true}\n        menuFixed={false}\n        name="pageHeaderLayout"\n        header={\n          <PageHeader\n            iconType="icon-color-shenpi-biaoti"\n            title="\u8be6\u60c5\u9875\u540d\u79f0"\n            info="\u7f16\u53f7:85767"\n            options={[\n              {\n                children: "\u65b0\u5efa",\n              },\n              {\n                children: "\u64cd\u4f5c1",\n              },\n              {\n                children: "\u64cd\u4f5c2",\n              },\n              {\n                children: "\u64cd\u4f5c3",\n              },\n              {\n                children: "\u64cd\u4f5c4",\n              },\n            ]}\n            tags={["\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f"]}\n          />\n        }\n        headerFixed={false}\n      >\n        <div>\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l}]}]}}},22978:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(6617),o=t(55199);const l={name:"ButtonGroup",summary:"<p>\u7528\u4e8e\u6839\u636e\u5f53\u524d\u5bb9\u5668\u7a7a\u95f4\u81ea\u52a8\u8ba1\u7b97\u591a\u4f59\u6309\u94ae\u6536\u8d77</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>button\u6309\u94ae\u5c5e\u6027\u7684\u6570\u7ec4</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>more</td>\n<td>\u66f4\u591a\u6309\u94ae\u5360\u4f4d</td>\n<td>jsx</td>\n<td>&lt;Button&gt;\u66f4\u591a&lt;Icon type=\"icon-arrow-thin-down\"/&gt;&lt;/Button&gt;</td>\n</tr>\n<tr>\n<td>compact</td>\n<td>\u662f\u5426\u4e3a\u7d27\u51d1\u6a21\u5f0f</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u5f53compact\u4e3afalse\u65f6\u4e3a\u6309\u94ae\u95f4\u9694\u5927\u5c0f\uff0c\u5426\u5219\u4e3a\u6309\u94ae\u5927\u5c0f</td>\n<td>'small','middle','large',number</td>\n<td>8</td>\n</tr>\n<tr>\n<td>split,align</td>\n<td>\u53c2\u8003antd Space</td>\n<td>-</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"ButtonGroup_e3fc2",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { Button, Space } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          list={[\n            {\n              type: "primary",\n              children: "\u64cd\u4f5c1",\n            },\n            {\n              children: "\u64cd\u4f5c2",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n              hidden: true,\n            },\n            {\n              children: "\u64cd\u4f5c4",\n              message: "\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f",\n              disabled: true,\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u7d27\u51d1\u6a21\u5f0f",description:"\u7d27\u51d1\u6a21\u5f0f",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { Button, Space } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          compact\n          list={[\n            {\n              type: "primary",\n              children: "\u64cd\u4f5c1",\n            },\n            {\n              children: "\u64cd\u4f5c2",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n              message: "\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f",\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u6e32\u67d3\u51fd\u6570",description:"\u6e32\u67d3\u51fd\u6570",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { default: ConfirmButton } = _ConfirmButton;\nconst { Button, Space } = antd;\nconst { useState, useEffect } = React;\n\nconst LoadChildren = ({ children }) => {\n  const [loading, setLoading] = useState(true);\n  useEffect(() => {\n    setTimeout(() => {\n      setLoading(false);\n    }, 1000);\n  }, []);\n  if (loading) {\n    return null;\n  }\n  return children({\n    onClick: () => {\n      console.log("\u52a0\u8f7d\u5b8c\u6210");\n    },\n  });\n};\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          list={[\n            (props) => {\n              return (\n                <Button {...props} type="primary">\n                  \u64cd\u4f5c1\n                </Button>\n              );\n            },\n            (props) => {\n              return <Button {...props}>\u64cd\u4f5c2</Button>;\n            },\n            (props) => {\n              return <Button {...props}>\u64cd\u4f5c3</Button>;\n            },\n            (props) => {\n              return (\n                <LoadChildren key={props.key}>\n                  {({ onClick }) => {\n                    return (\n                      <ConfirmButton\n                        {...props}\n                        isModal={props.isDropdown}\n                        message="\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f"\n                        onClick={onClick}\n                      >\n                        \u64cd\u4f5c4\n                      </ConfirmButton>\n                    );\n                  }}\n                </LoadChildren>\n              );\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"_ConfirmButton",packageName:"@components/ConfirmButton",component:t(47338)},{name:"antd",packageName:"antd",component:o}]}]}}},24666:(n,e,t)=>{t.r(e),t.d(e,{default:()=>y});const a="style_overlay__ZS5Wz__u6X1u",o="style_overlay-content__IVFmc__u6X1u",l="style_state-tag__+59RJ__u6X1u";var d=t(73884),r=t(25644),i=t(3874),s=t(55199),c=t(69175),m=t.n(c),p=t(20977),u=t.n(p),h=t(70720),g=t.n(h),b=t(83136),f=t.n(b),v=t(70579);const y=n=>{let{className:e,overlayClassName:t,storeName:c="HISTORY_STORE_KEY",maxLength:p=5,label:h="\u6700\u8fd1\u641c\u7d22",children:b,onSelect:y,zIndex:k,getPopupContainer:S}=n;const[I,x]=(0,d.useState)(()=>r.A.getItem(c)||[]),[F,N]=(0,d.useState)(!1),P=(0,d.useCallback)(()=>{0!==I.length&&N(!0)},[I]),B=(0,d.useRef)(c);B.current=c,(0,d.useEffect)(()=>{r.A.setItem(B.current,I)},[I]);const C=(0,d.useCallback)(n=>{n.value&&n.label&&x(e=>{const t=m()(e,{value:n.value});return t.splice(0,0,n),p?u()(t,"value").slice(0,p):t}),N(!1)},[p]),E=(0,d.useCallback)(()=>{N(!1)},[]),T=g()(E),_=(0,d.useRef)(null),w=(0,d.useRef)(null);T.current={contains:n=>_.current.contains(n)||F&&w.current.contains(n)};const G=(0,d.useRef)(null),[L,R]=(0,d.useState)(0);return(0,d.useLayoutEffect)(()=>{const n=()=>{R(_.current.clientWidth)};n();const e=new ResizeObserver(n);e.observe(_.current);const t=new MutationObserver(n);return t.observe(_.current,{subtree:!0,childList:!0}),()=>{t.disconnect(),e.disconnect()}},[]),(0,v.jsx)(s.Popover,{zIndex:k,placement:"bottom",transitionName:"ant-slide-up",arrow:!1,open:F,getPopupContainer:S,overlayClassName:f()(t,a),content:(0,v.jsx)("div",{className:o,style:{width:L},ref:w,children:(0,v.jsxs)(s.Space,{direction:"vertical",children:[(0,v.jsx)("div",{children:h}),(0,v.jsx)(s.Space,{wrap:!0,children:I.map(n=>(0,v.jsx)(i.default,{className:l,text:n.label,type:"result",onClick:()=>{y&&y(n.value,n),G.current&&G.current(n.value,n),E(),C(n)}}))})]})}),children:(0,v.jsx)("div",{ref:_,className:f()(e),children:b({open:F,openHistory:P,appendHistory:C,setOnSelect:n=>{G.current=n},close:E})})})}},25724:(n,e,t)=>{t.d(e,{A:()=>o});var a=t(82723);const o={name:"Content",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6210\u7ec4\u5c55\u793a\u591a\u4e2a\u5b57\u6bb5\uff0c\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<p>labelAlign\u4e0d\u4e3aauto\u65f6\u4f1a\u81ea\u52a8\u8ba1\u7b97label\u7684\u6700\u5c0f\u5bbd\u5ea6\u4f7f\u6240\u6709label\u7684\u5bbd\u5ea6\u7b49\u4e8e\u6700\u957f\u7684label\u5bbd\u5ea6\u4f7f\u89c6\u89c9\u4e0a\u66f4\u52a0\u6574\u9f50\u6709\u79e9\u5e8f\u611f</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>\u5185\u5bb9\uff0c\u4e3a\u4e00\u4e2a\u6570\u7ec4\uff0c\u6570\u7ec4\u91cc\u9762\u6bcf\u4e00\u4e2a\u503c{label,content}</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td>label\u7684\u5bf9\u9f50\u65b9\u5f0f\u53ef\u4ee5\u4f20\u5165\u7684\u503c left,right,center,auto,\u4e3aauto\u65f6label\u4e0d\u8ba1\u7b97\u6700\u5c0f\u5bbd\u5ea6</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>\u663e\u793a\u5217\u6570</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\u6216\u652f\u6301\u54cd\u5e94\u5f0f\u7684\u5bf9\u8c61\u5199\u6cd5\u6765\u8bbe\u7f6e\u6c34\u5e73\u95f4\u9694 { xs: 8, sm: 16, md: 24}\u3002\u6216\u8005\u4f7f\u7528\u6570\u7ec4\u5f62\u5f0f\u540c\u65f6\u8bbe\u7f6e [\u6c34\u5e73\u95f4\u8ddd, \u5782\u76f4\u95f4\u8ddd]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Content_f15c1",style:"",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u57fa\u672c\u5185\u5bb9",code:"const {default:Content} = _Content;\nconst BaseExample = ()=>{\n    return <Content list={[\n        {label:'\u6807\u9898',content:'\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807\u9898',content:'\u5185\u5bb9\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807',content:'\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807\u9898\u6807\u9898',content:'\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'}\n    ]}/>;\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]},{title:"labelAlign auto",description:"\u5c55\u793a\u4e86\u8bbe\u7f6elabelAlign\u4e3aauto\u7684\u60c5\u51b5",code:"const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content labelAlign=\"auto\" list={[\n        {label: '\u6807\u9898', content: '\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807\u9898', content: '\u5185\u5bb9\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807', content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {\n            label: '\u6807\u9898\u6807\u9898\u6807\u9898',\n            content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]},{title:"\u591a\u5217",description:"\u5c55\u793a\u4e86\u4e24\u5217\u7684\u60c5\u51b5",code:"const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content col={2} labelAlign=\"auto\" list={[\n        {label: '\u6807\u9898', content: '\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807\u9898', content: '\u5185\u5bb9\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807', content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {\n            label: '\u6807\u9898\u6807\u9898\u6807\u9898',\n            content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]}]}}},28928:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(3382),o=t(63743),l=t(55199),d=t(87558),r=t(82723);const i={name:"Modal",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u9700\u8981\u7528\u6237\u5904\u7406\u4e8b\u52a1\uff0c\u53c8\u4e0d\u5e0c\u671b\u8df3\u8f6c\u9875\u9762\u4ee5\u81f4\u6253\u65ad\u5de5\u4f5c\u6d41\u7a0b\u65f6\uff0c\u53ef\u4ee5\u5728\u5f53\u524d\u9875\u9762\u6b63\u4e2d\u6253\u5f00\u4e00\u4e2a\u6d6e\u5c42\uff0c\u627f\u8f7d\u76f8\u5e94\u7684\u64cd\u4f5c\u3002</p>\n<h3>\u7279\u70b9</h3>\n<p>\u8be5\u7ec4\u4ef6\u662fantd Modal\u7ec4\u4ef6\u7684\u518d\u5c01\u88c5\uff1a</p>\n<ul>\n<li>\u4fee\u6539\u4e86footer\u90e8\u5206\u7684\u8bbe\u7f6e\u903b\u8f91,\u80fd\u66f4\u52a0\u7b80\u5355\u7684\u5b9a\u4e49footer\u533a\u57df\u7684\u529f\u80fd</li>\n<li>\u6dfb\u52a0\u4e86withDecorator\u53ef\u4ee5\u66f4\u52a0\u65b9\u4fbf\u7684\u5904\u7406Modal\u5916\u5c42\u7684\u663e\u793a\u903b\u8f91</li>\n<li>\u6269\u5c55\u4e86\u7528\u4e8e\u65b9\u6cd5\u8c03\u7528\u7684useModal\u7684hooks\uff0c\u53ef\u4ee5\u901a\u8fc7hooks\u83b7\u5f97\u4e00\u4e2aModal\u7684\u8c03\u7528\u65b9\u6cd5\uff0c\u5e76\u4e14\u4fdd\u8bc1\u5176\u548cModal\u7ec4\u4ef6\u5f0f\u8c03\u7528\u6709\u76f8\u540c\u7684UI\u8868\u73b0\u548c\u884c\u4e3a</li>\n<li>\u6269\u5c55\u4e86ModalButton\u7ec4\u4ef6\uff0c\u53ef\u4ee5\u5728\u70b9\u51fb\u8be5\u6309\u94ae\u65f6\u6267\u884c\u52a0\u8f7d\u6570\u636e\uff0c\u5e76\u4e14Button\u7684\u72b6\u6001\u53d8\u4e3aloading\uff0c\u5728\u6570\u636e\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u518d\u5f39\u51fa\u5f39\u7a97</li>\n<li>\u6269\u5c55\u4e86TabsModal\u7ec4\u4ef6\uff0c\u5b83\u662f\u4e00\u4e2aTabs\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5bf9\u5f39\u7a97title\u505a\u4e86\u7279\u6b8a\u5904\u7406\uff0c\u66f4\u52a0\u7b26\u5408UI\u4ea4\u4e92\u903b\u8f91</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>\u5f39\u7a97\u7684footer\uff0c\u5f53\u5176\u88ab\u663e\u5f0f\u8bbe\u7f6e\u6210null\u4e14footerButtons\u6ca1\u6709\u8bbe\u7f6e\u8fc7\u65f6\u5f39\u7a97\u4e0d\u663e\u793afooter\u3002\u5f53\u5b83\u7c7b\u578b\u4e3afunction\u65f6\u53ef\u4ee5\u5f97\u5230close\u65b9\u6cd5\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>\u5f39\u7a97footer\u7684\u6309\u94ae\u533a\uff0c\u9ed8\u8ba4\u4e3a\u786e\u8ba4\u548c\u53d6\u6d88\u6309\u94ae\uff0c\u9ed8\u8ba4\u6309\u94ae\u5206\u522b\u54cd\u5e94onConfirm\u548conCancel\u65b9\u6cd5\uff0c\u5982\u679c\u81ea\u5b9a\u4e49\u8bbe\u7f6efooterButtons\u5219\u9700\u8981\u81ea\u884c\u4f20\u5165onClick\u53c2\u6570\uff0conConfirm\u548conCancel\u65b9\u6cd5\u5c06\u4e0d\u751f\u6548</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>\u5f39\u7a97\u5173\u95ed\u65f6\u8c03\u7528\uff0c\u5f39\u7a97\u53d7\u63a7\u65f6\u7531\u8be5\u65b9\u6cd5\u5c06\u5916\u90e8open\u72b6\u6001\u4fee\u6539</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>\u5f53footerButtons\u672a\u81ea\u5b9a\u4e49\u8bbe\u7f6e\u65f6\u70b9\u51fb\u786e\u8ba4\u6309\u94ae\u89e6\u53d1\u6267\u884c\u8be5\u65b9\u6cd5\uff0c\u5f53\u5176\u8fd4\u56dePromise\u70b9\u51fb\u540ePromise\uff0cresolve\u4e4b\u524d\u786e\u8ba4\u6309\u94ae\u663e\u793a\u4e3aloading\u72b6\u6001\uff0c\u8fd4\u56de\u503c\u4e3afalse\u6216\u8005Promise\u7684resolve\u503c\u4e3afalse\u65f6\u5f39\u7a97\u4e0d\u4f1a\u88ab\u5173\u95ed\uff0c\u5176\u4ed6\u60c5\u51b5\u5f39\u7a97\u9ed8\u8ba4\u5173\u95ed</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u548conConfirm\u7c7b\u4f3c\uff0c\u5176\u4e3a\u70b9\u51fb\u53d6\u6d88\u6309\u94ae\u89e6\u53d1</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5f39\u7a97\u5185\u5bb9\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230close\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\uff0c\u4f1a\u63a5\u6536\u5230\u5f39\u7a97children\u7684render\u65b9\u6cd5\uff0c\u53ef\u4ee5\u5728\u5176\u5916\u90e8\u6dfb\u52a0\u4fee\u9970\u5185\u5bb9\u540e\u6267\u884crender\u65b9\u6cd5\uff0c\u7ed9render\u65b9\u6cd5\u4f20\u5165\u7684\u503c\u53ef\u4ee5\u5728children,footer,rightOptions\u7c7b\u578b\u4e3afunction\u65f6\u63a5\u6536\u5230\u5bf9\u5e94\u7684\u53c2\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rightOptions</td>\n<td>\u5f39\u7a97\u53f3\u4fa7\u533a\u57df\uff0c\u548cchildren\u7c7b\u4f3c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\u7c7b\u578b</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>\u70b9\u51fb\u8499\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd Modal\u7ec4\u4ef6</p>\n<h3>useModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:modal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>TabsModal</h3>\n<p>\u4e00\u4e2aTabs\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5bf9\u5f39\u7a97title\u505a\u4e86\u7279\u6b8a\u5904\u7406\uff0c\u66f4\u52a0\u7b26\u5408UI\u4ea4\u4e92\u903b\u8f91</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>\u540cantd Tabs\u7684items\u53c2\u6570</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u6587\u5b57</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u5185\u5bb9\uff0c\u548cantd Tabs\u4e0d\u540c\u7684\u662f\u5b83\u53ef\u4ee5\u662f\u4e00\u4e2afunction\u548cModal\u7684children\u7c7b\u4f3c\u53ef\u4ee5\u63a5\u6536items[].withDecorator\u4f20\u5165\u7684\u53c2\u6570</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>\u5bf9\u5e94activeKey\u503c</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>\u5f53\u524d\u6fc0\u6d3b tab \u9762\u677f\u7684 key</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\u548cModal\u7684withDecorator\u4f5c\u7528\u4e00\u81f4</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>defaultActiveKey</td>\n<td>\u521d\u59cb\u5316\u9009\u4e2d\u9762\u677f\u7684 key\uff0c\u5982\u679c\u6ca1\u6709\u8bbe\u7f6e activeKey</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u5207\u6362\u9762\u677f\u7684\u56de\u8c03</td>\n<td>function</td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3>useTabsModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aTabsModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:tabsModal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>tabsModal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aTabsModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cTabsModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>ModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>\n<h3>TabsModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faTabsModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cTabsModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!1,className:"Modal_c59d6",style:"",list:[{title:"\u666e\u901a\u5f39\u7a97",description:"\u5c55\u793a\u5f39\u7a97\u7684\u57fa\u672c\u7528\u6cd5\uff0c\u81ea\u5b9a\u4e49footer\u7b49\u529f\u80fd\u3002\n\u6ce8\u610f:\n1.onConfirm\u548conCancel\u53ea\u5bf9\u4e8e\u9ed8\u8ba4\u7684footerButtons\u751f\u6548\uff0c\u5982\u679c\u662f\u81ea\u5b9a\u4e49\u7684footerButtons\u5219\u4e0d\u9700\u8981\u4f20\u8fd9\u4e24\u4e2a\u53c2\u6570\uff0c\u76f4\u63a5\u5b9a\u4e49\u6309\u94ae\u7684onClick\u5373\u53ef\u3002\n2.\u81ea\u5b9a\u4e49\u7684footerButtons\u7684onClick\u53ef\u4ee5\u8fd4\u56de\u4e00\u4e2aPromise\u6765\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97\uff0cresolve\u7684\u503c\u4e3afalse\u4e0d\u5173\u95ed\u5f39\u7a97\uff0c\u5176\u4ed6\u60c5\u51b5\u4f1a\u81ea\u52a8\u5173\u95ed\u5f39\u7a97\u3002\u5728resolve\u672a\u8fd4\u56de\u4e4b\u524d\u6309\u94ae\u4f1a\u53d8\u6210loading\u72b6\u6001",code:'const { default: Modal, useModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space, message, Radio } = antd;\nconst { PureGlobal } = global;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  const [size, setSize] = useState("default");\n  const [open, setOpen] = useState(false);\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          {\n            label: "large",\n            value: "large",\n          },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <Space wrap>\n        <Modal\n          title="\u786e\u5b9a\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97"\n          size={size}\n          open={open}\n          onClose={() => {\n            setOpen(false);\n          }}\n          onConfirm={() => {\n            return new Promise((resolve) => {\n              message.success("\u5f39\u7a971s\u540e\u5173\u95ed");\n              setTimeout(() => {\n                message.success("\u5f39\u7a97\u5173\u95ed");\n                resolve();\n              }, 1000);\n            });\n          }}\n        >\n          <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>\n        </Modal>\n        <Button\n          onClick={() => {\n            setOpen(true);\n          }}\n        >\n          \u786e\u5b9a\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "hooks\u8c03\u7528\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n            });\n          }}\n        >\n          hooks\u8c03\u7528\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u8d85\u9ad8\u5f39\u7a97",\n              size,\n              children: (\n                <div style={{ height: "2000px" }}>\n                  \u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\n                </div>\n              ),\n            });\n          }}\n        >\n          \u5c55\u793a\u8d85\u9ad8\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u81ea\u5b9a\u4e49footer\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footer: ({ close }) => (\n                <Space>\n                  <span>\u81ea\u5b9a\u4e49footer</span>\n                  <Button\n                    type="link"\n                    onClick={() => {\n                      close();\n                    }}\n                  >\n                    \u5173\u95ed\n                  </Button>\n                </Space>\n              ),\n            });\n          }}\n        >\n          \u5c55\u793a\u81ea\u5b9a\u4e49footer\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u65e0footer\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footer: null,\n            });\n          }}\n        >\n          \u65e0footer\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u81ea\u5b9a\u4e49\u6309\u94ae\u7ec4",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footerButtons: [\n                {\n                  children: "\u6309\u94ae\u4e00",\n                },\n                {\n                  type: "primary",\n                  children: "\u6309\u94ae\u4e8c",\n                },\n                {\n                  children: "\u6309\u94ae\u4e09",\n                },\n              ],\n            });\n          }}\n        >\n          \u81ea\u5b9a\u4e49\u6309\u94ae\u7ec4\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u6709rightOptions\u7684\u5f39\u7a97",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              rightOptions: <div>\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9</div>,\n              rightSpan: 12,\n            });\n          }}\n        >\n          \u6709rightOptions\u7684\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            const StateContainer = ({ children }) => {\n              const [disabled, setDisabled] = useState(false);\n              return children({ disabled, setDisabled });\n            };\n\n            modal({\n              title: "\u6709rightOptions\u7684\u5f39\u7a97",\n              size,\n              withDecorator: (render) => {\n                return <StateContainer>{render}</StateContainer>;\n              },\n              footerButtons: ({ disabled }) => [\n                {\n                  type: "primary",\n                  disabled,\n                  children: "\u786e\u5b9a",\n                },\n              ],\n              children: ({ disabled, setDisabled }) => (\n                <div>\n                  \u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97[{String(disabled)}]\n                  <Button\n                    onClick={() => {\n                      setDisabled((disabled) => !disabled);\n                    }}\n                  >\n                    \u5207\u6362\u786e\u5b9a\u6309\u94aedisabled\n                  </Button>\n                </div>\n              ),\n            });\n          }}\n        >\n          children\u63a7\u5236footerButtons\u72b6\u6001\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]},{title:"childrenRef\u7684\u4f7f\u7528",description:"",code:'const { default: Modal, useModal } = _Modal;\nconst { Button } = antd;\nconst BaseExample = () => {\n  const modal = useModal();\n\n  return (\n    <Button\n      onClick={() => {\n        modal({\n          title: "\u793a\u4f8b\u5f39\u6846",\n          children: ({ childrenRef }) => {\n            return (\n              <div ref={childrenRef}>\n                \u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\n              </div>\n            );\n          },\n          onConfirm: (e, { childrenRef }) => {\n            console.log(childrenRef.current);\n          },\n        });\n      }}\n    >\n      \u70b9\u51fb\u5f39\u51fa\u5f39\u6846\n    </Button>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"antd",packageName:"antd",component:l}]},{title:"\u9700\u8981\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",description:"\u53ef\u4ee5\u901a\u8fc7withDecorator\u5c5e\u6027\u5b9e\u73b0\u5f39\u7a97\u7684\u52a0\u8f7d\u6570\u636e\u6216\u8005\u52a0\u8f7d\u8fdc\u7a0b\u7ec4\u4ef6\u7684\u903b\u8f91\uff0c\u5728\u6570\u636e\u6216\u8005\u8fdc\u7a0b\u7ec4\u4ef6\u52a0\u8f7d\u5b8c\u6210\u4e4b\u524d\u5f39\u7a97\u5c55\u793aloading\u72b6\u6001\uff0c\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540echildren\u53ef\u4ee5\u83b7\u53d6\u5230\u52a0\u8f7d\u7684\u6570\u636e",code:'const { default: Modal, useModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space } = antd;\nconst { default: Fetch } = fetch;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  const [open, setOpen] = useState(false);\n  return (\n    <Space wrap>\n      <Modal\n        title="\u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f"\n        withDecorator={(render) => (\n          <Fetch\n            loader={() => {\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve([\n                    {\n                      label: "\u5185\u5bb91",\n                      content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                    },\n                    {\n                      label: "\u5185\u5bb92",\n                      content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                    },\n                  ]);\n                }, 1000);\n              });\n            }}\n            render={({ data }) => render({ data })}\n          />\n        )}\n        open={open}\n        onClose={() => {\n          setOpen(false);\n        }}\n      >\n        {({ data }) => <Content list={data} col={2} />}\n      </Modal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: "hooks\u8c03\u7528\u65b9\u5f0f",\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5185\u5bb91",\n                          content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                        },\n                        {\n                          label: "\u5185\u5bb92",\n                          content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: ({ data }) => <Content list={data} col={2} />,\n          });\n        }}\n      >\n        hooks\u8c03\u7528\u65b9\u5f0f\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: (props) => {\n              return "hooks\u8c03\u7528\u65b9\u5f0f";\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5185\u5bb91",\n                          content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                        },\n                        {\n                          label: "\u5185\u5bb92",\n                          content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: ({ data }) => <Content list={data} col={2} />,\n          });\n        }}\n      >\n        hooks title\u8c03\u7528\u65b9\u5f0f\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]},{title:"\u53ef\u4ee5\u5f39\u51fa\u5f39\u7a97\u7684\u6309\u94ae",description:"\u53ef\u4ee5\u70b9\u51fb\u6309\u94ae\u5f39\u51fa\u5f39\u7a97\uff0c\u5e76\u4e14\u5728\u5f39\u7a97\u5f39\u51fa\u4e4b\u524d\u53ef\u4ee5\u52a0\u8f7d\u6570\u636e\uff0c\u52a0\u8f7d\u6570\u636e\u65f6\uff0c\u6309\u94ae\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u518d\u5f39\u51fa\u5f39\u7a97",code:'const { ModalButton, TabsModalButton } = _Modal;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\nconst { default: FormInfo, Input, TextArea } = _FormInfo;\n\nconst api = {\n  loader: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve([\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n        ]);\n      }, 1000);\n    });\n  },\n};\n\nconst BaseExample = () => {\n  return (\n    <Space wrap>\n      <ModalButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",\n            children: <Content list={data} col={2} />,\n          };\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </ModalButton>\n      <TabsModalButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            items: data.map(({ label, content }, index) => {\n              return {\n                key: index,\n                children: content,\n                label,\n              };\n            }),\n          };\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\u7684Tabs\u5f39\u7a97\n      </TabsModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"_Content",packageName:"@components/Content",component:r},{name:"_FormInfo",packageName:"@components/FormInfo",component:t(96252)}]},{title:"tabs\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2atabs\u5f39\u7a97\uff0ctabs\u7684\u9009\u9879\u7684label\u4f1a\u5360\u636e\u5f39\u7a97title\u4f4d\u7f6e\uff0c\u5f39\u6846\u7684title\u5c06\u4e0d\u663e\u793a\ntabs\u7684items\u591a\u52a0\u4e86withDecorator\u53c2\u6570\u548cModal\u7684withDecorator\u53c2\u6570\u7c7b\u4f3c\u53ef\u4ee5\u63a7\u5236\u5176\u5916\u90e8\u663e\u793a\u53ca\u6e32\u67d3\u5185\u5bb9\ntabs\u7684items\u7684children\u4e5f\u53ef\u4ee5\u662ffunction\uff0c\u540c\u6837\u53ef\u4ee5\u63a5\u6536\u5230TabsModal\u7684withDecorator\u4f20\u56de\u7684\u53c2\u6570",code:'const { TabsModal, useTabsModal } = _Modal;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const tabsModal = useTabsModal();\n  return <Space wrap>\n    <TabsModal open={open} onClose={() => {\n      setOpen(false);\n    }} items={[{\n      label: "\u9879\u76ee 1", key: "item-1", children: <div>\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1</div>\n    }, {\n      label: "\u9879\u76ee 2", key: "item-2", children: <div>\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2</div>\n    }]} rightOptions={<div>\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9</div>}>\n      <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>\n    </TabsModal>\n    <Button onClick={() => {\n      setOpen(true);\n    }}>\u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f</Button>\n    <Button onClick={() => {\n      tabsModal({\n        rightOptions: <div>\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9</div>, items: [{\n          label: "\u9879\u76ee 1", key: "item-1", children: <div>\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1</div>\n        }, {\n          label: "\u9879\u76ee 2", key: "item-2", children: <div>\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2</div>\n        }]\n      });\n    }}>hooks\u8c03\u7528\u65b9\u5f0f</Button>\n    <Button onClick={() => {\n      tabsModal({\n        title: "\u6b64title\u4e0d\u5c55\u793a",\n        rightOptions: ({ data }) => <Content list={data} />,\n        withDecorator: (render) => <Fetch loader={() => {\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve([{ label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" }, {\n                label: "\u5185\u5bb92", content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92"\n              }]);\n            }, 1000);\n          });\n        }} render={({ data }) => render({ data })} />,\n        items: [{\n          label: "\u9879\u76ee 1", key: "item-1", children: ({ data }) => <Content list={data} col={2} />\n        }, {\n          withDecorator: (render) => <Fetch loader={() => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([{ label: "\u5185\u5bb93", content: "\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93" }, {\n                  label: "\u5185\u5bb94", content: "\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94"\n                }]);\n              }, 1000);\n            });\n          }} render={({ data }) => render({ tabData: data })} />,\n          label: "\u9879\u76ee 2",\n          key: "item-2",\n          children: ({ data, tabData }) => <Content list={[...data, ...tabData]} col={2} />\n        }]\n      });\n    }}>\u590d\u6742\u6570\u636e\u52a0\u8f7d</Button>\n  </Space>;\n};\n\nrender(<PureGlobal><BaseExample /></PureGlobal>);\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]},{title:"\u6d88\u606f\u786e\u8ba4\u548c\u63d0\u793a",description:"\u5c55\u793a\u786e\u8ba4\u6d88\u606f\u63d0\u9192",code:'const { default: Modal, useConfirmModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space, message } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  const confirmModal = useConfirmModal();\n  return (\n    <Space wrap>\n      <Button\n        onClick={() => {\n          confirmModal({\n            danger: true,\n            type: "confirm",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        confirm\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "confirm",\n            confirmType: "warning",\n            title: "\u786e\u5b9a\u8981\u7f16\u8f91\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91",\n          });\n        }}\n      >\n        confirm \u8b66\u544a\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "info",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        info\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "info",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        info\u65e0\u6807\u9898\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "success",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        success\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "warning",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        warning\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "error",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        error\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]}]}}},28967:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(29053),o=t(63743),l=t(55199);const d={name:"Permissions",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u7cfb\u7edf\u4e2d\u5b58\u5728\u4e00\u4e9b\u529f\u80fd\u548c\u64cd\u4f5c\u53ea\u5141\u8bb8\u67d0\u4e9b\u89d2\u8272\u7528\u6237\u4f7f\u7528\uff0c\u4f7f\u7528\u8be5\u7ec4\u4ef6\u53ef\u4ee5\u8ba9\u5176\u5305\u88f9\u7684\u7ec4\u4ef6\u6216\u8005\u533a\u57df\u6839\u636e\u7cfb\u7edf\u7684\u6743\u9650\u5217\u8868\u914d\u7f6e\u5c55\u793a\u4e0d\u540c\u7684\u72b6\u6001</p>\n<h3>\u7279\u70b9</h3>\n<p>\u901a\u8fc7\u5728Global\u4e2d\u7684preset\u4e2d\u8bbe\u7f6epermissions\u4f5c\u4e3a\u5f53\u524d\u7528\u6237\u7684\u6743\u9650\u5217\u8868\uff0c\u5728Permissions\u7ec4\u4ef6\u914d\u7f6epermissions\u4f5c\u4e3a\u8be5\u529f\u80fd\u8981\u6c42\u5177\u5907\u7684\u6743\u9650\u9879\uff0c\u5f53\u8981\u6c42\u5177\u5907\u7684\u6743\u9650\u9879\u5168\u90e8\u5728\u7528\u6237\u7684\u6743\u9650\u5217\u8868\u4e2d\u627e\u5230\u65f6\u4e3a\u6743\u9650\u901a\u8fc7\u72b6\u6001\u5426\u5219\u4e3a\u6743\u9650\u4e0d\u901a\u8fc7\u72b6\u6001</p>\n<p>\u5f53\u6743\u9650\u4e0d\u901a\u8fc7\u65f6\uff0cPermissions\u7ec4\u4ef6\u53ef\u4ee5\u6709\u4e09\u79cd\u65b9\u5f0f\u5448\u73b0\uff1a</p>\n<ol>\n<li>\u7528\u6237\u53ef\u4ee5\u770b\u5230\u64cd\u4f5c\u529f\u80fd\u7684\u7ec4\u4ef6\u663e\u793a\uff0c\u4f46\u662f\u4e0d\u80fd\u8fdb\u884c\u64cd\u4f5c\uff0c\u5728\u9f20\u6807\u79fb\u5165\u65f6\u4f1a\u4ee5ToolTip\u63d0\u793a\u9519\u8bef\u539f\u56e0\uff0c\u4e00\u822c\u7528\u5728\u6309\u94ae\u7b49\u9700\u8981\u7528\u6237\u4ea4\u4e92\u7684\u529f\u80fd\u4f4d\u7f6e</li>\n<li>\u7528\u6237\u4e0d\u80fd\u770b\u5230\u64cd\u4f5c\u529f\u80fd\u6216\u8005\u6570\u636e\u5448\u73b0\uff0c\u5bf9\u5e94\u533a\u57df\u663e\u793a\u9519\u8bef\u539f\u56e0\uff0c\u4e00\u822c\u7528\u5728\u8981\u6570\u636e\u5c55\u793a\u7b49\u573a\u666f</li>\n<li>\u9690\u85cf\u5185\u90e8\u7ec4\u4ef6\uff0c\u4e00\u822c\u7528\u5728\u4e0d\u9700\u8981\u5e72\u6270\u5230\u7528\u6237\u6216\u7528\u6237\u4e0d\u9700\u8981\u4e86\u89e3\u5176\u6ca1\u6709\u6743\u9650\u7684\u529f\u80fd\u6216\u6570\u636e\u7b49\u573a\u666f</li>\n</ol>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>\u7c7b\u578b\uff0c\u53ef\u9009\u503c\u4e3ahidden\uff0ctooltip\uff0cerror\uff0c\u5206\u522b\u4e3a\u9690\u85cf\uff0c\u6c14\u6ce1\u63d0\u793a\uff0c\u9519\u8bef\u63d0\u793a\u4e09\u79cd\u5f62\u5f0f</td>\n<td>string</td>\n<td>hidden</td>\n</tr>\n<tr>\n<td>tagName</td>\n<td>\u5f53\u524d\u7ec4\u4ef6\u7684tagName\uff0c\u540cReact.createElement\u7684type\u53c2\u6570\uff0c\u9ed8\u8ba4\u4e3aspan</td>\n<td>string</td>\n<td>span</td>\n</tr>\n<tr>\n<td>message</td>\n<td>\u63d0\u793a\u6587\u6848</td>\n<td>string</td>\n<td>\u60a8\u6682\u65e0\u6743\u9650\uff0c\u8bf7\u8054\u7cfb\u7ba1\u7406\u5458</td>\n</tr>\n<tr>\n<td>request</td>\n<td>\u6743\u9650\u5217\u8868\u4e3a\u4e00\u4e2a\u5b57\u7b26\u4e32\u6570\u7ec4\uff0c\u6bcf\u4e2aitem\u4e3a\u4e00\u9879\u6743\u9650\u7684key\uff0c\u6240\u6709\u6743\u9650\u5728\u5168\u5c40\u7684permissions\u4e2d\u5b58\u5728\u5219\u5224\u65ad\u4e3a\u6743\u9650\u901a\u8fc7</td>\n<td>array[string]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u8be5\u53c2\u6570\u53ef\u4ee5\u4f20function\u7c7b\u578b\uff0cchildren({isPass, type, request})\uff0cisPass\u4e3a\u6743\u9650\u6821\u9a8c\u662f\u5426\u901a\u8fc7\uff0ctype\u4e3a\u63d0\u793a\u7c7b\u578b\uff0crequest\u4e3a\u6240\u9700\u6743\u9650\u5217\u8868\uff0c\u53ef\u4ee5\u81ea\u884c\u5b9e\u73b0\u6743\u9650\u7684\u5c55\u793a</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Permissions_d08cc",style:".Permissions_d08cc .box {\n  padding: 20px;\n  background: #f8f8f8;\n}",list:[{title:"\u5c55\u793a\u6743\u9650\u4e0d\u901a\u8fc7\u7684\u51e0\u79cd\u5f62\u5f0f",description:"\u901a\u8fc7\u5207\u6362\u4e0d\u540c\u7684type\uff0c\u53ef\u4ee5\u9884\u89c8\u4e09\u79cd\u4e0d\u540ctype\u7684\u8868\u73b0\u5f62\u5f0f",code:'const { default: Permissions } = _Permissions;\nconst { PureGlobal } = global;\nconst { Button, Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [type, setType] = useState("tooltip");\n  return (\n    <PureGlobal\n      preset={{\n        permissions: ["permission_1", "permission_2"],\n      }}\n    >\n      <Space direction="vertical">\n        <Radio.Group\n          value={type}\n          options={[\n            { label: "tooltip", value: "tooltip" },\n            {\n              label: "error",\n              value: "error",\n            },\n            { label: "hidden", value: "hidden" },\n          ]}\n          onChange={(e) => {\n            setType(e.target.value);\n          }}\n          optionType="button"\n          buttonStyle="solid"\n        />\n        <Permissions type={type} request={["permission_2"]}>\n          <div className="box">\n            <Button onClick={() => console.log("\u6267\u884c\u64cd\u4f5c")}>\u6709\u6743\u9650\u64cd\u4f5c</Button>\n          </div>\n        </Permissions>\n        <Permissions type={type} request={["permission_3"]}>\n          <div className="box">\n            <Button onClick={() => console.log("\u6267\u884c\u64cd\u4f5c")}>\u65e0\u6743\u9650\u64cd\u4f5c</Button>\n          </div>\n        </Permissions>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Permissions",packageName:"@components/Permissions",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]}]}}},32159:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"HelperGuide",summary:"<p>\u7ed9\u7528\u6237\u63d0\u4f9b\u5e2e\u52a9\u6587\u6863</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"HelperGuide_4e237",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: HelperGuide } = _HelperGuide;\nconst { PureGlobal } = Global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        enums: {\n          helperGuide: () => [\n            {\n              value: "test",\n              content:\n                "\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8",\n              url: "/xxxx",\n            },\n          ],\n        },\n      }}\n    >\n      <HelperGuide name="test" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_HelperGuide",packageName:"@components/HelperGuide",component:t(75363)},{name:"Global",packageName:"@components/Global",component:t(63743)}]}]}}},38799:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(79329),o=t(63743),l=t(55199);const d={name:"Navigation",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u7cfb\u7edf\u7684\u9876\u90e8\u5bfc\u822a\uff0c\u4e00\u7ea7\u5bfc\u822a\u9879\u504f\u5de6\u9760\u8fd1 logo \u653e\u7f6e\uff0c\u8f85\u52a9\u83dc\u5355\u504f\u53f3\u653e\u7f6e\u3002</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u96c6\u6210\u4e86Permissions\u6743\u9650\u5224\u65ad\uff0c\u53ef\u4ee5\u901a\u8fc7\u6743\u9650\u5217\u8868\u6765\u5224\u65ad\u5bfc\u9879\u662f\u5426\u663e\u793a</li>\n<li>\u5728\u5c4f\u5e55\u663e\u793a\u4e0d\u4e86\u5168\u90e8\u7684\u4e00\u7ea7\u5bfc\u822a\u65f6\u53ef\u4ee5\u81ea\u52a8\u5c06\u540e\u9762\u7684\u5bfc\u822a\u9879\u6536\u8d77\u5230\u66f4\u591a\u4e0b\u62c9\u83dc\u5355\u91cc\u9762</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Navigation_84649",style:".Navigation_84649 .fold-items {\n  width: 600px;\n}",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nrender(\n  <PureGlobal>\n    <Navigation\n      list={menuList}\n      isFixed={false}\n      permissions={[\n        "client:client:look",\n        "jd:job:look",\n        "cv:cv:look",\n        "contract:mgr:look",\n        "payment:mgr:look",\n        "client:invoice:center",\n        "client:invoice:manager",\n        "system:permissions:mgr",\n      ]}\n    />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nrender(\n  <PureGlobal>\n    <div className="fold-items">\n      <Navigation\n        isFixed={false}\n        list={menuList}\n        permissions={[\n          "client:client:look",\n          "jd:job:look",\n          "cv:cv:look",\n          "contract:mgr:look",\n          "payment:mgr:look",\n          "client:invoice:center",\n          "client:invoice:manager",\n          "system:permissions:mgr",\n        ]}\n      />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { useState } = React;\nconst { PureGlobal } = global;\nconst { default: Navigation } = _Navigation;\nconst { Checkbox, Space } = antd;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nconst Example = () => {\n  const [permissions, setPermissions] = useState([]);\n  return (\n    <PureGlobal>\n      <Space className="container" direction="vertical" size={32}>\n        <Navigation isFixed={false} list={menuList} permissions={permissions} />\n        <Checkbox.Group\n          value={permissions}\n          options={[\n            "client:client:look",\n            "jd:job:look",\n            "cv:cv:look",\n            "contract:mgr:look",\n            "payment:mgr:look",\n            "client:invoice:center",\n            "client:invoice:manager",\n            "system:permissions:mgr",\n          ]}\n          onChange={(values) => {\n            setPermissions(values);\n          }}\n        />\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]}]}}},43728:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"Descriptions",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u6700\u591a\u652f\u6301\u4e24\u5217\u6570\u636e\u5c55\u793a\uff0c\u591a\u4f59\u7684\u5217\u5c06\u4e0d\u5c55\u793a</li>\n<li>\u652f\u6301Features\u63a7\u5236\u5217\u5185\u5bb9\u5f00\u542f\u548c\u5173\u95ed</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u8be6\u60c5\u6570\u636e\u6e90\uff0c\u5185\u90e8\u6bcf\u4e2a\u6570\u7ec4\u4e3a\u4e00\u884c\u6570\u636e\uff0c\u6bcf\u884c\u6570\u636e\u4e2d\u6bcf\u4e2a\u5bf9\u8c61\u4e3a\u4e00\u5217\u6570\u636e\uff0c\u6bcf\u884c\u6700\u591a\u5305\u542b2\u5217\u5185\u5bb9\uff0c\u591a\u4f59\u7684\u4f1a\u88ab\u4e22\u5f03</td>\n<td>array[[{display,label,content,featureId}]]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{display}]]</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a,\u5f53\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230(item,dataSource)\u53c2\u6570\uff0citem\u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0cdataSource\u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684dataSource\u914d\u7f6e</td>\n<td>boolean,function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>dataSource[[{label}]]</td>\n<td>\u6570\u636e\u5c55\u793a\u7684label</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{content}]]</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{featureId}]]</td>\n<td>Features\u63a7\u5236\u7684id\uff0c\u53c2\u8003Features\u7ec4\u4ef6\u7684id\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Descriptions_8bc84",style:"",list:[{title:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",description:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",code:'const { default: Descriptions } = _Descriptions;\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: "\u5ba2\u6237\u540d\u79f0", content: "\u817e\u8baf" },\n          {\n            label: "\u53d1\u7968\u62ac\u5934",\n            content: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n          },\n        ],\n        [\n          { label: "\u53d1\u7968\u7c7b\u578b", content: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968" },\n          {\n            label: "\u53d1\u7968\u5f00\u5177\u65e5\u671f",\n            content: "2022-08-15",\n          },\n        ],\n        [{ label: "\u9000\u7968\u91d1\u989d", content: "22000.00\u5143" }],\n        [\n          {\n            label: "\u53d1\u7968\u53f7",\n            content: (\n              <div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n              </div>\n            ),\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9700\u8981\u91cd\u5f00\u53d1\u7968", content: "\u5426" },\n          {\n            label: "\u662f\u5426\u6d89\u53ca\u91d1\u878d\u53d8\u52a8",\n            content: "\u5426",\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9020\u6210\u5b9e\u8d28\u635f\u5931", content: "\u5426" },\n          { label: "\u8d23\u4efb\u5f52\u5c5e", content: "\u5ba2\u6237\u539f\u56e0" },\n        ],\n        [\n          {\n            label: "\u9000\u7968\u539f\u56e0",\n            content: "\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf",\n          },\n        ],\n        [{ label: "\u9644\u4ef6", content: "\u9644\u4ef6\u540d\u79f0" }],\n        [\n          { label: "\u64cd\u4f5c\u65f6\u95f4", content: "2022-08-01 16:32" },\n          {\n            label: "\u64cd\u4f5c\u4eba",\n            content: "\u897f\u897f\u6b6a",\n          },\n        ],\n        [\n          {\n            label: "\u8d85\u957f\u5185\u5bb9",\n            content:\n              "\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9",\n          },\n          {\n            label: "\u8d85\u957f\u82f1\u6587",\n            content:\n              "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Descriptions",packageName:"@components/Descriptions",component:t(5633)}]}]}}},45426:(n,e,t)=>{t.d(e,{A:()=>s});var a=t(64671),o=t(55199),l=t(87558),d=t(63743),r=t(89946),i=t(13050);const s={name:"Icon",summary:"<p>\u53ef\u4ee5\u663e\u793a\u4e00\u4e2a\u56fe\u6807\uff0c\u56fe\u6807\u5fc5\u987b\u5728\u5b57\u4f53\u6587\u4ef6\u4e2d\u88ab\u5b9a\u4e49\u8fc7</p>",api:'<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>\u56fe\u6807\u7c7b\u578b\uff0c\u53c2\u8003\u793a\u4f8b\u4e0b\u7684\u5b57\u7b26\u4e32</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>colorful</td>\n<td>\u662f\u5426\u662f\u5f69\u8272\u56fe\u6807</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>prefix</td>\n<td>\u56fe\u6807\u524d\u7f00</td>\n<td>string</td>\n<td>""</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u56fe\u6807\u5927\u5c0f</td>\n<td>number</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>',example:{isFull:!0,className:"Icon_81743",style:".Icon_81743 .item {\n  width: 150px;\n  word-break: break-all;\n}\n.Icon_81743 .item .ant-typography {\n  position: relative;\n}\n.Icon_81743 .item .ant-typography-copy {\n  visibility: hidden;\n  position: absolute;\n  right: -20px;\n}\n.Icon_81743 .item:hover .ant-typography-copy {\n  visibility: visible;\n}",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Icon } = _Icon;\nconst { Slider, Space, Typography } = antd;\nconst { useState } = React;\nconst { createWithFetch } = ReactFetch;\nconst { loadFont } = Global;\nconst { default: axios } = _axios;\nconst { createWithRemoteLoader } = remoteLoader;\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-iconfont:Font"],\n})(({ remoteModules }) => {\n  const [Font] = remoteModules;\n  const [value, setValue] = useState(30);\n  return (\n    <Space direction="vertical">\n      <Space>\n        <div>\u8c03\u6574\u5927\u5c0f:</div>\n        <Slider\n          style={{ width: 100 }}\n          max={60}\n          min={12}\n          value={value}\n          onChange={setValue}\n        />\n        <div>{value}px</div>\n      </Space>\n      {\n        <Font>\n          {({ list }) => {\n            return (\n              <Space wrap align="top" size="large">\n                {list.map(({ name, font_class }) => {\n                  return (\n                    <Space\n                      className="item"\n                      direction="vertical"\n                      align="center"\n                      key={name}\n                    >\n                      <Icon type={font_class} size={value} />\n                      <Typography.Text\n                        copyable={{\n                          text:\n                            \'<Icon type="\' +\n                            font_class +\n                            \'" size={\' +\n                            value +\n                            "} />",\n                        }}\n                      >\n                        {font_class}\n                      </Typography.Text>\n                      <div>{name}</div>\n                    </Space>\n                  );\n                })}\n              </Space>\n            );\n          }}\n        </Font>\n      }\n    </Space>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Icon",packageName:"@components/Icon",component:a},{name:"antd",packageName:"antd",component:o},{name:"ReactFetch",packageName:"@kne/react-fetch",component:l},{name:"Global",packageName:"@components/Global",component:d},{name:"_axios",packageName:"axios",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:i}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Icon } = _Icon;\nconst { Space, Slider, Typography } = antd;\nconst { useState } = React;\nconst { createWithFetch } = ReactFetch;\nconst { createWithRemoteLoader } = remoteLoader;\nconst { default: axios } = _axios;\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-iconfont:ColorfulFont"],\n})(({ remoteModules }) => {\n  const [ColorfulFont] = remoteModules;\n  const [value, setValue] = useState(30);\n  return (\n    <Space direction="vertical">\n      <Space>\n        <div>\u8c03\u6574\u5927\u5c0f:</div>\n        <Slider\n          style={{ width: 100 }}\n          max={60}\n          min={12}\n          value={value}\n          onChange={setValue}\n        />\n        <div>{value}px</div>\n      </Space>\n      <ColorfulFont>\n        {({ list }) => (\n          <Space wrap align="top" size="large">\n            {list.map(({ name }) => {\n              return (\n                <Space\n                  className="item"\n                  direction="vertical"\n                  align="center"\n                  key={name}\n                >\n                  <Icon colorful type={name} size={value} />\n                  <Typography.Text\n                    copyable={{\n                      text:\n                        \'<Icon colorful type="\' +\n                        name +\n                        \'" size={\' +\n                        value +\n                        "} />",\n                    }}\n                  >\n                    {name}\n                  </Typography.Text>\n                </Space>\n              );\n            })}\n          </Space>\n        )}\n      </ColorfulFont>\n    </Space>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Icon",packageName:"@components/Icon",component:a},{name:"antd",packageName:"antd",component:o},{name:"ReactFetch",packageName:"@kne/react-fetch",component:l},{name:"Global",packageName:"@components/Global",component:d},{name:"_axios",packageName:"axios",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:i}]}]}}},45516:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(28148),o=t(55199);const l={name:"Menu",summary:"<p>\u652f\u6301\u8fdc\u7a0b\u52a0\u8f7d\u6570\u636e\u7684\u83dc\u5355</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Menu_b6154",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Menu } = _Menu;\nconst { Space } = antd;\nconst { useState } = React;\n\nconst ControlMenu = () => {\n  const [current, setCurrent] = useState("s-0");\n  return (\n    <Menu\n      currentKey={current}\n      onChange={setCurrent}\n      items={[\n        {\n          label: "\u7236\u7ea7\u6807\u98981",\n          key: "p-0",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-0",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-1",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98982",\n          key: "p-1",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-2",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-3",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98983",\n          key: "p-2",\n          iconType: "icon-zhanghaodenglu",\n        },\n      ]}\n    />\n  );\n};\nconst BaseExample = () => {\n  return (\n    <Space>\n      <div style={{ maxWidth: "200px" }}>\n        <Menu\n          defaultItems={[\n            {\n              label: "\u7236\u7ea7\u6807\u98981",\n              iconType: "icon-zhanghaodenglu",\n              children: [\n                {\n                  label:\n                    "\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7",\n                  path: "/link1",\n                },\n                {\n                  label: "\u5b50\u6807\u98982",\n                  path: "/link2",\n                },\n              ],\n            },\n            {\n              label: "\u7236\u7ea7\u6807\u98982",\n              iconType: "icon-zhanghaodenglu",\n              children: [\n                {\n                  label: "\u5b50\u6807\u98981",\n                  path: "/link3",\n                },\n                {\n                  label: "\u5b50\u6807\u98982",\n                  path: "/link4",\n                },\n              ],\n            },\n            {\n              label: "\u7236\u7ea7\u6807\u98983",\n              iconType: "icon-zhanghaodenglu",\n              fetchOptions: {\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5b50\u6807\u98981",\n                          path: "/link5",\n                        },\n                        {\n                          label: "\u5b50\u6807\u98982",\n                          path: "/link6",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              },\n            },\n          ]}\n        />\n      </div>\n\n      <Menu\n        items={[\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-0",\n            path: "/link1",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-1",\n            path: "/link2",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-2",\n            path: "/link3",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-3",\n            path: "/link4",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        defaultItems={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            iconType: "icon-zhanghaodenglu",\n            fetchOptions: {\n              loader: () => {\n                return new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve([\n                      {\n                        label: "\u5b50\u6807\u98981",\n                        path: "/link5",\n                      },\n                      {\n                        label: "\u5b50\u6807\u98982",\n                        path: "/link6",\n                      },\n                    ]);\n                  }, 1000);\n                });\n              },\n            },\n          },\n        ]}\n      />\n      <Menu\n        defaultItems={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link4",\n              },\n            ],\n          },\n        ]}\n      />\n      <ControlMenu />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Menu",packageName:"@components/Menu",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},46312:(n,e,t)=>{t.d(e,{A:()=>c});var a={};t.r(a),t.d(a,{default:()=>i});var o={};t.r(o),t.d(o,{default:()=>s});var l=t(47458),d=t(63743),r=t(55199);const i={ButtonText:"confirm"},s={ButtonText:"\u786e\u5b9a"},c={name:"Intl",summary:"<p>\u652f\u6301\u7cfb\u7edf\u56fd\u9645\u5316</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Intl_51734",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:"const {FormattedMessage, IntlProvider} = _Intl;\nconst {PureGlobal} = global;\nconst {Select, Space} = antd;\nconst {default: en} = localeEN;\nconst {default: cn} = localeCN;\nconst {useState} = React;\nconst BaseExample = () => {\n    const [locale, setLocale] = useState('zh-CN');\n    return (<Space>\n        <Select value={locale} onChange={setLocale}\n                options={['zh-CN', 'en-US'].map(key => ({value: key, label: key}))}/>\n        <PureGlobal\n            preset={{\n                locale\n            }}\n        >\n            <IntlProvider locale={locale} importMessages={locale => {\n                return {\n                    default: {\n                        'zh-CN': cn, 'en-US': en\n                    }[locale]\n                };\n            }}>\n                <FormattedMessage defaultMessage=\"\u6309\u94ae\" id=\"ButtonText\">\n                    {text => <div>{text}</div>}\n                </FormattedMessage>\n            </IntlProvider>\n\n        </PureGlobal>\n    </Space>);\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Intl",packageName:"@components/Intl",component:l},{name:"global",packageName:"@components/Global",component:d},{name:"antd",packageName:"antd",component:r},{name:"localeEN",packageName:"@components/Intl/doc/locale/en-US",component:a},{name:"localeCN",packageName:"@components/Intl/doc/locale/zh-CN",component:o}]}]}}},46631:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(19343),o=t(63743),l=t(13050),d=t(21079),r=t(55199);const i={name:"File",summary:"<p>\u63d0\u4f9b\u6587\u4ef6\u5c55\u793a\uff0cOSS\u6587\u4ef6id\u8f6c\u6362\u8bbf\u95ee\u5730\u5740\uff0c\u6587\u4ef6\u5217\u8868\uff0c\u4e0b\u8f7d\u7b49\u64cd\u4f5c</p>\n<p>\u6ce8\u610f\uff1a</p>\n<ul>\n<li>\u5982\u679c\u9700\u8981\u663e\u793a\u6216\u8005\u8f6c\u6362oss id\u7684\u6587\u4ef6\uff0c\u9700\u8981Global\u7684preset apis\u8bbe\u7f6e\u8fc7oss\u63a5\u53e3\u6216\u8005\u4f20\u5165apis.oss\u53c2\u6570\uff0coss\u8fd4\u56de\u8bbf\u95ee\u5730\u5740</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3aoss\u6587\u4ef6\uff0c\u4f20\u5165ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3a\u666e\u901a\u6587\u4ef6\u5730\u5740\uff0c\u4f20\u5165\u8be5\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u6587\u4ef6\u5931\u8d25\u5c55\u793a\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u52a0\u8f7d\u6587\u4ef6loading\u8fc7\u7a0b\u4e2d\u663e\u793a\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n</tbody>\n</table>\n<h4>Download</h4>\n<p>\u4e0b\u8f7d\u6587\u4ef6\u6309\u94ae</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u6587\u4ef6\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>\u672a\u547d\u540d\u4e0b\u8f7d\u6587\u4ef6</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>\u4e0b\u8f7d\u6210\u529f\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>\u4e0b\u8f7d\u5931\u8d25\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3aoss\u6587\u4ef6\uff0c\u4f20\u5165ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3a\u666e\u901a\u6587\u4ef6\u5730\u5740\uff0c\u4f20\u5165\u8be5\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>List</h4>\n<p>\u663e\u793a\u6587\u4ef6\u5217\u8868\uff0c\u53ef\u4ee5\u5e26\u6709\u7f16\u8f91\u6587\u4ef6\u540d\u79f0\uff0c\u6587\u4ef6\u9884\u89c8\uff0c\u6587\u4ef6\u5220\u9664\u7b49\u529f\u80fd</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u6587\u4ef6\u5217\u8868</td>\n<td>array[{id,type,filename,date,userName}]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>dataSource[].id</td>\n<td>id:\u6587\u4ef6\u7684id\uff0c\u4e00\u822c\u4e3aossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].type</td>\n<td>\u6587\u4ef6\u72b6\u6001\u4e3auploading\u65f6\u8be5\u884c\u6587\u4ef6\u5c55\u793a\u4e3aloading\u72b6\u6001</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].filename</td>\n<td>\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].date</td>\n<td>\u6587\u4ef6\u4e0a\u4f20\u65e5\u671f</td>\n<td>Date,date timestamp</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].userName</td>\n<td>\u6587\u4ef6\u4e0a\u4f20\u4eba</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getPermission</td>\n<td>\u83b7\u53d6\u64cd\u4f5c\u6743\u9650\uff0c\u4f1a\u5728render\u6bcf\u6761\u6570\u636e\u65f6\u8c03\u7528\uff0c\u83b7\u53d6\u5230\u53c2\u6570\u5217\u8868[type,itemData],type:preview\u9884\u89c8,edit\u7f16\u8f91,download\u4e0b\u8f7d\uff0c\u8fd4\u56defalse\u4e3a\u6ca1\u6709\u6743\u9650\uff0c\u5176\u4ed6\u60c5\u51b5\u4e3a\u6709\u6743\u9650</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>\u662f\u5426\u5f00\u542f\u9884\u89c8\u529f\u80fd\uff0c\u548cgetPermission type:preview\u9884\u89c8\u7ed3\u679c\u540c\u4e8b\u63a7\u5236\uff0c\u5168\u90fd\u5224\u65ad\u901a\u8fc7\u624d\u80fd\u5f00\u542f\u9884\u89c8\u529f\u80fd</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>infoItemRenders</td>\n<td>\u81ea\u5b9a\u4e49\u5217</td>\n<td>array[{span,render}]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>infoItemRenders[].span</td>\n<td>\u5f53\u524d\u5217\u6805\u683c\u6570</td>\n<td>number</td>\n<td>4</td>\n</tr>\n<tr>\n<td>infoItemRenders[].render</td>\n<td>render\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u64cd\u4f5c\u7684api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>\u6587\u4ef6\u540d\u7f16\u8f91\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>\u6587\u4ef6\u9884\u89c8\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>\u6587\u4ef6\u5220\u9664\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>OptionButtons</h4>\n<p>\u6587\u4ef6\u64cd\u4f5c\u6309\u94ae\uff0c\u53ef\u4ee5\u5e26\u6709\u7f16\u8f91\u6587\u4ef6\u540d\u79f0\uff0c\u6587\u4ef6\u9884\u89c8\uff0c\u6587\u4ef6\u5220\u9664\u7b49\u529f\u80fd</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u64cd\u4f5c\u7684api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>\u6587\u4ef6\u540d\u7f16\u8f91\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>\u6587\u4ef6\u9884\u89c8\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>\u6587\u4ef6\u5220\u9664\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>\u662f\u5426\u5f00\u542f\u9884\u89c8\u529f\u80fd\uff0c\u548cgetPermission type:preview\u9884\u89c8\u7ed3\u679c\u540c\u4e8b\u63a7\u5236\uff0c\u5168\u90fd\u5224\u65ad\u901a\u8fc7\u624d\u80fd\u5f00\u542f\u9884\u89c8\u529f\u80fd</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n</tbody>\n</table>\n<h4>FileLink</h4>\n<p>\u5916\u89c2\u7c7b\u4f3cLink\u7684\u7ec4\u4ef6\uff0c\u70b9\u51fb\u540e\u53ef\u4ee5\u5f39\u51fa\u6587\u4ef6\u9884\u89c8\u6846</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>title</td>\n<td>\u5f39\u7a97\u6807\u9898</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>id</td>\n<td>\u6587\u4ef6oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>originName</td>\n<td>\u6587\u4ef6\u540d\u79f0</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openDownload</td>\n<td>\u662f\u5426\u5f00\u542f\u6587\u4ef6\u4e0b\u8f7d</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal\u7684\u5176\u4ed6\u53c2\u6570\uff0c\u53c2\u8003Modal\u7ec4\u4ef6</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>downloadBlobFile(target, filename)</h4>\n<p>\u4e0b\u8f7d\u6587\u4ef6\u7684\u65b9\u6cd5</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>target</td>\n<td>\u4e0b\u8f7d\u94fe\u63a5\u5730\u5740,\u6216\u8005\u4e8c\u8fdb\u5236\u6570\u636e</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u540e\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>{isLoading,download,...others} = useDownload({id,filename,apis,onError,onSuccess});</h4>\n<p>\u751f\u6210\u4e0b\u8f7d\u6587\u4ef6function\u7684hooks\uff0c\u5e26\u6709\u4e0b\u8f7d\u4e2d\u7684\u72b6\u6001\u63a7\u5236</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6587\u4ef6ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u540e\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>\u4e0b\u8f7d\u5931\u8d25\u56de\u8c03</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>\u4e0b\u8f7d\u6210\u529f\u56de\u8c03</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isLoading</td>\n<td>\u662f\u5426\u6b63\u5728\u4e0b\u8f7d\u4e2d</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>download</td>\n<td>\u6267\u884c\u8be5\u65b9\u6cd5\u5f00\u59cb\u4e0b\u8f7d</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>others</td>\n<td>\u5176\u4ed6@kne/react-fetch useFetch\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>modal = useFileModal()</h4>\n<p>\u6587\u4ef6\u9884\u89c8\u5f39\u6846\u65b9\u6cd5\u751f\u6210\u7684hooks</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>\u6267\u884c\u540e\u5f39\u51fa\u6587\u4ef6\u9884\u89c8\u5f39\u7a97</td>\n<td>function({title, id, originName, apis, openDownload, ...modalProps})</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({title})</td>\n<td>\u5f39\u7a97\u6807\u9898</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>modal({id})</td>\n<td>\u6587\u4ef6oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({originName})</td>\n<td>\u6587\u4ef6\u540d\u79f0</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({apis})</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({openDownload})</td>\n<td>\u662f\u5426\u5f00\u542f\u6587\u4ef6\u4e0b\u8f7d</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal\u7684\u5176\u4ed6\u53c2\u6570\uff0c\u53c2\u8003Modal\u7ec4\u4ef6</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"File_0b279",style:"",list:[{title:"\u83b7\u53d6\u6587\u4ef6\u5730\u5740",description:"\u901a\u8fc7\u4e00\u4e2aossId\u83b7\u53d6\u6587\u4ef6\u5730\u5740",code:'const { default: File } = _File;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return <File id="qqq">{({ url }) => url}</File>;\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(getPublicPath("components-core") + "/avatar.png");\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u4e0b\u8f7d",description:"\u5c55\u793a\u6587\u4ef6\u4e0b\u8f7d",code:'const { Download } = _File;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <Download\n      id="123"\n      filename="\u4e0b\u8f7d\u7684\u6587\u4ef6"\n      onSuccess={() => {\n        console.log("\u4e0b\u8f7d\u6210\u529f");\n      }}\n    >\n      \u6587\u4ef6\u4e0b\u8f7d\n    </Download>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(getPublicPath("components-core") + "/avatar.png");\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u5217\u8868",description:"\u5c55\u793a\u6587\u4ef6\u5217\u8868",code:'const { List } = _FileList;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\n\nconst BaseExample = () => {\n  return (\n    <Space direction="vertical">\n      <List\n        dataSource={[\n          {\n            uuid: "121233",\n            type: "uploading",\n            filename: "\u5f20\u4e09\u7684\u7b80\u5386.doc",\n          },\n          {\n            id: "xxxxx",\n            filename: "\u6211\u662f\u4e00\u4efd\u7b80\u5386.pdf",\n            date: "2022-07-15T11:09:15.000+08:00",\n            userName: "\u7528\u6237\u540d",\n          },\n        ]}\n      />\n      <List dataSource={[]} />\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(\n                    getPublicPath("components-core") +\n                      "/mock/resume.pdf"\n                  );\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FileList",packageName:"@components/File",component:a},{name:"lodash",packageName:"lodash",component:d},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u94fe\u63a5",description:"\u5c55\u793a\u6587\u4ef6\u94fe\u63a5",code:'const { FileLink, useFileModal } = _File;\nconst { getPublicPath } = remoteLoader;\nconst { PureGlobal } = global;\nconst { Button } = antd;\n\nconst CustomButton = ({ children, ...p }) => {\n  const modal = useFileModal(p);\n  return (\n    <Button\n      onClick={() => {\n        modal();\n      }}\n    >\n      {p.originName}\n    </Button>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        apis: {\n          file: {\n            getUrl: {\n              loader: async ({ params }) => {\n                const mapping = {\n                  "01": "/avatar.png",\n                  "02": "/mock/demo2.html",\n                  "03": "/mock/resume.pdf",\n                };\n                return new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve(\n                      getPublicPath("components-core") + mapping[params.id]\n                    );\n                  }, 1000);\n                });\n              },\n            },\n          },\n        },\n      }}\n    >\n      <FileLink id="01" originName="\u6211\u662f\u4e00\u4e2a\u56fe\u7247.jpg" />\n      <FileLink id="02" originName="\u6211\u662f\u4e00\u4e2a\u7f51\u9875.html" />\n      <FileLink id="03" originName="\u6211\u662f\u4e00\u4e2apdf.pdf" />\n      <CustomButton id="03" originName="\u6211\u662f\u4e00\u4e2apdf.pdf" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r}]}]}}},52616:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(3874),o=t(5633),l=t(21079),d=t(55199);const r={name:"StateTag",summary:"<p>\u7528\u4e8e\u5c55\u793a\u6807\u7b7e</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>tag\u7684\u7c7b\u578b\uff0c\u7c7b\u578b\u51b3\u5b9a\u663e\u793a\u7684\u989c\u8272</td>\n<td>'default'(#666666)\u3001'skill'(#666666)(\u6b64\u65f6\u8fb9\u6846\u989c\u8272\u4e3a #EEEEEE)\u3001'success'(#027A48)\u3001'progress'(#F09700)\u3001'danger'(#D14343)\u3001'info'(#155ACF)\u3001'other'(#6740C3)(\u5f85\u5b9a\u989c\u8272)\u3001'result'(#666666)\u3001'filterResult'(#5CB8B2)</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>showBorder</td>\n<td>\u662f\u5426\u5c55\u793a\u8fb9\u6846</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>showBackground</td>\n<td>\u662f\u5426\u5c55\u793a\u80cc\u666f\u8272</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>text</td>\n<td>tag\u6587\u6848</td>\n<td>string</td>\n<td>''</td>\n</tr>\n<tr>\n<td>filterName</td>\n<td>tag\u7c7b\u578b\u4e3a\u201cfilterResult\u201d\u65f6\u663e\u793a\u5728\u524d\u8fb9\u7684\u6587\u6848</td>\n<td>string</td>\n<td>''</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003 <a href=\"https://ant.design/components/tag-cn\">antd Tag.Tag</a></p>",example:{isFull:!0,className:"StateTag_cfeaa",style:"",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u72b6\u6001\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\nconst { default: Descriptions } = _Descriptions;\nconst { range } = lodash;\nconst { Space, Typography } = antd;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <div>\u4f7f\u7528\u573a\u666f: \u5217\u8868\u9875Table,\u7b80\u5386\u8be6\u60c5\u9875</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5f85XX\uff0c\u6682\u505c" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "info", text: "\u5f85\u63d0\u4ea4\u5f00\u7968" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="info" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "XX\u4e2d\uff0c\u6b63\u5728XX\u4e2d" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "progress", text: "\u9000\u7968\u5ba1\u6838\u4e2d" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="progress" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u901a\u8fc7\uff0c\u6210\u529f\uff0c\u5b8c\u6210" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "success", text: "\u6807\u7b7e\u5185\u5bb9" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="success" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u4e0d\u901a\u8fc7\uff0c\u5931\u8d25\uff0c\u6dd8\u6c70\uff0c\u7f3a\u5e2d\uff0c\u62d2\u7edd" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "danger", text: "\u9000\u7968\u62d2\u7edd" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="danger" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u53d6\u6d88\uff0c\u64a4\u9500\uff0c\u505c\u6b62" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "default", text: "\u64a4\u9500\u5f00\u7968\u5ba1\u6838" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="default" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\uff08\u6682\u65f6\u8fd8\u672a\u7528\u5230\uff09" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "other", text: "\u6807\u7b7e\u5185\u5bb9" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="other" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n        ]}\n      />\n      <br />\n      <br />\n      <div>\u4e2a\u522b\u7279\u6b8a\u573a\u666f\uff08\u9700\u8981\u5355\u72ec\u8be2\u95eeUI):</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5f85XX\uff0c\u6682\u505c" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u63a8\u8350\u7b80\u5386" }} />\n                  <StateTag {...{ type: "success", text: "\u5df2\u9000\u7968" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5df2XX\u5f85XX" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u5f00\u7968\u5f85\u5bc4\u51fa" }} />\n                  <StateTag {...{ type: "success", text: "\u5df2\u5f85\u5bc4\u5f85\u6536\u6b3e" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            {\n              label: "\u4f7f\u7528\u89c4\u5219",\n              content: "\u5df2XX+\u8bcd\u8bed\uff1a\u6839\u636e\u540e\u9762\u7684\u8bcd\u8bed\u8bed\u4e49\u8fdb\u884c\u5224\u65ad",\n            },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u6210\u529f" }} />\n                  <StateTag {...{ type: "default", text: "\u5df2\u53d6\u6d88" }} />\n                  <StateTag {...{ type: "danger", text: "\u5df2\u5931\u8d25" }} />\n                  <StateTag {...{ type: "progress", text: "\u5df2\u6682\u505c" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5b8c\u5168\u6839\u636e\u8bed\u4e49\u8bed\u5883\u5224\u65ad" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5168\u90e8\u5230\u6b3e" }} />\n                  <StateTag {...{ type: "success", text: "\u90e8\u5206\u5230\u6b3e" }} />\n                  <StateTag {...{ type: "success", text: "\u7b80\u5386\u4eae\u70b9" }} />\n                  <StateTag {...{ type: "danger", text: "\u7b80\u5386\u98ce\u9669\u70b9" }} />\n                </div>\n              ),\n            },\n          ],\n        ]}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a},{name:"_Descriptions",packageName:"@components/Descriptions",component:o},{name:"lodash",packageName:"lodash",component:l},{name:"antd",packageName:"antd",component:d}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u6280\u80fd\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"skill"}\n        showBorder\n        showBackground={false}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u4e0b\u62c9\u83dc\u5355\u3001\u5f39\u7a97\u4e2d\u5df2\u9009\u7ed3\u679c\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"result"}\n        showBackground={false}\n        closable\n        onClose={() => console.log("close")}\n      />\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"result"}\n        closable\n        onClose={() => console.log("close")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u7b5b\u9009\u7ec4\u4ef6\u4e2d\u7b5b\u9009\u7ed3\u679c\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        filterName={"BD"}\n        text={"\u9648\u67ab\u6797\uff0c\u738b\u6653\u6668"}\n        type={"filterResult"}\n        closable\n        onClose={() => console.log("close")}\n      />\n      <br />\n      <StateTag\n        filterName={"\u6dfb\u52a0\u4eba"}\n        text={"\u9648\u67ab\u6797\uff0c\u738b\u6653\u6668\uff0c\u9648\u8def\uff0c\u5f20\u529b"}\n        type={"filterResult"}\n        closable\n        onClose={() => console.log("close")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u679a\u4e3e\u72b6\u6001\u6807\u7b7e",code:'const { StateTagEnum } = _StateTag;\nconst { PureGlobal } = global;\nconst { Space } = antd;\n\nconst BaseExample = ()=>{\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          testEnums: async ({ locale }) => {\n            console.log(locale);\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "1", description: "\u7b2c\u4e00\u9879", type: \'success\' },\n                  { value: "2", description: "\u7b2c\u4e8c\u9879", type: \'danger\' },\n                  { value: "3", description: "\u7b2c\u4e09\u9879", type: \'info\'},\n                ]);\n              }, 1000);\n            });\n          },\n        },\n      }}\n    >\n      <Space>\n        <StateTagEnum moduleName="testEnums" name="1" />\n        <StateTagEnum moduleName="testEnums" name="2" />\n        <StateTagEnum moduleName="testEnums" name="3" />\n      </Space>\n    </PureGlobal>\n  )\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a},{name:"antd",packageName:"antd",component:d},{name:"global",packageName:"@components/Global",component:t(63743)}]}]}}},56026:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(25963),o=t(63743),l=t(82723),d=t(55199),r=t(21079);const i={name:"Drawer",summary:"<p>\u5c4f\u5e55\u8fb9\u7f18\u6ed1\u51fa\u7684\u6d6e\u5c42\u9762\u677f</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>\u5f39\u7a97\u7684footer\uff0c\u5f53\u5176\u88ab\u663e\u5f0f\u8bbe\u7f6e\u6210null\u4e14footerButtons\u6ca1\u6709\u8bbe\u7f6e\u8fc7\u65f6\u5f39\u7a97\u4e0d\u663e\u793afooter\u3002\u5f53\u5b83\u7c7b\u578b\u4e3afunction\u65f6\u53ef\u4ee5\u5f97\u5230close\u65b9\u6cd5\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>\u5f39\u7a97footer\u7684\u6309\u94ae\u533a\uff0c\u9ed8\u8ba4\u4e3a\u786e\u8ba4\u548c\u53d6\u6d88\u6309\u94ae\uff0c\u9ed8\u8ba4\u6309\u94ae\u5206\u522b\u54cd\u5e94onConfirm\u548conCancel\u65b9\u6cd5\uff0c\u5982\u679c\u81ea\u5b9a\u4e49\u8bbe\u7f6efooterButtons\u5219\u9700\u8981\u81ea\u884c\u4f20\u5165onClick\u53c2\u6570\uff0conConfirm\u548conCancel\u65b9\u6cd5\u5c06\u4e0d\u751f\u6548</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>\u5f39\u7a97\u5173\u95ed\u65f6\u8c03\u7528\uff0c\u5f39\u7a97\u53d7\u63a7\u65f6\u7531\u8be5\u65b9\u6cd5\u5c06\u5916\u90e8open\u72b6\u6001\u4fee\u6539</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>\u5f53footerButtons\u672a\u81ea\u5b9a\u4e49\u8bbe\u7f6e\u65f6\u70b9\u51fb\u786e\u8ba4\u6309\u94ae\u89e6\u53d1\u6267\u884c\u8be5\u65b9\u6cd5\uff0c\u5f53\u5176\u8fd4\u56dePromise\u70b9\u51fb\u540ePromise\uff0cresolve\u4e4b\u524d\u786e\u8ba4\u6309\u94ae\u663e\u793a\u4e3aloading\u72b6\u6001\uff0c\u8fd4\u56de\u503c\u4e3afalse\u6216\u8005Promise\u7684resolve\u503c\u4e3afalse\u65f6\u5f39\u7a97\u4e0d\u4f1a\u88ab\u5173\u95ed\uff0c\u5176\u4ed6\u60c5\u51b5\u5f39\u7a97\u9ed8\u8ba4\u5173\u95ed</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u548conConfirm\u7c7b\u4f3c\uff0c\u5176\u4e3a\u70b9\u51fb\u53d6\u6d88\u6309\u94ae\u89e6\u53d1</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5f39\u7a97\u5185\u5bb9\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230close\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\uff0c\u4f1a\u63a5\u6536\u5230\u5f39\u7a97children\u7684render\u65b9\u6cd5\uff0c\u53ef\u4ee5\u5728\u5176\u5916\u90e8\u6dfb\u52a0\u4fee\u9970\u5185\u5bb9\u540e\u6267\u884crender\u65b9\u6cd5\uff0c\u7ed9render\u65b9\u6cd5\u4f20\u5165\u7684\u503c\u53ef\u4ee5\u5728children,footer,rightOptions\u7c7b\u578b\u4e3afunction\u65f6\u63a5\u6536\u5230\u5bf9\u5e94\u7684\u53c2\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>\u70b9\u51fb\u8499\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd Drawer\u7ec4\u4ef6</p>\n<h3>AppDrawer</h3>\n<p>\u5168\u5c40\u62bd\u5c49\u5305\u88f9\u7ec4\u4ef6\uff0c\u63d0\u4f9b\u6d88\u8d39\u4e0a\u4e0b\u6587\u7684\u9ed8\u8ba4\u73af\u5883\uff0c\u63d0\u4f9b\u53ef\u6d88\u8d39 React context \u7684 drawer \u7684\u9759\u6001\u65b9\u6cd5\uff0c\u53ef\u4ee5\u7b80\u5316 useDrawer \u7b49\u65b9\u6cd5\u9700\u8981\u624b\u52a8\u690d\u5165 contextHolder \u7684\u95ee\u9898\u3002</p>\n<h3>useDrawer</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aDrawer\u7ec4\u4ef6\u7684\u65b9\u6cd5,\u524d\u7f6e\u6761\u4ef6\u662f\u9700\u8981\u518d\u5168\u5c40\u6ce8\u5165AppDrawer\u5305\u88f9\u7ec4\u4ef6</p>\n<h4>return:drawer</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>drawer</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aDrawer\u5f39\u7a97\uff0c\u53c2\u6570\u540cDrawer\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>DrawerButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faDrawer\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>drawerProps</td>\n<td>\u540cDrawer\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3adrawerProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!1,className:"Drawer_9b1ed",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Drawer, useDrawer, DrawerButton } = _Drawer;\nconst { Button, Space } = antd;\nconst { range } = lodash;\nconst { useRef, useState } = React;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst api = {\n  loader: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve([\n          {\n            label: "\u5185\u5bb91",\n            content:\n              "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n          },\n          {\n            label: "\u5185\u5bb92",\n            content:\n              "\u5185\u5bb92\u5185\u5bb92\u5185\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n        ]);\n      }, 1000);\n    });\n  },\n};\n\nconst BaseExample = () => {\n  const drawer = useDrawer();\n  const [open, setOpen] = useState(false);\n  return (\n    <Space>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        open \u7ec4\u4ef6\u6253\u5f00\n      </Button>\n      <Button\n        onClick={() => {\n          drawer({\n            title: "\u6807\u9898",\n            children: "\u6253\u5f00\u4e86\u4e00\u4e2a\u62bd\u5c49",\n          });\n        }}\n      >\n        hook \u6253\u5f00\n      </Button>\n      <DrawerButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",\n            children: <Content list={data} col={1} />,\n          };\n        }}\n      >\n        \u6309\u94ae\u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </DrawerButton>\n      <Drawer title="Basic Drawer" onClose={() => setOpen(false)} open={open}>\n        <p>Some contents...</p>\n        <p>Some contents...</p>\n        <p>Some contents...</p>\n      </Drawer>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Drawer",packageName:"@components/Drawer",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:l},{name:"antd",packageName:"antd",component:d},{name:"lodash",packageName:"lodash",component:r}]}]}}},58419:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(81014),o=t(55199);const l={name:"LoadingButton",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5f53\u70b9\u51fb\u6309\u94ae\u65f6\uff0c\u9700\u8981\u663e\u793aloading\u72b6\u6001\uff0c\u5f53\u7136\u4f60\u53ef\u4ee5\u4f7f\u7528antd Button\u7684loading\u5c5e\u6027\uff0c\u4f46\u662f\u8fd9\u6837\u4f60\u9700\u8981\u81ea\u5df1\u58f0\u660e\u4e00\u4e2astate\u6765\u63a7\u5236\uff0cLoadingButton\u7ec4\u4ef6\u53ef\u4ee5\u5e2e\u4f60\u505a\u597d\u8fd9\u4ef6\u4e8b\u60c5</p>\n<h3>\u7279\u70b9</h3>\n<p>\u901a\u8fc7onClick\u8fd4\u56de\u7684Promise\u6765\u63a7\u5236Button\u7684loading\u72b6\u6001</p>\n<p>children\u9664\u4e86\u53ef\u4ee5\u4f20\u6b63\u5e38\u7684jsx\u4ee5\u5916\u8fd8\u63a5\u53d7function\u53c2\u6570\uff0c\u53ef\u4ee5\u63a5\u6536\u5230loading\u72b6\u6001\u4ee5\u4fbf\u6839\u636eloading\u72b6\u6001\u663e\u793a\u4e0d\u540c\u6587\u6848</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>onClick</td>\n<td>\u70b9\u51fb\u6309\u94ae\u89e6\u53d1\u51fd\u6570\uff0c\u53ef\u4ee5\u8fd4\u56de\u4e00\u4e2aPromise\uff0c\u5f53Promise\u518dpending\u72b6\u6001\u65f6Button\u5c06\u81ea\u52a8\u5904\u4e8eloading\u72b6\u6001\uff0c\u5f53Promise\u8fd4\u56de\u7ed3\u679c\u4f1a\u81ea\u52a8\u4eceloading\u5207\u6362\u56de\u666e\u901a\u72b6\u6001</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>Button\u7684\u5b50\u5143\u7d20\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230loading\u72b6\u6001\u7528\u6765\u5207\u6362\u663e\u793a\u5185\u5bb9</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"LoadingButton_cd4ed",style:"",list:[{title:"\u5e26\u6709\u52a0\u8f7d\u72b6\u6001\u6309\u94ae",description:"\u70b9\u51fb\u6309\u94ae\u5207\u6362\u5230\u52a0\u8f7d\u72b6\u6001\uff0c\u52a0\u8f7d\u65b9\u6cd5\u5b8c\u6210\u540e\u81ea\u52a8\u5207\u6362\u4e3a\u666e\u901a\u72b6\u6001",code:'const { default: LoadingButton } = _LoadingButton;\nconst { Space, message } = antd;\n\nconst clickHandler = () => {\n  message.success("\u70b9\u51fb\u6309\u94ae1s\u540e\u5b8c\u6210\u52a0\u8f7d");\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      message.success("\u5b8c\u6210");\n      resolve();\n    }, 1000);\n  });\n};\nconst BaseExample = () => {\n  return (\n    <Space wrap>\n      <LoadingButton onClick={clickHandler}>\u6309\u94ae</LoadingButton>\n      <LoadingButton onClick={clickHandler}>\n        {(isLoading) => (isLoading ? "\u6b63\u5728\u52a0\u8f7d\u4e2d..." : "\u5207\u6362\u52a0\u8f7d\u6587\u6848")}\n      </LoadingButton>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_LoadingButton",packageName:"@components/LoadingButton",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},62902:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(43856),o=t(55199),l=t(87558),d=t(21079);const r={name:"Common",summary:"<p>\u4e3a\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u901a\u7528\u7684\u7ec4\u4ef6\u3001\u65b9\u6cd5\u3001hooks</p>\n<h3>\u7ec4\u4ef6</h3>\n<ol>\n<li>FetchButton Button\u89e6\u53d1\u52a0\u8f7d\u6570\u636e</li>\n<li>ScrollLoader \u4e0b\u62c9\u6eda\u52a8\u52a0\u8f7d\u7ec4\u4ef6</li>\n<li>SearchInput \u63d0\u4f9b\u9632\u6296\u7684\u67e5\u8be2\u8f93\u5165\u6846</li>\n<li>SimpleBarBox</li>\n</ol>\n<h3>\u65b9\u6cd5</h3>\n<ol>\n<li>changeMoneyToChinese \u5c06\u91d1\u989d\u8f6c\u5316\u4e3a\u5927\u5199\u7684\u4eba\u6c11\u5e01\u91d1\u989d</li>\n<li>getPopupContainer</li>\n<li>getScrollEl</li>\n<li>getContainerBody</li>\n</ol>\n<h3>hooks</h3>\n<ol>\n<li>withOSSFile</li>\n</ol>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Common_d13bc",style:".Common_d13bc .scroll-list {\n  max-height: 300px;\n}",list:[{title:"FetchButton",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const Common = _Common;\n\nconst { FetchButton } = Common;\n\nconst BaseExample = () => {\n  return (\n    <FetchButton\n      api={{\n        loader: () => {\n          return [\n            { label: "1", content: "11" },\n            { label: "2", content: "22" },\n          ];\n        },\n      }}\n      modalProps={({ data }) => {\n        console.log(data);\n        alert(JSON.stringify(data));\n        return {\n          children: (\n            <div>\n              <div>\u6211\u662f\u4e00\u4e2a\u5f39\u7a97</div>\n              <div>{data[0].label}</div>\n              <div>{data[0].content}</div>\n              <div>{data[1].label}</div>\n              <div>{data[1].content}</div>\n            </div>\n          ),\n        };\n      }}\n      modalFunc={() => {}}\n    >\n      FetchButton\n    </FetchButton>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a}]},{title:"Enum",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const Common = _Common;\nconst { Space } = _antd;\n\nconst { AddressEnum, FunctionEnum, IndustryEnum } = Common;\n\nconst BaseExample = () => {\n  return (\n    <Space direction={"vertical"}>\n      <AddressEnum name={"010"} />\n      <FunctionEnum name={"010"} />\n      <IndustryEnum name={"010"} />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"_antd",packageName:"antd",component:o}]},{title:"ScrollLoader",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { get, merge, range } = lodash;\nconst Common = _Common;\nconst { default: Fetch } = _reactFetch;\n\nconst { ScrollLoader } = Common;\n\nconst BaseExample = () => {\n  console.log(Fetch, _reactFetch);\n  return (\n    <Fetch\n      loader={({ data }) => {\n        const params = Object.assign(\n          {\n            perPage: 20,\n            currentPage: 1,\n          },\n          data\n        );\n        return new Promise((resolve) => {\n          const start = (params.currentPage - 1) * params.perPage;\n          setTimeout(() => {\n            resolve({\n              totalCount: 100,\n              pageData: range(start, start + params.perPage).map((key) => {\n                return {\n                  label: `\u7b2c${key + 1}\u9879`,\n                  value: key + 1,\n                };\n              }),\n            });\n          }, 500);\n        });\n      }}\n      render={(fetchApi) => {\n        const pagination = {\n          paramsType: "data",\n          current: "currentPage",\n          pageSize: "perPage",\n          defaultPageSize: 20,\n        };\n        const current = get(\n            fetchApi.requestParams,\n            [pagination.paramsType, pagination.current],\n            1\n          ),\n          pageSize =\n            get(fetchApi.requestParams, [\n              pagination.paramsType,\n              pagination.pageSize,\n            ]) || pagination.defaultPageSize;\n\n        const formatData = {\n          list: fetchApi.data.pageData,\n          total: fetchApi.data.totalCount,\n        };\n        return (\n          <ScrollLoader\n            completeTips=""\n            className="scroll-list"\n            isLoading={!fetchApi.isComplete}\n            noMore={!formatData.total || current * pageSize >= formatData.total}\n            onLoader={async () => {\n              await fetchApi.loadMore(\n                merge({\n                  data: {\n                    [pagination.pageSize]: pageSize,\n                    [pagination.current]: current + 1,\n                  },\n                }),\n                (data, newData) => {\n                  return Object.assign({}, newData, {\n                    pageData: data.pageData.concat(newData.pageData),\n                  });\n                }\n              );\n            }}\n          >\n            {formatData.list.map((item) => {\n              return <div>{item.label}</div>;\n            })}\n          </ScrollLoader>\n        );\n      }}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"_reactFetch",packageName:"@kne/react-fetch",component:l},{name:"lodash",packageName:"lodash",component:d}]},{title:"SearchInput",description:"\u641c\u7d22\u6846",code:'const Common = _Common;\n\nconst { SearchInput } = Common;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [value, setValue] = useState("");\n  return (\n    <SearchInput\n      value={value}\n      onSearch={(value) => {\n        setValue(value);\n        console.log(value);\n      }}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a}]},{title:"AdvancedSelect",description:"\u9ad8\u7ea7\u9009\u62e9",code:'const { UserField } = _Common;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <UserField\n        defaultValue={[1]}\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectAll\n        showSelectedCount\n        countUnit="\u4eba"\n        allLabel="\u6240\u6709\u4eba"\n        showSelectedTag={false}\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"SuperSelect",description:"\u65b0\u7248\u9ad8\u7ea7\u9009\u62e9",code:'const { SuperSelectField, SuperSelectTableListField, SuperSelectUserField } =\n  _Common;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <SuperSelectUserField\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectedAll\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n      <SuperSelectField\n        isPopup={false}\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectedAll\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n      <SuperSelectTableListField\n        isPopup={false}\n        labelKey="name"\n        valueKey="id"\n        getSearchCallback={(searchProps, item, contextProps) => {\n          const { props } = contextProps;\n          const { labelKey } = props;\n          if (!searchProps.searchText) {\n            return true;\n          }\n          return item[labelKey].indexOf(searchProps.searchText) > -1;\n        }}\n        options={Array.from({ length: 20 }).map((item, key) => {\n          return {\n            id: key + 1,\n            name: `\u540d\u79f0${key + 1}`,\n            count: key + 1,\n            description: `\u63cf\u8ff0${key + 1}`,\n            disabled: key === 1,\n          };\n        })}\n        columns={[\n          {\n            name: "name",\n            title: "\u540d\u79f0",\n            span: 8,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            span: 8,\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            span: 8,\n          },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},68223:(n,e,t)=>{t.d(e,{A:()=>p});var a=t(96252),o=t(63743),l=t(3382),d=t(21079),r=t(55199),i=t(87558),s=t(82723),c=t(64671),m=t(57469);const p={name:"FormInfo",summary:'<p>\u8868\u5355\u63a7\u4ef6\uff0c\u81ea\u5e26\u6570\u636e\u57df\u7ba1\u7406\u3002\u5305\u542b\u6570\u636e\u5f55\u5165\u3001\u6821\u9a8c\u4ee5\u53ca\u5bf9\u5e94\u6837\u5f0f</p>\n<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<ul>\n<li>\u7528\u4e8e\u521b\u5efa\u6216\u7f16\u8f91\u4e00\u4e2a\u5b9e\u4f53\u6216\u6536\u96c6\u4fe1\u606f</li>\n<li>\u9700\u8981\u5bf9\u8f93\u5165\u7684\u6570\u636e\u7c7b\u578b\u8fdb\u884c\u6821\u9a8c\u65f6</li>\n</ul>\n<h3>\u6982\u5ff5</h3>\n<ul>\n<li>Form Data\uff1a\nForm\u63d0\u4ea4\u65f6\u83b7\u53d6\u5230\u7684\u8f93\u51fa\u503c\u901a\u5e38\u7528\u6765\u63d0\u4ea4\u7ed9\u540e\u7aef\uff0c\u4e0d\u5305\u542bForm\u7684\u6821\u9a8c\u4fe1\u606f\uff0c\u53ea\u5305\u542bForm\u7ec4\u4ef6\u53ef\u4ee5\u5411\u5916\u90e8\u63d0\u4f9b\u7684\u6570\u636e\u8f93\u51fa\u4fe1\u606f\u3002</li>\n<li>Form State\uff1a\nForm\u4e2d\u7528\u6765\u5b58\u50a8\u4e00\u5207\u72b6\u6001\u7684\u503c\uff0c\u5305\u542bField\u4fe1\u606f\uff0c\u6821\u9a8c\u4fe1\u606f\uff0cForm\u7684\u503c\uff08\u9700\u8981\u4e00\u5b9a\u7684\u8f6c\u6362\u4ece\u624d\u80fd\u53d8\u6210Form Data\uff09\uff0c\u8868\u5355\u662f\u5426\u9a8c\u8bc1\u901a\u8fc7\uff0c\u8868\u5355\u9519\u8bef\u4fe1\u606f\u7b49\u503c\u3002</li>\n<li>\u5b57\u6bb5\u6216\u79f0Field\uff1a\nForm\u4e2d\u7684\u4e00\u4e2a\u9879\uff0c\u5fc5\u987b\u62e5\u6709\u53c2\u6570name,label,\u53ef\u9009\u53c2\u6570rule\u3002name\u4f5c\u4e3aForm\u63d0\u4ea4\u65f6\u83b7\u53d6\u5230data\u7684key\u503c\u3002\nlabel\u4e3a\u5b57\u6bb5\u5c55\u793a\u7ed9\u7528\u6237\u7684\u540d\u5b57\u4ee5\u53ca\u5b57\u6bb5\u62a5\u9519\u65f6\u63d0\u793a\u7528\u6237\u9519\u8bef\u7684\u8bed\u53e5\u4e2d\u6307\u4ee3\u8be5\u5b57\u6bb5\u7684\u540d\u5b57\u3002\nrule\u4e3a\u4e0b\u65b9\u4ecb\u7ecd\u7684RULE\u3002\n\u4e00\u4e2aField\u7684\u53d6\u503c\u53ef\u4ee5\u662f\u7b80\u5355\u7684Number\uff0cBoolean\uff0cString\u4e5f\u53ef\u4ee5\u662f\u590d\u6742\u7684Array\uff0cObject\u7b49\uff0c\u6240\u4ee5\u5728\u8003\u8651\u4e00\u4e9b\u503c\u9700\u8981\u5206\u6210\u591a\u4e2aField\u8fd8\u662f\u96c6\u4e2d\u5728\u4e00\u4e2aField\u65f6\u975e\u5e38\u91cd\u8981\u7684\u3002\n\u4e00\u4e2a\u901a\u7528\u7684\u89c4\u5219\u662f\uff1a<em><strong>\u5bf9\u4e8eForm\u6765\u8bf4\uff0c\u5b83\u7684\u6700\u5c0f\u6821\u9a8c\u5355\u5143\u662f\u4e00\u4e2aField</strong></em>\u3002</li>\n<li>Field\u7ec4\u4ef6\uff1a\nField\u7ec4\u4ef6\u662fField\u7684\u4e00\u90e8\u5206\uff0c\u53ef\u4ee5\u7531\u7528\u6237\u81ea\u5df1\u5b9e\u73b0\u4e5f\u53ef\u4ee5\u7531\u7ec4\u4ef6\u5e93\u63d0\u4f9b\uff0c\u901a\u8fc7Form\u63d0\u4f9b\u7684Field hooks\u5c06\u5176\u53d8\u6210Field\u3002\nfield hooks\u4e3b\u8981\u63a5\u7ba1Field\u7ec4\u4ef6\u7684value\uff0conChange\u53c2\u6570\uff0c\u7528\u6765\u628aField\u7ec4\u4ef6\u7684\u503c\u83b7\u53d6\u5230Form\u7ba1\u7406\u3002Field\u7ec4\u4ef6\u5fc5\u987b\u4e3a<em><strong>\u53d7\u63a7\u7ec4\u4ef6</strong></em>\u3002\nfield hooks\u8fd8\u4f1a\u63a5\u7ba1triggerValidate\uff0c\u7528\u6765\u83b7\u53d6Field\u7684\u6821\u9a8c\u65f6\u673a\u3002field hooks\u4f1a\u5411Field\u7ec4\u4ef6\u63d0\u4f9bField\u7684\u6821\u9a8c\u72b6\u6001\u548c\u6821\u9a8c\u9519\u8bef\u4fe1\u606f\u3002</li>\n<li>RULE\uff1a\n\u7528\u4e8e\u5b57\u6bb5\u7684\u6821\u9a8c\u3002RULE\u53ef\u4ee5\u4e3a\u4e00\u4e2afunction\u6216\u8005\u6b63\u5219\u8868\u8fbe\u5f0f\uff0c\u4e0d\u8fc7\u63a8\u8350\u4ee5\u5927\u5199\u5b57\u7b26\u4e32\u8c03\u7528\u3002\n\u5b57\u7b26\u4e32\u5f62\u5f0f\u7684RULE\u4ee5\u7a7a\u683c\u4e3a\u95f4\u9694\u53ef\u4ee5\u4f20\u5165\u591a\u6761\u89c4\u5219\uff0c\u5982\uff1a"REQ TEL"\uff0c\n\u6267\u884c\u6821\u9a8c\u65f6\u4f1a\u4ece\u5de6\u81f3\u53f3\u4f9d\u6b21\u6821\u9a8c\uff0c\u5982\u679c\u5de6\u4fa7\u7684\u89c4\u5219\u6821\u9a8c\u5931\u8d25\u5219\u4e0d\u518d\u6267\u884c\u5176\u53f3\u4fa7\u89c4\u5219\uff0c\u8fd4\u56de\u6821\u9a8c\u5931\u8d25\u72b6\u6001\u53ca\u8be5\u89c4\u5219\u5931\u8d25\u539f\u56e0\u63d0\u793a\u4f5c\u4e3a\u5b57\u6bb5\u6821\u9a8c\u5931\u8d25\u539f\u56e0\u3002\n\u5b57\u7b26\u4e32RULE\u5141\u8bb8\u4f20\u5165\u53c2\u6570\uff0c\u53c2\u6570\u4ee5\u4e2d\u5212\u7ebf\u9694\u5f00\uff0c\u53ef\u4f20\u5165\u591a\u4e2a\u53c2\u6570\uff0c\u5982\uff1a"LEN-3-10"\u3002\n\u5b57\u7b26\u4e32RULE\u4f7f\u7528\u524d\u5fc5\u987b\u5728Form\u7ec4\u4ef6\u4e2d\u6709\u6240\u58f0\u660e\uff0cForm\u7684RULE\u58f0\u660e\u67093\u4e2a\u7ea7\u522b\uff1a\n\u9ed8\u8ba4\u7ea7\uff0c\u5305\u542b\u4e8eForm\u5185\u90e8\uff0c\u63d0\u4f9b\u4e86\u4e00\u4e9b\u57fa\u672c\u7684\u6821\u9a8c\u89c4\u5219\u3002preset\u7ea7\uff1a\u5728\u9879\u76ee\u7684preset\u4e2d\u58f0\u660e\uff0c\u5e94\u8be5\u628a\u9879\u76ee\u4e2d\u5e38\u7528\u7684\u6216\u8005\u662f\u6bd4\u8f83\u590d\u6742\u7684RULE\u58f0\u660e\u96c6\u4e2d\u7ef4\u62a4\u4e8e\u6b64\u3002\nForm\u7ea7\uff1a\u4ee5rules\u53c2\u6570\u4f20\u5165Form\u7ec4\u4ef6\uff0c\u4e3b\u8981\u662f\u67d0Form\u5355\u72ec\u4f7f\u7528\u7684RULE\u3002\n\u5982\u679c\u58f0\u660e\u5b57\u7b26\u76f8\u540c\uff0c\u4f1a\u4ee5 Form\u7ea7&gt;preset\u7ea7&gt;\u9ed8\u8ba4\u7ea7 \u8fdb\u884c\u8986\u76d6\u3002\nRULE\u58f0\u660e\u4e3a\u4e00\u4e2a\u5bf9\u8c61\uff0ckey\u548c\u53bb\u6389\u53c2\u6570\u7684\u5b57\u7b26\u4e32RULE\u76f8\u540c\uff0cvalue\u4e3a\u4e00\u4e2afunction\u79f0\u4e3a\u6821\u9a8c\u51fd\u6570\u3002\u6b64function\u63a5\u6536\u5230\u7684\u53c2\u6570\u6709\u4e09\u90e8\u5206(\nvalue,[...args]\n,{data,{field}}),\u7b2c\u4e00\u4e2a\u53c2\u6570value\u4e3a\u5f53\u524d\u5b57\u6bb5\u7684\u503c\uff0c\u6700\u540e\u4e00\u4e2a\u53c2\u6570\u4e3aform\u7684\u72b6\u6001\uff0cdata\u662fform\u7684\u5f53\u524d\u503c\uff0cfield\u662fform\u91cc\u9762\u5f53\u524d\u5b57\u6bb5\u7684\u4fe1\u606f\uff0c\n\u4e2d\u95f4\u53c2\u6570args\u4e3a\u5b57\u7b26\u4e32\u53c2\u6570\u5982\uff1a"LEN-3-10"\u4f1a\u63a5\u6536\u52303\u548c20\u4e24\u4e2a\u53c2\u6570\u3002\u6821\u9a8c\u51fd\u6570\u8fd4\u56de{result,errMsg}\uff0c\n\u6216\u8005\u4e00\u4e2aPromise.resolve({result,errMsg})\u7684Promise\u5bf9\u8c61\u3002result\u4e3a\u6821\u9a8c\u662f\u5426\u901a\u8fc7\uff0cerrMsg\u4e3a\u5931\u8d25\u63d0\u793a\uff0c\u5931\u8d25\u63d0\u793a\u53ef\u4ee5\u7528%s\u5360\u4f4d\uff0c\u5c55\u793a\u65f6\u4f1a\u66ff\u6362\u6210\u5b57\u6bb5\u7684label\u3002</li>\n<li>\u6821\u9a8c\u6216\u79f0Validate\uff1a\nForm\u4f1a\u5728Field\u7ec4\u4ef6\u6267\u884ctriggerValidate\u65f6\u6267\u884c\u5f53\u524dField\u7684Validate\uff0c\u8868\u5355\u63d0\u4ea4\u65f6\u6267\u884c\u6240\u6709Field\u7684Validate\u3002\nValidate\u4f1a\u4e32\u884c\u6267\u884cRULE\u91cc\u9762\u7684\u6240\u6709\u89c4\u5219\u7684\u6821\u9a8c\u51fd\u6570\uff0c\u6821\u9a8c\u51fd\u6570\u8fd4\u56dePromise\u65f6\u4e5f\u4f1a\u7b49\u5f85\u5de6\u8fb9\u7684\u6821\u9a8c\u51fd\u6570\u7684Promise\u5b8c\u6210\u518d\u6267\u884c\u53f3\u8fb9\u7684\u89c4\u5219\u6821\u9a8c\u51fd\u6570\u3002\n\u8868\u5355\u63d0\u4ea4\u65f6\uff0c\u6b63\u5728\u6267\u884c\u5f02\u6b65\u7684\u6821\u9a8c\u51fd\u6570\u7684Field\u5c06\u4e0d\u4f1a\u91cd\u590d\u6267\u884cValidate\u3002\u8868\u5355\u63d0\u4ea4\u65f6\u6240\u6709Field\u7684\u6821\u9a8c\u72b6\u6001\u4e3a\u901a\u8fc7\u65f6\u624d\u4f1a\u6267\u884conSubmit\u65b9\u6cd5\uff0c\u5426\u5219\u4f1a\u6267\u884conError\u65b9\u6cd5\uff0c\nonPrevSubmit\u65b9\u6cd5\u5728\u7528\u6237\u70b9\u51fb\u63d0\u4ea4\u6309\u94ae\u65f6\u5c31\u4f1a\u89e6\u53d1\uff0c\u4e0d\u7ba1Validate\u7ed3\u679c\u662f\u5426\u4e3a\u901a\u8fc7\u3002</li>\n<li>Event\uff1a\nForm\u91c7\u7528\u4e86\u4e8b\u4ef6\u9a71\u52a8\u7684\u65b9\u5f0f\u6765\u8bbe\u8ba1\uff0c\u7528\u4ee5\u6ee1\u8db3\u591a\u79cd\u5f02\u6b65\u6821\u9a8c\uff0c\u548c\u7ed9Form\u63d0\u4f9b\u5f3a\u5927\u7684\u53ef\u6269\u5c55\u6027\u3002\nForm\u7684API\u91cc\u9762\u53ef\u4ee5\u83b7\u53d6\u5230\u7684emitter\u5c31\u662fForm\u5185\u90e8\u7684\u4e8b\u4ef6\u53d1\u5c04\u5668\uff0c\u53ef\u4ee5\u89e6\u53d1Form\u5185\u90e8\u5b9a\u4e49\u7684\u4e8b\u4ef6\uff0c\u4e5f\u53ef\u4ee5\u81ea\u5b9a\u4e49\u4e00\u4e9b\u4e8b\u4ef6\u3002\u540c\u65f6\u53ef\u4ee5\u901a\u8fc7emitter.addListener\u76d1\u542c\u4e8b\u4ef6\u3002\nForm\u5185\u90e8\u5b9a\u4e49\u7684\u4e8b\u4ef6\u6709\uff1a\nform-field-add\uff1aField\u88ab\u6dfb\u52a0\u8fdbForm\u65f6\u89e6\u53d1\uff0c\nform-field-edit\uff1aField\u7684\u53c2\u6570\u53d1\u751f\u6539\u53d8\u65f6\u89e6\u53d1\uff0c\norm-field-remove\uff1aField\u88ab\u5378\u8f7d\u65f6\u89e6\u53d1\uff0c\nform-field-validate\uff1aField\u6267\u884cValidate\u65f6\u89e6\u53d1\uff0c\nform-field-data-change\uff1aField\u7684\u503c\u53d1\u751f\u4fee\u6539\u65f6\u89e6\u53d1\uff0c\nform-data-reset\uff1aForm\u7ec4\u4ef6\u91cd\u7f6edata\u65f6\u89e6\u53d1\uff0c\nform-data-set-field\uff1aForm\u7ec4\u4ef6\u7ed9data\u8d4b\u503c\u65f6\u89e6\u53d1\uff0c\nform-data-set-field-validate\uff1aField\u88ab\u8d4b\u503c\u65f6\u89e6\u53d1\uff0c\nform-validate-all\uff1aForm\u6267\u884c\u5168\u90e8Field\u7684Validate\u65f6\u89e6\u53d1\uff0c\u4e00\u822c\u4e3a\u8868\u5355\u63d0\u4ea4\u65f6\uff0c\nform-submit\uff1a\u8868\u5355\u63d0\u4ea4\u65f6\u89e6\u53d1\u3002</li>\n<li>\u62e6\u622a\u5668\u6216\u79f0Interceptor\uff1a\n\u6ca1\u6709Field\u53ef\u4ee5\u63a5\u6536\u4e00\u4e2ainterceptor\u53c2\u6570\uff0c\u5b57\u7b26\u4e32\u7c7b\u578b\uff0c\u548cRULE\u7c7b\u4f3c\u53ef\u4ee5\u518dpreset\u6216\u8005Form\u7684interceptors props\u4e2d\u58f0\u660e\u4ee5\u540e\u4f7f\u7528\uff0c\u53ef\u4ee5\u914d\u7f6e\u591a\u4e2a\u7528\u7a7a\u683c\u8fde\u63a5\u3002\n\u62e6\u622a\u5668\u7684\u4f5c\u7528\u662f\uff0c\u5728Field\u63a5\u6536\u5230\u4e00\u4e2a\u65b0\u7684\u503c\u65f6\uff0c\u4f1a\u4e32\u884c\u6267\u884c\u62e6\u622a\u5668\u7684output\u90e8\u5206\uff0c\u628a\u5176\u8fd4\u56de\u503c\u8f93\u51fa\u5230Form Data\u3002\n\u5728\u6267\u884cForm Data\u7684\u8d4b\u503c\u64cd\u4f5c\u65f6\u628a\u8d4b\u503c\u4f5c\u4e3a\u8f93\u5165\u4e32\u884c\u6267\u884c\u62e6\u622a\u5668\u7684input\u90e8\u5206\uff0c\u628a\u5176\u7ed3\u679c\u4f5c\u4e3aForm Data\u7684\u8f93\u5165\u3002\n\u73b0\u5728\u6709\u4e2aField\u662f\u65e5\u671f\u9009\u62e9\uff0c\u8f93\u51faDate\u7c7b\u578b\u503c\uff0c\u4f46\u662fForm Data\u8f93\u51fa\u5e0c\u671b\u5c06\u5176\u683c\u5f0f\u5316\u4e3a\u65e5\u671f\u5b57\u7b26\u4e32\uff0c\u5728\u8868\u5355\u7f16\u8f91\u65f6Form\nData\u8f93\u5165\u683c\u5f0f\u5316\u540e\u7684\u65e5\u671f\u5b57\u7b26\u4e32\uff0c\u4f46\u662fField\u53ea\u63a5\u6536Date\u7c7b\u578b\u7684\u503c\uff0c\n\u4ee5\u4e0b\u4f8b\u5b50\u53ef\u4ee5\u6765\u89e3\u51b3\u6b64\u95ee\u9898\uff1a<pre><code class="language-jsx">interceptors.input.use("date-string", (value) =&gt; {\n  return value ? new Date(value) : null;\n});\n\ninterceptors.output.use("date-string", (value) =&gt; {\n  return value ? dayjs(value).format("YYYY-MM-DD") : "";\n});\n\n&lt;Field name="date" label="\u65e5\u671f" interceptor="date-string"/&gt;\n</code></pre>\n</li>\n<li>Group\uff1a\n\u5f53Form\u7684data\u9700\u8981\u63a5\u6536\u5230\u4e00\u4e2a\u590d\u6742\u503c\u7684\u65f6\u5019\uff0c\u53ef\u4ee5\u4f7f\u7528Group\u6765\u5b9e\u73b0\uff0c\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="baseInfo"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{name:"xxx",des:"xxx"}}\uff0cGroup\u7684name\u548cField\u7684name\u4e00\u81f4\u65f6\u4e5f\u53ef\u4ee5\u7528\u6765\u8868\u793a\u6570\u7ec4\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="name"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n&lt;/Group&gt;\n&lt;Group name="des"&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {name:["name1","name2"],des:["des1","des2"]}\u3002\nGroup\u53ef\u4ee5\u5d4c\u5957\uff0c\u5982<pre><code class="language-jsx">&lt;Group name="baseInfo"&gt;\n  &lt;Group name="info"&gt;\n    &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;/Group&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{info:{name:\'xxx\'},des:\'xxx\'}}\u3002\n\u652f\u6301\u70b9\u64cd\u4f5c\uff0c\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="baseInfo.info"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{info:{name:\'xxx\',des:\'xxx\'}}}\u3002</li>\n<li>GroupList\uff1a\n\u4f7f\u7528Group\u5b9e\u73b0\u7684\u4e00\u4e2a\u7279\u6b8a\u7684\u533a\u57df\u7528\u6765\u66f4\u65b9\u4fbf\u7684\u5b9e\u73b0\u591a\u6bb5\u5f0f\u7684\u8868\u5355\u5982\uff1a<pre><code class="language-jsx">&lt;Button onClick={()=&gt;ref.current.onAdd()}&gt;\u6dfb\u52a0&lt;/Button&gt;\n&lt;GroupList name="edu" ref={ref}&gt;\n  {(key,{index,length,onAdd,onRemore})=&gt;&lt;&gt;\n    &lt;Button onClick={onRemore}&gt;\u5220\u9664&lt;/Button&gt;\n    &lt;Field name="schoolName" label="\u5b66\u6821\u540d\u79f0"/&gt;\n    &lt;Field name="degree" label="\u5b66\u5386"/&gt;\n    &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n  &lt;/&gt;}\n&lt;/GroupList&gt;\n</code></pre>\n\u4ee5\u4e0a\u662f\u4e00\u4e2a\u7b80\u5386\u7684\u5b66\u5386\u5217\u8868\u7684\u5b9e\u73b0\uff0c\u53ef\u4ee5\u70b9\u51fb\u6dfb\u52a0\u6309\u94ae\u6dfb\u52a0\u591a\u6bb5\u5b66\u5386Field\uff0c\u53ef\u4ee5\u70b9\u51fb\u5220\u9664\u6309\u94ae\u5220\u9664\u5f53\u524d\u4e00\u6bb5\u5b66\u5386Field\uff0c\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230\u7684 {edu:[{schoolName:\'xxx\',degree:\'xxx\',des:\'xxx\'}]}\u3002\n\u5f53\u7136\u4f60\u53ef\u4ee5\u4e0d\u7528\u4f7f\u7528\u8fd9\u6837\u5e95\u5c42\u7684API\uff0cFormInfo.List \u5df2\u7ecf\u5e2e\u4f60\u5904\u7406\u597d\u4e00\u5207\u3002</li>\n</ul>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u96c6\u4e2d\u5316\u6821\u9a8c\u89c4\u5219\u7ba1\u7406\uff0c\u5206\u5c42\u62bd\u8c61\uff0c\u8c03\u7528\u7b80\u4fbf</li>\n<li>\u652f\u6301\u5f02\u6b65\u6821\u9a8c\u89c4\u5219</li>\n<li>\u4e8b\u4ef6\u9a71\u52a8\u5f0f\u67b6\u6784\u8bbe\u8ba1\uff0c\u4fbf\u4e8e\u6269\u5c55</li>\n<li>\u652f\u6301Group\u53caGroupList\uff0c\u53ef\u8f7b\u677e\u5b9e\u73b0\u590d\u6742\u8868\u5355</li>\n<li>UI\uff0c\u6821\u9a8c\u903b\u8f91\u5206\u5c42\u62bd\u8c61\uff0c\u4e00\u6b21\u5c01\u88c5\u4f7f\u7528\u7b80\u5355</li>\n<li>context\u548cref\u53cc\u91cdAPI\u66b4\u9732\uff0c\u5728Form\u5185\u8fd8\u662fForm\u5916\u90fd\u80fd\u8f7b\u677e\u83b7\u53d6</li>\n<li>form-helper\u63d0\u4f9b\u57fa\u672c\u7684\u8868\u5355\u5c01\u88c5\uff0c\u7075\u6d3b\u7ec4\u5408</li>\n<li>\u652f\u6301\u62e6\u622a\u5668\uff0c\u4fbf\u6377\u5b9e\u73b0FormData\u548cField\u7684\u503c\u4e4b\u95f4\u7684\u8f6c\u6362</li>\n</ul>\n<h3>Field\u5b9e\u73b0\u89c4\u8303</h3>\n<ul>\n<li>FormInfo\u91cc\u9762\u7684Field\u90fd\u4f1a\u653e\u7f6e\u5728fields\u6587\u4ef6\u5939\uff0c\u5176\u4e2d\u6bcf\u4e2a\u6587\u4ef6\u5939\u4ee3\u8868\u4e00\u4e2aField</li>\n<li>\u4e00\u4e2aField\u53ea\u80fd\u9ed8\u8ba4\u5bfc\u51fa\u4f1a\u88ab\u5f15\u7528\uff0c\u5176\u4ed6\u7684\u65b9\u6cd5\u679a\u4e3e\u7b49\u9700\u8981\u653e\u7f6e\u5728\u9ed8\u8ba4\u5bfc\u51fa\u7684\u7ec4\u4ef6\u7684function\u7684\u9759\u6001\u5c5e\u6027\u4e0a</li>\n<li>\u4e00\u4e2aField\u7684\u9ed8\u8ba4\u5bfc\u51fa\u7ec4\u4ef6\u53ea\u80fd\u88ab\u653e\u7f6e\u5728Form\u4e2d\u4f5c\u4e3aField\u88ab\u4f7f\u7528\uff0c\u5b83\u7684Field\u7ec4\u4ef6\u4f1a\u88ab\u6302\u8f7d\u5728\u9ed8\u8ba4\u5bfc\u51fa\u7684\u7ec4\u4ef6\u7684function\u7684Field\u9759\u6001\u5c5e\u6027\u4e0a</li>\n<li>\u4e00\u4e2aField\u7684Field\u7ec4\u4ef6\u5fc5\u987b\u652f\u6301\u53d7\u63a7\u548c\u975e\u53d7\u63a7\u4e24\u79cd\u5f62\u5f0f</li>\n<li>\u4e00\u4e2aField\u7684\u5bfc\u51fa\u5fc5\u987b\u88ab\u5305\u542b\u5728FormInfo\u5bfc\u51fa\u7684formModule\u4e2d\u548cFormInfo\u4e2d\uff0c\u5373\uff1a\u4ee5\u4e0b\u4e24\u79cd\u65b9\u6cd5\u90fd\u53ef\u4ee5\u83b7\u53d6\u5230\u8be5Field<pre><code class="language-jsx">import {SomeField} from "@component/FormInfo";\n</code></pre>\n<pre><code class="language-jsx">import {formModule} from "@component/FormInfo";\nconst {SomeField} = formModule;\n</code></pre>\n</li>\n</ul>\n<h3>\u9009\u62e9\u5668\u7c7b\u578bField\u7ec4\u4ef6\u5b9e\u73b0\u89c4\u8303</h3>\n<ul>\n<li>\u5fc5\u987b\u4f7f\u7528SelectInnerInput\u4f5c\u4e3a\u9009\u62e9\u5668\u7684\u503c\u663e\u793a\u548c\u89e6\u53d1\u7684\u8f93\u5165\u6846</li>\n<li>SelectInnerInput\u53ef\u4ee5\u901a\u8fc7isPopup\u63d0\u4f9bpopup\u548cmodal\u4e24\u79cd\u5c55\u793a\u5f62\u6001\u548c\u4ea4\u4e92\u903b\u8f91\uff0cField\u7ec4\u4ef6\u53ef\u4ee5\u901a\u8fc7\u81ea\u8eab\u7684\u9ed8\u8ba4\u503c\u6216\u8005\u8c03\u7528SelectInnerInput\u65f6\u663e\u5f0f\u6307\u5b9a\u6765\u8bbe\u7f6e\u6700\u4f73\u63a8\u8350\u7684\u9ed8\u8ba4\u5f62\u5f0f\uff0c\u4e00\u822c\u60c5\u51b5\u4e00\u79cd\u9009\u62e9\u5668\u9700\u8981\u826f\u597d\u652f\u6301\u4e24\u79cd\u5f62\u5f0f</li>\n<li>SelectInnerInput\u53ef\u4ee5\u901a\u8fc7single\u51b3\u5b9a\u8f93\u51fa\u503c\u662f\u5355\u9879\u8fd8\u662f\u591a\u9879\uff0c\u5355\u9879\u548c\u591a\u9879\u7684\u4ea4\u4e92\u903b\u8f91\u4e5f\u53ef\u80fd\u4e0d\u540c\uff0cSelectInnerInput\u7684\u5185\u90e8value state\u90fd\u662f\u4f7f\u7528\u591a\u9879\u503c\u6765\u5904\u7406\u7684\uff0c\u5728\u8f93\u5165\u503c\u548c\u5728onChange\u8f93\u51fa\u65f6\u6839\u636e\u53c2\u6570\u8f6c\u5316\u6210\u6570\u7ec4\uff0c\u4e00\u822c\u60c5\u51b5\u4e00\u79cd\u9009\u62e9\u5668\u9700\u8981\u652f\u6301\u4e24\u79cd\u60c5\u51b5</li>\n<li>\u9009\u62e9\u5668\u53ef\u80fd\u4f1a\u5728\u9876\u90e8\u6709\u4e00\u4e2a\u641c\u7d22\u6846\uff0c\u901a\u8fc7\u4f7f\u7528\u65f6\u662f\u5426\u4f20\u5165getSearchProps\u6765\u51b3\u5b9a\u641c\u7d22\u6846\u662f\u5426\u663e\u793a\uff0c\u5728FormInfo/common\u4e2d\u63d0\u4f9b\u4e86\u9ed8\u8ba4\u7684SearchInput\u5b9e\u73b0\uff0cSelectInnerInput\u4e2d\u7ba1\u7406\u4e86\u5176searchText\u548csetSearchText\u72b6\u6001</li>\n<li>FormInfo/fields/AdvancedSelect/createList.js \u5b9e\u73b0\u4e86\u4e00\u4e2a\u5217\u8868\u5f0f\u9009\u62e9\u5668\uff0c\u5b9e\u73b0\u4e86\u5305\u62ec\u641c\u7d22\uff0c\u4e0b\u62c9\u52a0\u8f7d\u7b49\u903b\u8f91\uff0c\u53ea\u9700\u8981\u5b9e\u73b0\u5217\u8868\u6e32\u67d3\u903b\u8f91\u5c31\u53ef\u4ee5\u65b9\u4fbf\u7684\u6269\u5c55\u51fa\u65b0\u7684List\u7c7b\u578b\u9009\u62e9\u5668</li>\n<li>\u901a\u8fc7SelectInnerInput.useContext \u53ef\u4ee5\u62ff\u5230\u9009\u62e9\u5668\u7684\u7528\u6237\u4f20\u5165\u5c5e\u6027\uff08props\uff09\uff0c\u503c\u5230\u9009\u9879\u7684\u6620\u5c04\uff08mapping\uff09\uff0c\u641c\u7d22\u6846\u7684state\uff08searchText,setSearchText\uff09\uff0c\u6570\u636e\u52a0\u8f7d\u5668\u7684API\uff08fetchApi\uff09\u539f\u59cbvalue\u503c\uff08valueState\uff09\uff0c\u6dfb\u52a0\u6620\u5c04\u65b9\u6cd5\uff08appendItems\uff09</li>\n</ul>',api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>data</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>debug</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>rules</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>interceptors</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>noFilter</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onError</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onSubmit</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onPrevSubmit</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3>SelectInnerInput</h3>\n<h3>formModule</h3>\n<h3>FormInfo</h3>\n<h3>preset</h3>\n<h3>List</h3>\n<h3>Form</h3>\n<p>\u540cdefault\u5bfc\u51fa\u7ec4\u4ef6</p>\n<h3>useField</h3>\n<h3>useReset</h3>\n<h3>useSubmit</h3>\n<h3>Group</h3>\n<h3>GroupList</h3>\n<h3>useFormContext</h3>\n<h3>RULES</h3>\n<h3>interceptors</h3>\n<h3>SubmitButton</h3>\n<h3>CancelButton</h3>\n<h3>ResetButton</h3>\n<h3>Field\u7c7b\u578b:antd\u7ec4\u4ef6</h3>\n<p>\u4ee5\u4e0b\u7ec4\u4ef6\u8bf7\u53c2\u8003antd\u5177\u4f53\u7684\u7ec4\u4ef6\u6587\u6863\u6b64\u5904\u4e0d\u518d\u8d58\u8ff0</p>\n<p>Checkbox,CheckboxGroup,DatePicker,Input,InputNumber,RadioGroup,Select,Switch,TextArea,TimePicker,TreeSelect</p>\n<h3>Field\u7c7b\u578b:@kne/react-form-antd\u5b9e\u73b0\u7ec4\u4ef6</h3>\n<p>DatePickerToday</p>\n<h3>Field\u7c7b\u578b:components-core\u5b9e\u73b0\u7ec4\u4ef6</h3>\n<p>AddressSelect</p>\n<p>AdvancedSelect</p>\n<p>Avatar</p>\n<p>Cascader</p>\n<p>FunctionSelect</p>\n<p>IndustrySelect</p>\n<p>Money</p>\n<p>PartSelect</p>\n<p>PhoneNumber</p>\n<p>TableDataSelect</p>\n<p>Upload</p>\n<h3>FormModal</h3>\n<p>\u4e00\u4e2aForm\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5b83\u9884\u7f6e\u4e86Form\u7ec4\u4ef6\uff0cchildren\u4f20\u5165\u7684\u5185\u5bb9\u548cfooter\u533a\u57df\u5747\u5728Form\u7684context\u5185</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formProps</td>\n<td>\u540cForm\u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>useFormModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aFormModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:formModal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formModal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aFormModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cFormModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>FormModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faFormModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cFormModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!0,className:"FormInfo_f344c",style:".FormInfo_f344c .input > .ant-row > .ant-col {\n  padding: 10px 0;\n}\n.FormInfo_f344c .input .ant-space-item:last-child {\n  width: 100%;\n}",list:[{title:"\u4e00\u4e2a\u7b80\u5355\u8868\u5355\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7b80\u5355\u8868\u5355\u793a\u4f8b",code:'const {default: FormInfo, Form, SubmitButton, ErrorTip, fields} = _FormInfo;\nconst {PureGlobal} = global;\nconst {useModal} = _Modal;\nconst {uniqueId} = lodash;\n\nconst {\n    Input,\n    TextArea,\n    Upload,\n    Avatar,\n    PhoneNumber,\n    TypeDateRangePicker,\n    Rate,\n    Switch,\n    Slider,\n    MoneyInput,\n    ColorPicker,\n    SuperSelectTree\n} = fields;\n\nconst BaseExample = () => {\n    const modal = useModal();\n    return (<Form\n        helperGuideName="test-from"\n        lang={["cn", {\n            name: "EnUS", label: "\u82f1\u6587", options: {\n                //labelTransform: (label) => label + "(en)",\n                ignore: [{name: "avatar"}, {name: "photo"}], disabled: [{name: "file"}], //fields:[{name:\'name\'}]\n            },\n        },]}\n        rules={{\n            REP: (value) => {\n                return new Promise((resolve) => {\n                    setTimeout(() => {\n                        resolve({\n                            result: false, errMsg: "%s\u91cd\u590d", data: {\n                                user: "\u6211\u662f\u4e00\u4e2a\u91cd\u590d\u7684\u4e1c\u897f",\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        }}\n        onSubmit={(data) => {\n            modal({\n                title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e", children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n            });\n        }}\n    >\n        <FormInfo\n            title="\u57fa\u672c\u4fe1\u606f"\n            list={[<Avatar name="avatar" label="\u5934\u50cf" labelHidden block/>, <Avatar\n                name="photo"\n                label="\u8bc1\u4ef6\u7167"\n                dropModalSize="default"\n                border={50}\n                width={960}\n                height={540}\n                block\n            />, <ErrorTip\n                name="name"\n                errorRender={({validateData}) => {\n                    console.log(validateData);\n                    if (!validateData.REP) {\n                        return null;\n                    }\n                    return <div>\u54c8\u54c8\u54c8{validateData.REP.user}</div>;\n                }}\n            >\n                <Input\n                    name="name"\n                    label="\u59d3\u540d"\n                    rule="REQ LEN-3-10 REP"\n                    tips="\u59d3\u540d"\n                />\n            </ErrorTip>, <ColorPicker name="color" label="\u4e3b\u9898\u8272"/>,\n                <MoneyInput name="money" label="\u91d1\u989d" rule="REQ" tips={"money"}/>,\n                <PhoneNumber name="phone" label="\u624b\u673a" rule="REQ" disabled/>,\n                <Input name="email" label="\u90ae\u7bb1" rule="EMAIL"/>, <Upload name="file" label="\u6587\u4ef6" tips="\u6587\u4ef6" block/>,\n                <Rate name="rate" label="\u8bc4\u5206" tips="\u8bc4\u5206"/>, <Switch name="switch" label="\u5f00\u5173" tips="\u5f00\u5173">\n                    {({checked}) => (checked ? "\u5f00" : "\u5173")}\n                </Switch>, <Slider name="slider" label="\u6ed1\u52a8\u6761" tips="\u6ed1\u52a8\u6761"/>, <TypeDateRangePicker\n                    name="type_date"\n                    label="\u65e5\u671f\u65f6\u95f4\u6bb5"\n                    tips="\u65e5\u671f\u65f6\u95f4\u6bb5"\n                    rule="REQ"\n                />, <SuperSelectTree name="tree" label="\u6811\u9009\u62e9" options={[{\n                    value: \'1\', label: \'\u7236\u8282\u70b9\',\n                }]}/>, <TextArea name="des" label="\u5907\u6ce8" tips="\u5907\u6ce8" block/>, <SubmitButton>\u63d0\u4ea4</SubmitButton>,]}\n        />\n    </Form>);\n};\n\nrender(<PureGlobal\n    preset={{\n        locale: "en-US", enums: {\n            helperGuide: () => [{\n                value: "test-from-name", content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863", url: "/",\n            },],\n        }, apis: {\n            oss: {\n                loader: () => {\n                    return window.PUBLIC_URL + "/avatar.png";\n                },\n            }, ossUpload: async ({file}) => {\n                console.log(file);\n                return new Promise((resolve) => {\n                    setTimeout(() => {\n                        const id = uniqueId("file-");\n                        resolve({\n                            data: {\n                                code: 0, data: {\n                                    id, originalName: id + "\u7b80\u5386.pdf",\n                                },\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        },\n    }}\n>\n    <BaseExample/>\n</PureGlobal>);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Modal",packageName:"@components/Modal",component:l},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u591a\u884c",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u591a\u884c\u5b57\u6bb5\u793a\u4f8b",code:'const { default: FormInfo, Form, MultiField, SubmitButton, fields } = _FormInfo;\nconst { useModal } = _Modal;\n\nconst { Input, TextArea } = fields;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  return (\n    <Form\n      onSubmit={(data) => {\n        modal({\n          title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <FormInfo\n        list={[\n          <MultiField\n            name="no"\n            label="\u5355\u53f7"\n            rule="REQ"\n            field={Input}\n            maxLength={5}\n            tips={"\u5355\u53f7"}\n          />,\n          <Input name="name" label="\u540d\u79f0" />,\n          <MultiField name="description" label="\u8bf4\u660e" field={TextArea} />,\n        ]}\n      />\n      <SubmitButton>\u63d0\u4ea4</SubmitButton>\n    </Form>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"_Modal",packageName:"@components/Modal",component:l}]},{title:"\u4e00\u4e2a\u542b\u6709\u591a\u6bb5\u5217\u8868\u7684\u8868\u5355\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u542b\u6709\u591a\u6bb5\u5217\u8868\u7684\u8868\u5355\u793a\u4f8b\uff0c\u5217\u8868\u7684\u6700\u5927\u957f\u5ea6\u4e3a5\uff0c\u5728\u6dfb\u52a05\u6bb5\u4e4b\u540e\u6dfb\u52a0\u6309\u94ae\u81ea\u52a8\u9690\u85cf",code:'const {\n  default: FormInfo,\n  Form,\n  List,\n  AdvancedSelect,\n  TableList,\n  Input,\n  TextArea,\n  SubmitButton,\n  FormApiButton,\n} = _FormInfo;\nconst { PureGlobal } = global;\nconst { useModal } = _Modal;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  return (\n    <Form\n      onSubmit={(data) => {\n        modal({\n          title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <Space direction="vertical" size={16}>\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="name" label="\u57fa\u672c\u540d\u79f0" rule="REQ" block />,\n            <TextArea name="des" label="\u57fa\u672c\u63cf\u8ff0" block />,\n          ]}\n        />\n        <List\n          name="list"\n          title="\u5217\u8868"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n          ]}\n        />\n        <TableList\n          name="tableList"\n          title="\u8868\u683c\u5217\u8868"\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <AdvancedSelect\n              name="select"\n              label="\u9009\u9879"\n              rule="REQ"\n              value={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7b2c\u4e00\u9879",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7b2c\u4e8c\u9879",\n                        value: 2,\n                        disabled: true,\n                      },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n          ]}\n        />\n        <List\n          name="mult-list"\n          important\n          title="\u590d\u6742\u5217\u8868"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n            <TableList\n              block\n              isUnshift={false}\n              name="tableList"\n              title="\u8868\u683c\u5217\u8868"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n                <Input name="title" label="\u6807\u9898" rule="REQ" />,\n                <AdvancedSelect\n                  name="select"\n                  label="\u9009\u9879"\n                  rule="REQ"\n                  value={[1]}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7b2c\u4e00\u9879",\n                            value: 1,\n                          },\n                          {\n                            label: "\u7b2c\u4e8c\u9879",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n              ]}\n            />,\n          ]}\n        />\n\n        <List\n          name="mult-list-2"\n          important\n          title="\u590d\u6742\u5217\u88682"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n            <List\n              block\n              name="tableList"\n              title="\u5217\u8868"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n                <Input name="title" label="\u6807\u9898" rule="REQ" />,\n                <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n              ]}\n            />,\n          ]}\n        />\n        <FormInfo\n          list={[\n            <SubmitButton>\u63d0\u4ea4</SubmitButton>,\n            <FormApiButton\n              onClick={({ openApi }) => {\n                openApi.setFields(\n                  [\n                    {\n                      groupName: "tableList",\n                      name: "name",\n                      value: "",\n                    },\n                    {\n                      groupName: "tableList",\n                      name: "title",\n                      value: "ssssssss",\n                    },\n                  ],\n                  { runValidate: false }\n                );\n              }}\n            >\n              \u8bbe\u7f6e\u8868\u5355\u503c\n            </FormApiButton>,\n          ]}\n        />\n      </Space>\n    </Form>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Modal",packageName:"@components/Modal",component:l},{name:"antd",packageName:"antd",component:r}]},{title:"Modal Form\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2aform\u5f39\u7a97",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormModal,\n  useFormModal,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormModalButton,\n} = _FormInfo;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formModal = useFormModal();\n  return (\n    <Space wrap>\n      <FormModal\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        formProps={{\n          data: {\n            field1: "field1field1field1field1",\n          },\n          onSubmit: async (data) => {\n            console.log(data);\n            await new Promise((resolve) => {\n              setTimeout(() => {\n                resolve();\n              }, 1000);\n            });\n            setOpen(false);\n          },\n        }}\n      >\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n        <List\n          title="\u5217\u8868"\n          name="list"\n          maxLength={3}\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n      </FormModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: ({ data }) => {\n              return {\n                data: data,\n                onSubmit: async (data) => {\n                  console.log(data);\n                  await new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                  api.close();\n                },\n              };\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve({\n                        field1: "\u6211\u63a5\u53e3\u83b7\u53d6\u7684\u6570\u636e",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u52a0\u8f7dform\u6570\u636e\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: "\u53d6\u6d88" },\n              {\n                ButtonComponent: FormApiButton,\n                autoClose: false,\n                onClick: (context) => {\n                  console.log(context);\n                },\n                children: "FormApiButton",\n              },\n              {\n                ButtonComponent: SubmitButton,\n                autoClose: false,\n                children: "\u63d0\u4ea4",\n              },\n            ],\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        \u81ea\u5b9a\u4e49footerButtons\n      </Button>\n      <FormModalButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: "Lucy",\n                  desc: "\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684form\u5f39\u7a97",\n            formProps: {\n              data,\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                close();\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                column={1}\n                list={[\n                  <Input name="name" label="\u59d3\u540d" rule="REQ" />,\n                  <TextArea name="desc" label="\u4ecb\u7ecd" rule="REQ" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        \u52a0\u8f7dform\u6570\u636e\u6309\u94ae\n      </FormModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"fetch",packageName:"@kne/react-fetch",component:i}]},{title:"FormStepModal\u8868\u5355\u5f39\u7a97\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2aFormStepModal\u8868\u5355\u5f39\u7a97\u793a\u4f8b",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormModal,\n  FormStepModal,\n  useFormModal,\n  useFormStepModal,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormModalButton,\n} = _FormInfo;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formModal = useFormStepModal();\n  return (\n    <Space wrap>\n      <FormStepModal\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        autoClose\n        items={[\n          {\n            title: "\u57fa\u672c\u4fe1\u606f",\n            formProps: {\n              data: {\n                field1: "\u57fa\u672c\u4fe1\u606ffield1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                list={[\n                  <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                  <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                  <TextArea name="field3" label="\u5b57\u6bb53" />,\n                ]}\n              />\n            ),\n          },\n          {\n            title: "\u5217\u8868\u4fe1\u606f",\n            formProps: {\n              data: {\n                list: [{ field1: "\u5217\u8868\u4fe1\u606ffield1field1field1field1" }],\n              },\n              onSubmit: async (data, { stepCacheRef }) => {\n                console.log(stepCacheRef);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n              },\n            },\n            children: (\n              <List\n                title="\u5217\u8868"\n                name="list"\n                maxLength={3}\n                list={[\n                  <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                  <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                  <TextArea name="field3" label="\u5b57\u6bb53" />,\n                ]}\n              />\n            ),\n          },\n        ]}\n      ></FormStepModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r}]},{title:"Drawer Form \u62bd\u5c49\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2aform\u62bd\u5c49\u5f39\u7a97",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormDrawer,\n  useFormDrawer,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormDrawerButton,\n} = _FormInfo;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formDrawer = useFormDrawer();\n  return (\n    <Space wrap>\n      <FormDrawer\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        formProps={{\n          data: {\n            field1: "field1field1field1field1",\n          },\n          onSubmit: async (data) => {\n            console.log(data);\n            await new Promise((resolve) => {\n              setTimeout(() => {\n                resolve();\n              }, 1000);\n            });\n            setOpen(false);\n          },\n        }}\n      >\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n        <List\n          title="\u5217\u8868"\n          name="list"\n          maxLength={3}\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n      </FormDrawer>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: ({ data }) => {\n              return {\n                data: data,\n                onSubmit: async (data) => {\n                  console.log(data);\n                  await new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                  api.close();\n                },\n              };\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve({\n                        field1: "\u6211\u63a5\u53e3\u83b7\u53d6\u7684\u6570\u636e",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u52a0\u8f7dform\u6570\u636e\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: "\u53d6\u6d88" },\n              {\n                ButtonComponent: FormApiButton,\n                autoClose: false,\n                onClick: (context) => {\n                  console.log(context);\n                },\n                children: "FormApiButton",\n              },\n              {\n                ButtonComponent: SubmitButton,\n                autoClose: false,\n                children: "\u63d0\u4ea4",\n              },\n            ],\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        \u81ea\u5b9a\u4e49footerButtons\n      </Button>\n      <FormDrawerButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: "Lucy",\n                  desc: "\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684form\u5f39\u7a97",\n            formProps: {\n              data,\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                close();\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                column={1}\n                list={[\n                  <Input name="name" label="\u59d3\u540d" rule="REQ" />,\n                  <TextArea name="desc" label="\u4ecb\u7ecd" rule="REQ" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        \u52a0\u8f7dform\u6570\u636e\u6309\u94ae\n      </FormDrawerButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"fetch",packageName:"@kne/react-fetch",component:i}]},{title:"\u9009\u62e9\u63a7\u4ef6\u7684\u6570\u636e\u5c55\u793a\u6846",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u9009\u62e9\u63a7\u4ef6\u7684\u6570\u636e\u5c55\u793a\u6846\uff0c\u5b83\u662f\u5176\u4ed6\u9009\u62e9\u5668\u7684\u5b50\u7ec4\u4ef6\u4e00\u822c\u4e0d\u72ec\u7acb\u4f7f\u7528\uff0c\u5f00\u653e\u8be5\u7ec4\u4ef6\u662f\u4e3a\u4e86\u65b9\u9762\u81ea\u5b9a\u4e49\u65b0\u7684\u9009\u62e9\u63a7\u4ef6\uff0c\u4f46\u662f\u8bf7\u8c28\u614e\u4f7f\u7528",code:'const { SelectInnerInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button, List } = antd;\nconst { default: Content } = _Content;\nconst { useState } = React;\n\nconst ControlledSelectInnerInput = (props) => {\n  const [value, setValue] = useState([1, 2, 3]);\n\n  return <SelectInnerInput {...props} value={value} onChange={setValue} />;\n};\n\nconst useSelectInnerContext = SelectInnerInput.useContext;\n\nconst ResetMapping = () => {\n  const { mapping, appendMapping } = useSelectInnerContext();\n  return (\n    <span>\n      <Button\n        onClick={() => {\n          appendMapping([\n            { label: "\u4fee\u6539\u7684\u9879", value: 1 },\n            { label: "\u65b0\u589e\u7684\u9879", value: 4 },\n          ]);\n        }}\n      >\n        \u70b9\u51fb\u8bbe\u7f6emapping\u503c\n      </Button>\n      <List\n        dataSource={mapping.values()}\n        renderItem={(item) => <div>{item.label}</div>}\n      />\n    </span>\n  );\n};\n\nconst BaseExample = () => {\n  const children = "\u9009\u533a\u5185\u5bb9";\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u975e\u53d7\u63a7\u72b6\u6001",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u53d7\u63a7\u72b6\u6001",\n          content: (\n            <ControlledSelectInnerInput>{children}</ControlledSelectInnerInput>\n          ),\n        },\n        {\n          label: "mapping\u503c\u663e\u793a",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u5355\u9879\u503c\u663e\u793a",\n          content: (\n            <SelectInnerInput\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u591a\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3, 4, 5, 6, 7, 8, 9]}\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e94\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u516d\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e03\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 7,\n                    },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                    { label: "\u7b2c\u4e5d\u9879", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u5355\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              defaultValue={1}\n              single\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e94\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u516d\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e03\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 7,\n                    },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                    { label: "\u7b2c\u4e5d\u9879", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u591a\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              isPopup\n              defaultValue={[1, 2, 3, 4, 5, 6, 7, 8]}\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label: "\u7b2c\u4e94\u9879",\n                      value: 5,\n                    },\n                    {\n                      label: "\u7b2c\u516d\u9879",\n                      value: 6,\n                    },\n                    { label: "\u7b2c\u4e03\u9879", value: 7 },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u9009\u533a",\n          content: (\n            <SelectInnerInput\n              single\n              isPopup\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u66f4\u65b0mapping",\n          content: (\n            <SelectInnerInput\n              single\n              isPopup\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              <ResetMapping />\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u9690\u85cf\u5df2\u9009\u6807\u7b7e",\n          content: (\n            <SelectInnerInput\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u9690\u85cf\u5df2\u9009\u6807\u7b7e",\n          content: (\n            <SelectInnerInput\n              isPopup\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "extra",\n          content: (\n            <SelectInnerInput\n              extra={<Button>\u6dfb\u52a0</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u7684extra",\n          content: (\n            <SelectInnerInput\n              isPopup\n              extra={({ close }) => <Button onClick={close}>\u6dfb\u52a0</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "valueType\u4e3aall",\n          content: (\n            <SelectInnerInput\n              isPopup\n              valueType="all"\n              defaultValue={[\n                { label: "\u989d\u5916\u7684\u4e00\u9879", value: 100 },\n                { label: "\u989d\u5916\u7684\u4e8c\u9879", value: 200 },\n              ]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r}]},{title:"\u9ad8\u7ea7\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u4e86\u9ad8\u7ea7\u9009\u62e9\u7ec4\u4ef6\u7684List\u5f62\u6001",code:'const { AdvancedSelect: _AdvancedSelect, SelectInnerInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst AdvancedSelect = _AdvancedSelect.Field;\n\nconst useSelectInnerContext = SelectInnerInput.useContext;\n\nconst AddExtraButton = () => {\n  const { appendItems, fetchApi } = useSelectInnerContext();\n\n  return (\n    <Button\n      type="link"\n      onClick={() => {\n        const id = uniqueId("new_item_");\n        appendItems({\n          pageData: [\n            {\n              label: "\u6dfb\u52a0\u7684\u65b0\u9879\u76ee_" + id,\n              value: id,\n            },\n            ...fetchApi.data.pageData,\n          ],\n          totalCount: fetchApi.data.totalCount,\n        });\n      }}\n    >\n      \u6dfb\u52a0\n    </Button>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: range(0, 100).map((key) => {\n                      return {\n                        label: `\u7b2c${key + 1}\u9879`,\n                        value: key + 1,\n                        disabled: key === 2,\n                      };\n                    }),\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u63cf\u8ff0\u4fe1\u606f",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1, description: "\u63cf\u8ff0\u4fe1\u606f" },\n                      {\n                        label: "\u7b2c\u4e8c\u9879",\n                        value: 2,\n                        description: "\u63cf\u8ff0\u4fe1\u606f",\n                      },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                        description: "\u63cf\u8ff0\u4fe1\u606f",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5206\u9875\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={90}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n              extra={<AddExtraButton />}\n              api={{\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + 20)\n                          .map((key) => {\n                            return {\n                              label: `\u7b2c${key + 1}\u9879`,\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5206\u9875\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <AdvancedSelect\n              defaultValue={[90]}\n              isPopup={false}\n              extra={<AddExtraButton />}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u7b2c${key + 1}\u9879`,\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u7528\u6237\u9009\u62e9\u7ec4\u4ef6",description:"\u5728List\u7684\u4ea4\u4e92\u903b\u8f91\u57fa\u7840\u4e0a\u6269\u5c55\u51fa\u7684\u4e0d\u540c\u5217\u8868\u6837\u5f0f",code:'const { AdvancedSelect: _AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst UserSelect = _AdvancedSelect.User.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <UserSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: range(0, 30).map((key) => {\n                      return {\n                        label: `\u7528\u6237${key + 1}`,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                        value: key + 1,\n                      };\n                    }),\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <UserSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u8868\u683c\u9009\u62e9\u7ec4\u4ef6",description:"\u5728List\u7684\u4ea4\u4e92\u903b\u8f91\u57fa\u7840\u4e0a\u6269\u5c55\u51fa\u7684\u4e0d\u540c\u5217\u8868\u6837\u5f0f",code:'const { AdvancedSelect: _AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst TableSelect = _AdvancedSelect.Table.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <TableSelect\n              defaultValue={[1]}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u5458\u5de5${key + 1}`,\n                              company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                              department: "\u6280\u672f\u90e8",\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <TableSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u8d22\u52a1\u90e8",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u6280\u672f\u90e8",\n                        value: 2,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u5546\u52a1\u90e8",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <TableSelect\n              defaultValue={[1]}\n              isPopup={false}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u5458\u5de5${key + 1}`,\n                              company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                              department: "\u6280\u672f\u90e8",\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <TableSelect\n              single\n              isPopup={false}\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u8d22\u52a1\u90e8",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u6280\u672f\u90e8",\n                        value: 2,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u5546\u52a1\u90e8",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u5730\u5740\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u5730\u5740\u9009\u62e9\u7ec4\u4ef6",code:'const { AddressSelect: _AddressSelect, AddressInput: _AddressInput } =\n  _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst AddressSelect = _AddressSelect.Field;\nconst AddressEnum = _AddressSelect.AddressEnum;\nconst AddressInput = _AddressInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <AddressSelect\n              maxLength={3}\n              defaultValue={["110"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <AddressSelect\n              single\n              defaultValue={"110"}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u591a\u9009",\n          content: (\n            <AddressSelect\n              maxLength={3}\n              isPopup={false}\n              defaultValue={["110"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5355\u9009",\n          content: (\n            <AddressSelect\n              isPopup={false}\n              single\n              defaultValue={"110"}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "valueType\u4e3aall",\n          content: (\n            <AddressSelect\n              valueType="all"\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5730\u5740\u663e\u793a",\n          content: <AddressEnum name="270070" />,\n        },\n        {\n          label: "\u663e\u793a\u7236\u7ea7",\n          content: <AddressEnum name="270070" displayParent />,\n        },\n        {\n          label: "\u5730\u5740\u8f93\u5165",\n          content: (\n            <AddressInput\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u7ea7\u8054\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u7ea7\u8054\u9009\u62e9\u7ec4\u4ef6",code:'const { Cascader: _Cascader } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst Cascader = _Cascader.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u4e00\u6b21\u6027\u83b7\u53d6\u6570\u636e",\n          content: (\n            <Cascader\n              onlyAllowLastLevel\n              single\n              api={{\n                loader: async () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          id: "client",\n                          value: "client",\n                          type: "module",\n                          name: "\u5ba2\u6237",\n                          label: "\u5ba2\u6237",\n                          children: [\n                            {\n                              id: "client-list",\n                              value: "client-list",\n                              type: "feature",\n                              name: "\u5ba2\u6237\u5217\u8868\u9875",\n                              label: "\u5ba2\u6237\u5217\u8868\u9875",\n                            },\n                            {\n                              id: "client-detail",\n                              value: "client-detail",\n                              type: "module",\n                              name: "\u5ba2\u6237\u8be6\u60c5\u9875",\n                              label: "\u5ba2\u6237\u8be6\u60c5\u9875",\n                              children: [\n                                {\n                                  id: "contract",\n                                  value: "contract",\n                                  type: "module",\n                                  name: "\u5408\u540c\u4fe1\u606f",\n                                  label: "\u5408\u540c\u4fe1\u606f",\n                                },\n                              ],\n                            },\n                            {\n                              id: "client-form",\n                              value: "client-form",\n                              type: "feature",\n                              name: "\u5ba2\u6237\u8868\u5355",\n                              label: "\u5ba2\u6237\u8868\u5355",\n                              children: [\n                                {\n                                  id: "taxpayerIdNumber",\n                                  value: "taxpayerIdNumber",\n                                  type: "feature",\n                                  name: "\u7a0e\u53f7",\n                                  label: "\u7a0e\u53f7",\n                                },\n                              ],\n                            },\n                          ],\n                        },\n                        {\n                          id: "position",\n                          value: "position",\n                          type: "module",\n                          name: "\u804c\u4f4d",\n                          label: "\u804c\u4f4d",\n                          children: [\n                            {\n                              id: "position-list",\n                              value: "position-list",\n                              type: "feature",\n                              name: "\u804c\u4f4d\u5217\u8868\u9875",\n                              label: "\u804c\u4f4d\u5217\u8868\u9875",\n                            },\n                            {\n                              id: "position-detail",\n                              value: "position-detail",\n                              type: "module",\n                              name: "\u804c\u4f4d\u8be6\u60c5\u9875",\n                              label: "\u804c\u4f4d\u8be6\u60c5\u9875",\n                            },\n                            {\n                              id: "position-form",\n                              value: "position-form",\n                              type: "feature",\n                              name: "\u804c\u4f4d\u8868\u5355",\n                              label: "\u804c\u4f4d\u8868\u5355",\n                              children: [\n                                {\n                                  id: "industry",\n                                  value: "industry",\n                                  type: "feature",\n                                  name: "\u884c\u4e1a",\n                                  label: "\u884c\u4e1a",\n                                },\n                              ],\n                            },\n                          ],\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5206\u5c42\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <Cascader\n              openLoadData\n              onSearch={async (searchText) => {\n                return range(0, 20).map((key) => {\n                  const parentId = "2";\n                  return {\n                    id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                    label: `\u8282\u70b9-${searchText}-${\n                      parentId ? `${parentId}-` : ""\n                    }${key + 1}`,\n                    parentId,\n                  };\n                });\n              }}\n              api={{\n                loader: async ({ data }) => {\n                  const parentId = get(data, "id", "");\n                  const level = parentId.split("-").length;\n                  console.log("loadData", parentId, level);\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve(\n                        range(0, 20).map((key) => {\n                          return Object.assign(\n                            {\n                              id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                              label: `\u8282\u70b9-${parentId ? `${parentId}-` : ""}${\n                                key + 1\n                              }`,\n                              parentId,\n                            },\n                            level >= 3 ? { children: null } : {}\n                          );\n                        })\n                      );\n                    }, 1000);\n                  });\n                },\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5206\u5c42\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <Cascader\n              openLoadData\n              isPopup={false}\n              api={{\n                loader: async ({ data }) => {\n                  const parentId = get(data, "id", "");\n                  const level = parentId.split("-").length;\n                  console.log("loadData", parentId, level);\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve(\n                        range(0, 20).map((key) => {\n                          return Object.assign(\n                            {\n                              id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                              label: `\u8282\u70b9-${parentId ? `${parentId}-` : ""}${\n                                key + 1\n                              }`,\n                              parentId,\n                            },\n                            level >= 3 ? { children: null } : {}\n                          );\n                        })\n                      );\n                    }, 1000);\n                  });\n                },\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u804c\u80fd\u9009\u62e9",description:"\u5c55\u793a\u884c\u4e1a\u804c\u80fd\u9009\u62e9",code:'const { FunctionSelect: _FunctionSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst FunctionSelect = _FunctionSelect.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u804c\u80fd\u9009\u62e9",\n          content: (\n            <FunctionSelect\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u804c\u80fd\u9009\u62e9",\n          content: (\n            <FunctionSelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u9009\u62e9\u65e0\u641c\u7d22",\n          content: (\n            <FunctionSelect\n              search={null}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u679a\u4e3e\u663e\u793a",\n          content: <FunctionSelect.Enum name="001" />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u884c\u4e1a\u9009\u62e9",description:"\u5c55\u793a\u884c\u4e1a\u9009\u62e9\u7ec4\u4ef6",code:'const { IndustrySelect: _IndustrySelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst IndustrySelect = _IndustrySelect.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u884c\u4e1a\u9009\u62e9",\n          content: (\n            <IndustrySelect\n              defaultValue={["001"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u884c\u4e1a\u9009\u62e9",\n          content: (\n            <IndustrySelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u679a\u4e3e\u663e\u793a",\n          content: <IndustrySelect.Enum name="004" />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u91d1\u989d\u8f93\u5165",description:"\u5c55\u793a\u91d1\u989d\u8f93\u5165\u7ec4\u4ef6",code:'const { MoneyInput: _MoneyInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst MoneyInput = _MoneyInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u91d1\u989d\u8f93\u5165",\n          content: <MoneyInput />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u7535\u8bdd\u53f7\u7801\u8f93\u5165",description:"\u5c55\u793a\u7535\u8bdd\u53f7\u7801\u8f93\u5165\u7ec4\u4ef6",code:'const { PhoneNumber: _PhoneNumber } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst PhoneNumber = _PhoneNumber.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u7535\u8bdd\u8f93\u5165",\n          content: (\n            <PhoneNumber\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u85aa\u8d44\u7ec4\u4ef6",description:"\u5c55\u793a\u586b\u5199\u85aa\u8d44\u8303\u56f4\u8f93\u5165\u7ec4\u4ef6",code:'const { SalaryInput, Form } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst SalaryInputField = SalaryInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <Content\n        col={1}\n        list={[\n          {\n            label: "\u85aa\u8d44\u8303\u56f4",\n            content: (\n              <SalaryInputField\n                onChange={(value) => {\n                  console.log(value);\n                }}\n              />\n            ),\n          },\n        ]}\n      />\n      <Form\n        rules={{\n          SALARYRANGE: ({ min, max, type }) => {\n            if (type !== 1) {\n              if (!min || !max) {\n                return {\n                  result: false,\n                  errMsg: `${!min ? "\u6700\u4f4e\u85aa\u8d44" : "\u6700\u9ad8\u85aa\u8d44"}\u4e0d\u80fd\u4e3a\u7a7a`,\n                };\n              }\n              if (min > max) {\n                return {\n                  result: false,\n                  errMsg: "\u6700\u9ad8\u85aa\u8d44\u5e94\u5927\u4e8e\u6700\u4f4e\u85aa\u8d44",\n                };\n              }\n            }\n            return {\n              result: true,\n              errMsg: "",\n            };\n          },\n        }}\n        data={{ salaryRange: { type: 5, month: 12 } }}\n      >\n        <SalaryInput\n          name="salaryRange"\n          label="\u85aa\u8d44\u8303\u56f4"\n          rule="REQ SALARYRANGE"\n          showMonth\n          remindUnit\n        />\n      </Form>\n    </div>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u53ef\u6269\u5c55\u7684AdvanceSelect",description:"AdvanceSelect\u652f\u6301\u5de6\u53f3\u5e03\u5c40",code:'const { AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Icon } = icon;\nconst { useState } = React;\nconst { range, merge, get } = _lodash;\nconst dayjs = _dayjs;\nconst { Col } = _antd;\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax: () => {\n          return Promise.resolve({ data: { code: 0, data: [] } });\n        },\n      }}\n    >\n      <AdvancedSelect.Field\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n        api={{\n          loader: ({ data }) => {\n            const params = Object.assign(\n              {\n                perPage: 20,\n                currentPage: 1,\n              },\n              data\n            );\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                const start = (params.currentPage - 1) * params.perPage;\n                resolve({\n                  totalCount: 100,\n                  pageData: range(start, start + 20)\n                    .map((key) => {\n                      return {\n                        label: `\u7b2c${key + 1}\u9879`,\n                        value: key + 1,\n                      };\n                    })\n                    .filter(({ label }) => {\n                      return params.keyword\n                        ? label.indexOf(params.keyword) > -1\n                        : true;\n                    }),\n                });\n              }, 1000);\n            });\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n        single\n        isPopup={false}\n        label={"\u9762\u8bd5\u5b98"}\n        placeholder={"\u9009\u62e9\u9762\u8bd5\u5b98"}\n        modalSize={"large"}\n        wrapClassName={"calendar-modal"}\n        selectIcon={\n          <div>\n            <Icon type={"icon-gouxuan"} />\n          </div>\n        }\n        leftSpan={6}\n        right={() => (\n          <Col flex={1}>\n            <div>\u6211\u662fheader</div>\n            <div>\u6211\u662fbody</div>\n          </Col>\n        )}\n        leftBottom={() => <div>\u6211\u662fleftBottom</div>}\n      />\n    </PureGlobal>\n  );\n};\nrender(<BaseExample />);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"icon",packageName:"@components/Icon",component:c},{name:"_antd",packageName:"antd",component:r},{name:"global",packageName:"@components/Global",component:o},{name:"_lodash",packageName:"lodash",component:d},{name:"_dayjs",packageName:"dayjs",component:m}]}]}}},70467:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(10935),o=t(63743),l=t(87558),d=t(21079),r=t(55199);const i={name:"Table",summary:"<p>\u53ef\u4ee5\u4ece\u540e\u7aef\u83b7\u53d6\u6570\u636e\uff0c\u7136\u540e\u5c55\u793a\u4e3a\u4e00\u4e2a\u8868\u683c</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Table_51c45",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Table } = _Table;\nconst { PureGlobal } = _Global;\nconst { preset } = reactFetch;\n\nconst ajax = (config) => {\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      if (config.url === "/api/v1/user/user/user_key_get") {\n        resolve({\n          data: {\n            code: 0,\n            data: `{"date":{"visible":false},"serialNumber":{"width":400}}`,\n          },\n        });\n      } else if (config.url === "/api/v1/user/user/user_key_set") {\n        console.log(config.data);\n        resolve({\n          data: {\n            code: 0,\n            data: "",\n          },\n        });\n      }\n    }, 100);\n  });\n};\n\npreset({\n  ajax,\n});\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax /*tableServerApis: {\n                  getDataApi: (name) => {\n                    return {\n                      url: "/api/v1/user/user/user_key_get",\n                      method: "GET",\n                      params: {\n                        key: `table_config_v2_${name}`,\n                      },\n                      transformResponse: (response) => {\n                        const { data } = response;\n                        response.data = Object.assign({}, data, {\n                          data: (() => {\n                            try {\n                              return JSON.parse(data.data);\n                            } catch (e) {\n                              return [];\n                            }\n                          })(),\n                        });\n\n                        response.data = {\n                          code: response.data.code === 0 ? 200 : data.code,\n                          msg: response.data.msg,\n                          results: response.data.data,\n                        };\n\n                        return response;\n                      },\n                      cache: "TABLE_PAGE_CONFIG",\n                    };\n                  },\n                  setDataFunc: (name, data) => {\n                    return ajax({\n                      url: "/api/v1/user/user/user_key_set",\n                      data: {\n                        map: {\n                          [`table_config_v2_${name}`]: JSON.stringify(data),\n                        },\n                      },\n                    });\n                  },\n                },*/,\n      }}\n    >\n      <Table\n        name="test-table"\n        onTablePropsReady={({ columns, dataSource }) => {\n          console.log({ columns, dataSource });\n        }}\n        dataSource={[\n          {\n            id: 0,\n            date: "2021-07-21",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: null,\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 4,\n            description:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n          {\n            id: 1,\n            date: "",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca1",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: null,\n            email: "a@a.com",\n            count: 5,\n            description: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n        ]}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            type: "datetime",\n            hideSecond: true,\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            type: "serialNumber",\n            primary: true,\n            onClick: async (item) => {\n              console.log(item);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(true);\n                }, 10000);\n              });\n            },\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "tagEnum",\n            title: "\u6807\u7b7e\u679a\u4e3e",\n            type: "tag",\n            valueOf: (item) =>\n              item.tagEnum && {\n                type: "success",\n                isEnum: true,\n                moduleName: "marital",\n                name: item.tagEnum,\n              },\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "hideInfo",\n            title: "\u9690\u85cf\u5b57\u6bb5",\n            type: "hideInfo",\n            valueOf: (item) =>\n              item["phoneNumber"] && {\n                loader: () => {\n                  return item["phoneNumber"] + "-" + item["id"];\n                },\n              },\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            type: "description",\n          },\n          {\n            name: "description2",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u5206\u914d",\n                message: "\u786e\u5b9a\u8981\u5206\u914d\u5417",\n                isDelete: false,\n              },\n              {\n                children: "\u5ba1\u6838",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n                confirm: true,\n                onClick: () => {\n                  console.log("\u5220\u9664");\n                },\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"_Global",packageName:"@components/Global",component:o},{name:"reactFetch",packageName:"@kne/react-fetch",component:l}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { PureGlobal } = _Global;\nconst { TablePage } = _Table;\nconst { range } = lodash;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "test",\n                type: "feature",\n                name: "\u6d4b\u8bd5\u529f\u80fd",\n                options: {\n                  hiddenColumns: ["date", "datetime"],\n                },\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <TablePage\n        featureId="test"\n        name="test-2"\n        sticky={false}\n        rowSelection={{\n          type: "checkbox",\n        }}\n        loader={() => {\n          return {\n            addUserName: "\u6211\u662f\u5927\u9b54\u738b",\n            pageData: range(0, 50).map((index) => ({\n              id: index,\n              date: "2021-07-21",\n              datetime: "2023-07-22 09:00:00",\n              serialNumber: "SX00192932323434",\n              serialNumberShort: "SH0023",\n              userName: "\u6797\u73ca\u73ca" + index,\n              title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n              enUserName: "Lin Shanshan",\n              phoneNumber: "+86 18792877372",\n              email: "a@a.com",\n              count: 5,\n              description:\n                "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n              other: "\u5176\u4ed6\u4fe1\u606f",\n            })),\n            totalCount: 50,\n          };\n        }}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            type: "datetime",\n          },\n          {\n            name: "dateRange",\n            title: "\u65e5\u671f\u8303\u56f4",\n            type: "dateRange",\n            valueOf: ({ date, datetime }) => [date, datetime],\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            type: "serialNumber",\n            primary: true,\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n          },\n          {\n            name: "phone",\n            title: "\u624b\u673a\u53f7",\n            type: "hideInfo",\n            primary: true,\n            valueOf: (item) => ({\n              loader: () => {\n                return item["phoneNumber"] + "-" + item["id"];\n              },\n            }),\n          },\n          {\n            name: "email",\n            title: "\u90ae\u7bb1",\n            type: "hideInfo",\n            valueOf: (item) => ({\n              loader: () => {\n                return item["email"] + "-" + item["id"];\n              },\n              children: (data) => {\n                return `${data},${item["userName"]}`;\n              },\n            }),\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n          },\n          {\n            name: "addUser",\n            title: "\u6dfb\u52a0\u4eba",\n            type: "user",\n            render: ({ data }) => ({ valueOf: () => data.addUserName }),\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            fixed: "right",\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u7f16\u8f91",\n                disabled: true,\n                tooltipProps: {\n                  title: "\u4e0d\u80fd\u7f16\u8f91\u8fd9\u6761\u4fe1\u606f",\n                },\n              },\n              {\n                children: "\u5ba1\u6838",\n                tooltipProps: {\n                  title: (\n                    <div\n                      style={{ padding: "10px", backgroundColor: "skyblue" }}\n                    >\n                      \u5ba1\u6838\u64cd\u4f5c\u7684tooltip\n                    </div>\n                  ),\n                },\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"lodash",packageName:"lodash",component:d},{name:"_Global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Table } = _Table;\nconst { PureGlobal } = _Global;\nconst { preset } = reactFetch;\nconst { useState } = React;\nconst { Input } = antd;\nconst ajax = (config) => {\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      if (config.url === "/api/v1/user/user/user_key_get") {\n        resolve({\n          data: {\n            code: 0,\n            data: `{"date":{},"serialNumber":{"width":400}}`,\n          },\n        });\n      } else if (config.url === "/api/v1/user/user/user_key_set") {\n        console.log(config.data);\n        resolve({\n          data: {\n            code: 0,\n            data: "",\n          },\n        });\n      }\n    }, 100);\n  });\n};\n\npreset({\n  ajax,\n});\n\nconst ValueEdit = ({ value, targetRender }) => {\n  const [isEdit, setIsEdit] = useState(false);\n  return (\n    <span\n      onClick={() => {\n        setIsEdit(true);\n      }}\n    >\n      {isEdit ? (\n        <Input\n          type="text"\n          size="small"\n          defaultValue={value}\n          onBlur={() => {\n            setIsEdit(false);\n          }}\n        />\n      ) : (\n        targetRender(value)\n      )}\n    </span>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax,\n        tableServerApis: {\n          getDataApi: (name) => {\n            return {\n              url: "/api/v1/user/user/user_key_get",\n              method: "GET",\n              params: {\n                key: `table_config_v2_${name}`,\n              },\n              transformResponse: (response) => {\n                const { data } = response;\n                response.data = Object.assign({}, data, {\n                  data: (() => {\n                    try {\n                      return JSON.parse(data.data);\n                    } catch (e) {\n                      return [];\n                    }\n                  })(),\n                });\n\n                response.data = {\n                  code: response.data.code === 0 ? 200 : data.code,\n                  msg: response.data.msg,\n                  results: response.data.data,\n                };\n\n                return response;\n              },\n              cache: "TABLE_PAGE_CONFIG",\n            };\n          },\n          setDataFunc: (name, data) => {\n            return ajax({\n              url: "/api/v1/user/user/user_key_set",\n              data: {\n                map: {\n                  [`table_config_v2_${name}`]: JSON.stringify(data),\n                },\n              },\n            });\n          },\n        },\n      }}\n    >\n      <Table\n        name="test-table"\n        dataSource={[\n          {\n            id: 0,\n            date: "2021-07-21",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 4,\n            description:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n          {\n            id: 1,\n            date: "",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca1",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 5,\n            description: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n        ]}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-1",\n                title: "\u5206\u7ec41-1",\n              },\n            ],\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-2",\n                title: "\u5206\u7ec41-2",\n              },\n            ],\n            type: "datetime",\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-1",\n                title: "\u5206\u7ec41-1",\n              },\n            ],\n            type: "serialNumber",\n            primary: true,\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n            disableColItem: true,\n            valueOf: (item, { targetRender }) => (\n              <ValueEdit value={item["title"]} targetRender={targetRender} />\n            ),\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "tagEnum",\n            title: "\u6807\u7b7e\u679a\u4e3e",\n            type: "tag",\n            valueOf: (item) => ({\n              type: "success",\n              isEnum: true,\n              moduleName: "marital",\n              name: item.tagEnum,\n            }),\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "hideInfo",\n            title: "\u9690\u85cf\u5b57\u6bb5",\n            type: "hideInfo",\n            valueOf: (item) => ({\n              loader: () => {\n                return item["phoneNumber"] + "-" + item["id"];\n              },\n            }),\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            type: "description",\n          },\n          {\n            name: "description2",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n            sort: true,\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            fixed: "right",\n            sort: true,\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u5206\u914dProgram\u53ca\u6559\u7ec3",\n              },\n              {\n                children: "\u5ba1\u6838",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n              },\n            ],\n          },\n        ]}\n        onSortChange={(sort) => {\n          console.log(">>>>>>", sort);\n        }}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"_Global",packageName:"@components/Global",component:o},{name:"reactFetch",packageName:"@kne/react-fetch",component:l},{name:"antd",packageName:"antd",component:r}]}]}}},71384:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(41381),o=t(55199);const l={name:"InfoPage",summary:"<h3><em><code>InfoPage</code></em> \u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u4e00\u822c\u7528\u5728\u590d\u6742\u7684\u8be6\u60c5\u5c55\u793a\u9875\u9762\uff0c<code>InfoPage</code> \u63d0\u4f9b\u4e86\u4e00\u4e2a\u6807\u51c6\u7684\u5c55\u793a\u4fe1\u606f\u7684\u683c\u5f0f</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u652f\u6301 <code>Content</code> \u7ec4\u4ef6 <code>Descriptions</code> \u7ec4\u4ef6\u7684\u7ec4\u5408</li>\n<li>\u652f\u6301 <code>Collapse</code> \u7ec4\u4ef6\u7ec4\u5408</li>\n<li><code>InfoPage.Part</code>\u3001<code>InfoPage.Collapse</code> \u9700\u8981\u653e\u5728 <code>InfoPage</code> \u4e4b\u4e0b\uff0c<code>Content</code>\u3001<code>Descriptions</code> \u53ef\u4ee5\u4efb\u610f\u7ec4\u5408</li>\n</ul>\n<h3><em><code>Content</code></em> \u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6210\u7ec4\u5c55\u793a\u591a\u4e2a\u5b57\u6bb5\uff0c\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<p>labelAlign \u4e0d\u4e3a auto \u65f6\u4f1a\u81ea\u52a8\u8ba1\u7b97 label \u7684\u6700\u5c0f\u5bbd\u5ea6\u4f7f\u6240\u6709 label \u7684\u5bbd\u5ea6\u7b49\u4e8e\u6700\u957f\u7684 label \u5bbd\u5ea6\uff0c\u4f7f\u89c6\u89c9\u4e0a\u66f4\u52a0\u6574\u9f50\u6709\u79e9\u5e8f\u611f</p>",api:'<h3>InfoPage</h3>\n<p>\u540c <a href="https://ant.design/components/Card#api"><code>Ant Design Card</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>InfoPage</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Part</h4>\n<p>\u540c <a href="https://ant.design/components/Card#api"><code>Ant Design Card</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Part</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Collapse</h4>\n<p>\u540c <a href="https://ant.design/components/Collapse#collapse"><code>Ant Design Collapse</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>className</td>\n<td><code>Part</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Content</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td><code>Content</code> \u7684\u5185\u5bb9\u5217\u8868</td>\n<td><code>listItemProps[]</code></td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td><code>label</code> \u7684\u5bf9\u9f50\u65b9\u5f0f\u53ef\u4ee5\u4f20\u5165\u7684\u503c <code>left,right,center,auto</code>,\u4e3a <code>auto</code> \u65f6 <code>label</code> \u4e0d\u8ba1\u7b97\u6700\u5c0f\u5bbd\u5ea6</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>\u5217\u6570</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u9ed8\u8ba4\u4e3a <code>14px</code>\uff0c\u53ef\u4ee5\u4f20\u503c\u4e3a <code>small</code>\uff0c<code>size</code> \u4e3a <code>small</code> \u65f6\u5b57\u53f7\u4e3a <code>12px</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\u6216\u652f\u6301\u54cd\u5e94\u5f0f\u7684\u5bf9\u8c61\u5199\u6cd5\u6765\u8bbe\u7f6e\u6c34\u5e73\u95f4\u9694 <code>{ xs: 8, sm: 16, md: 24}</code>\u3002\u6216\u8005\u4f7f\u7528\u6570\u7ec4\u5f62\u5f0f\u540c\u65f6\u8bbe\u7f6e [\u6c34\u5e73\u95f4\u8ddd, \u5782\u76f4\u95f4\u8ddd]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Content</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>\u63a5\u6536 <code>Content Inner</code> \u548c <code>Inner</code> \u7684 <code>label, content, index</code>\uff0c\u53ef\u4ee5\u6839\u636e\u6570\u636e\u4fe1\u606f\u8fd4\u56de\u60f3\u8981\u6e32\u67d3\u7684\u5185\u5bb9</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>listItemProps</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a\uff0c\u5f53\u4e3a <code>function</code> \u65f6\u53ef\u4ee5\u63a5\u6536\u5230 <code>item, list</code> \u53c2\u6570\uff0c<code>item</code> \u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0c<code>dataSource</code> \u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684 <code>dataSource</code> \u914d\u7f6e</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>block</td>\n<td>\u662f\u5426\u5355\u884c\u663e\u793a\u8be5\u6761\u4fe1\u606f</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>label</td>\n<td>\u6807\u9898</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u5185\u5bb9</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Descriptions</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u8be6\u60c5\u6570\u636e\u6e90\uff0c\u5185\u90e8\u6bcf\u4e2a\u6570\u7ec4\u4e3a\u4e00\u884c\u6570\u636e\uff0c\u6bcf\u884c\u6570\u636e\u4e2d\u6bcf\u4e2a\u5bf9\u8c61\u4e3a\u4e00\u5217\u6570\u636e\uff0c\u6bcf\u884c\u6700\u591a\u5305\u542b <code>2</code> \u5217\u5185\u5bb9\uff0c\u591a\u4f59\u7684\u4f1a\u88ab\u4e22\u5f03</td>\n<td><code>dataSourceItemProps[]</code></td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>\u63a5\u6536 <code>Descriptions Inner</code> \u548c <code>Inner</code> \u7684 <code>label, content, displaty, index</code>\uff0c\u53ef\u4ee5\u6839\u636e\u6570\u636e\u4fe1\u606f\u8fd4\u56de\u60f3\u8981\u6e32\u67d3\u7684\u5185\u5bb9</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>dataSourceItemProps</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a\uff0c\u5f53\u4e3a <code>function</code> \u65f6\u53ef\u4ee5\u63a5\u6536\u5230 <code>item, dataSource</code> \u53c2\u6570\uff0c<code>item</code> \u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0c<code>dataSource</code> \u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684 <code>dataSource</code> \u914d\u7f6e</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>label</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u6807\u9898</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u5185\u5bb9</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>',example:{isFull:!1,className:"InfoPage_fb7ea",style:"",list:[{title:"InfoPage",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: InfoPage } = _InfoPage;\nconst { Button } = antd;\n\nconst BaseExample = () => {\n  return (\n    <InfoPage>\n      InfoPage\n      <InfoPage.Part\n        title="Part Title"\n        subtitle="\u6211\u662f\u4e00\u4e2asubtitle"\n        extra={<Button>\u64cd\u4f5c</Button>}\n      >\n        InfoPage.Part\n        <InfoPage.Part\n          title="Part Title"\n          subtitle="\u6211\u662f\u4e00\u4e2asubtitle"\n          extra={<Button>\u64cd\u4f5c</Button>}\n        >\n          InfoPage.InfoPage.Part\n        </InfoPage.Part>\n      </InfoPage.Part>\n      <InfoPage.Collapse\n        items={[\n          {\n            key: "1",\n            label: "This is default size panel header",\n            children: <p>InfoPage.Collapse</p>,\n          },\n          {\n            key: "2",\n            label: "This is default size panel header2",\n            children: <p>InfoPage.Collapse2</p>,\n          },\n        ]}\n      />\n    </InfoPage>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Content",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u57fa\u672c\u5185\u5bb9",code:'const { Content } = _InfoPage;\nconst { Space, Radio } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [listProps, setListProps] = useState({\n    col: 1,\n    size: "default",\n    labelAlign: "left",\n  });\n  const onChange = (e, name) => {\n    const val = e?.target.value;\n    setListProps((prevState) => Object.assign({}, prevState, { [name]: val }));\n  };\n\n  return (\n    <Space direction="vertical" size={12}>\n      <Radio.Group onChange={(e) => onChange(e, "col")} value={listProps.col}>\n        <Radio.Button value={1}>1\u5217</Radio.Button>\n        <Radio.Button value={2}>2\u5217</Radio.Button>\n        <Radio.Button value={3}>3\u5217</Radio.Button>\n      </Radio.Group>\n      <Radio.Group\n        onChange={(e) => onChange(e, "labelAlign")}\n        value={listProps.labelAlign}\n      >\n        <Radio.Button value="left">\u5de6\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="center">\u4e2d\u5fc3\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="right">\u53f3\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="auto">\u81ea\u9002\u5e94</Radio.Button>\n      </Radio.Group>\n      <Radio.Group onChange={(e) => onChange(e, "size")} value={listProps.size}>\n        <Radio.Button value="default">\u9ed8\u8ba4</Radio.Button>\n        <Radio.Button value="small">small</Radio.Button>\n      </Radio.Group>\n      <Content\n        {...listProps}\n        list={[\n          { label: "\u6807\u9898", content: "\u5185\u5bb9" },\n          { label: "\u6807\u9898\u6807\u9898", content: "\u5185\u5bb9\u5185\u5bb9" },\n          {\n            label: "\u6807\u9898\u6807",\n            content: "\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9",\n          },\n          {\n            label: "\u6807\u9898\u6807\u9898\u6807\u9898",\n            content:\n              "\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9",\n          },\n        ]}\n        itemRender={(inner, other) => {\n          return other?.index === 2 ? "\u6b64\u5904\u5185\u5bb9\u989d\u5916\u81ea\u5b9a\u4e49" : inner;\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Descriptions",description:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",code:'const { Descriptions } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: "\u5ba2\u6237\u540d\u79f0", content: "\u817e\u8baf" },\n          {\n            label: "\u53d1\u7968\u62ac\u5934",\n            content: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n          },\n        ],\n        [\n          { label: "\u53d1\u7968\u7c7b\u578b", content: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968" },\n          {\n            label: "\u53d1\u7968\u5f00\u5177\u65e5\u671f",\n            content: "2022-08-15",\n          },\n        ],\n        [{ label: "\u9000\u7968\u91d1\u989d", content: "22000.00\u5143" }],\n        [\n          {\n            label: "\u53d1\u7968\u53f7",\n            content: (\n              <div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n              </div>\n            ),\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9700\u8981\u91cd\u5f00\u53d1\u7968", content: "\u5426" },\n          {\n            label: "\u662f\u5426\u6d89\u53ca\u91d1\u878d\u53d8\u52a8",\n            content: "\u5426",\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9020\u6210\u5b9e\u8d28\u635f\u5931", content: "\u5426" },\n          { label: "\u8d23\u4efb\u5f52\u5c5e", content: "\u5ba2\u6237\u539f\u56e0" },\n        ],\n        [\n          {\n            label: "\u9000\u7968\u539f\u56e0",\n            content: "\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf",\n          },\n        ],\n        [{ label: "\u9644\u4ef6", content: "\u9644\u4ef6\u540d\u79f0" }],\n        [\n          { label: "\u64cd\u4f5c\u65f6\u95f4", content: "2022-08-01 16:32" },\n          { label: "\u64cd\u4f5c\u4eba", content: "\u897f\u897f\u6b6a", display: false },\n        ],\n        [\n          {\n            label: "\u8d85\u957f\u5185\u5bb9",\n            content:\n              "\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9",\n          },\n          {\n            label: "\u8d85\u957f\u82f1\u6587",\n            content:\n              "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"CentralContent",description:"\u8bf7\u5c3d\u91cf\u4f7f\u7528\u8be5\u7ec4\u4ef6\u4ee3\u66ffDescriptions\u7ec4\u4ef6\u3002\u8be5\u7ec4\u4ef6\u6bd4Descriptions\u7ec4\u4ef6\u6dfb\u52a0\u4e86\u6570\u636e\u683c\u5f0f\u5316\u548c\u7075\u6d3b\u7684\u7a7a\u5224\u65ad\u548c\u81ea\u5b9a\u4e49\u7a7a\u5c55\u793a\uff0c\u5e76\u4e14\u4f18\u5316\u4e86\u6392\u5217\uff0c\u53ef\u4ee5\u5b9e\u73b0\u4efb\u4f55\u6805\u683c\u5927\u5c0f\u7684\u6570\u636e\u9879\u590d\u6742\u7ec4\u5408\u3002\u5b9e\u73b0\u4e86\u5c3e\u884c\u4f18\u5316\uff0c\u4f7f\u4f60\u4e0d\u5fc5\u62c5\u5fc3\u672b\u5c3e\u9879\u7684\u5bbd\u5ea6\u95ee\u9898\uff0c\u7a0b\u5e8f\u4f1a\u81ea\u52a8\u8ba1\u7b97\u5e76\u5360\u6ee1\u8be5\u884c\u3002",code:'const { CentralContent } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <CentralContent\n      dataSource={{\n        id: "RC00101",\n        name: "\u5f20\u4e09",\n        birthday: "2020-03-03",\n        addTime: new Date(),\n        count: 2000.1322,\n        count2: 0.01234565,\n        count3: 1234523,\n        description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\n\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\n\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n        description2: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n      }}\n      col={3}\n      columns={[\n        {\n          name: "id",\n          title: "ID",\n          block: true,\n        },\n        {\n          name: "name",\n          title: "\u59d3\u540d",\n          span: 10,\n        },\n        {\n          name: "birthday",\n          title: "\u51fa\u751f\u65e5\u671f",\n          format: "date",\n        },\n        {\n          name: "addTime",\n          title: "\u6dfb\u52a0\u65f6\u95f4",\n          format: "datetime",\n        },\n        {\n          name: "count",\n          title: "\u6570\u91cf",\n          format: "number",\n        },\n        {\n          name: "count2",\n          title: "\u767e\u5206\u6bd4",\n          format: "number-percent money-\u767e\u5206\u6bd4",\n        },\n        {\n          name: "count3",\n          title: "\u4e07\u5143",\n          format: "number--10000",\n          render: (value) => `${value}\u4e07\u5143`,\n        },\n        {\n          name: "empty",\n          title: "\u7a7a\u503c\u663e\u793a",\n        },\n        {\n          name: "empty2",\n          title: "\u7a7a\u503c\u663e\u793a2",\n          placeholder: "\u7a7a",\n        },\n        {\n          name: "empty3",\n          title: "\u7a7a\u503c\u663e\u793a3",\n          emptyIsPlaceholder: false,\n        },\n        {\n          name: "description",\n          title: "\u63cf\u8ff0",\n        },\n        {\n          name: "description2",\n          title: "\u63cf\u8ff0",\n        },\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"TableView",description:"",code:'const { TableView } = _InfoPage;\nconst { Flex } = antd;\nconst { useState } = React;\n\nconst dataSource = [\n  {\n    id: "RC00101",\n    name: "\u5f20\u4e09",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00102",\n    name: "\u674e\u56db",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00103",\n    name: "\u738b\u4e94",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00104",\n    name: "\u9a6c\u4e03",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n];\n\nconst columns = [\n  {\n    name: "id",\n    title: "ID",\n  },\n  {\n    name: "name",\n    title: "\u59d3\u540d",\n  },\n  {\n    name: "birthday",\n    title: "\u51fa\u751f\u65e5\u671f",\n    format: "date",\n  },\n  {\n    name: "addTime",\n    title: "\u6dfb\u52a0\u65f6\u95f4",\n    format: "datetime",\n  },\n  {\n    name: "count",\n    title: "\u6570\u91cf",\n    format: "number",\n  },\n  {\n    name: "description",\n    title: "\u63cf\u8ff0",\n    span: 10,\n  },\n];\n\nconst WithCheckbox = () => {\n  const [selectKeys, setSelectKeys] = useState([]);\n  return (\n    <TableView\n      dataSource={dataSource}\n      columns={columns}\n      rowSelection={{\n        type: "checkbox",\n        allowSelectedAll: true,\n        selectedRowKeys: selectKeys,\n        onChange: setSelectKeys,\n      }}\n    />\n  );\n};\n\nconst WithSelected = () => {\n  const [selectKeys, setSelectKeys] = useState([]);\n  return (\n    <TableView\n      dataSource={dataSource}\n      columns={columns}\n      rowSelection={{\n        selectedRowKeys: selectKeys,\n        onChange: setSelectKeys,\n      }}\n    />\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Flex vertical gap={10}>\n      <TableView dataSource={dataSource} columns={columns} />\n      <WithCheckbox />\n      <WithSelected />\n      <TableView dataSource={[]} columns={columns} />\n      <div\n        style={{\n          height: "200px",\n          overflowY: "scroll",\n        }}\n      >\n        <TableView dataSource={dataSource} columns={columns} sticky />\n      </div>\n    </Flex>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Flow",description:"",code:'const { Space, Flex, Divider } = antd;\nconst { Flow } = _InfoPage;\nconst BaseExample = () => {\n  return (\n    <Flex vertical gap={8}>\n      <Flow\n        current={2}\n        dataSource={[\n          {\n            title: "title1",\n            description: "This is a description.",\n            createTime: "2022-08-15 10:29",\n            descriptionContent: [\n              {\n                name: "\u738b\u5efa\u56fd1",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "2023-08-15 10:30",\n                content: "test",\n              },\n              {\n                name: "\u738b\u5efa\u56fd2",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "2023-08-15 10:31",\n                content: "test",\n              },\n            ],\n          },\n          {\n            title: "\u81ea\u5b9a\u4e49DescriptionContentItem\u6e32\u67d3\u6837\u5f0f",\n            description: "This is a description.",\n            descriptionContent: [\n              {\n                name: "\u738b\u5efa\u56fd3",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "08-15 10:30",\n                content: "test",\n              },\n              {\n                name: "\u738b\u5efa\u56fd4",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "08-15 10:31",\n                content: "test",\n              },\n            ],\n          },\n          { title: "title3", description: "This is a description." },\n          {\n            title: "title4",\n            description: "This is a description.",\n          },\n        ]}\n        columns={[\n          {\n            name: "title",\n          },\n          {\n            name: "description",\n          },\n          {\n            type: "subTitle",\n            name: "createTime",\n            format: "datetime",\n          },\n          {\n            name: "status",\n          },\n          {\n            type: "actionList",\n            name: "descriptionContent",\n            children: [\n              {\n                name: "name",\n              },\n              {\n                name: "action",\n              },\n              {\n                type: "options",\n                name: "time",\n                format: "datetime",\n              },\n              {\n                name: "content",\n                render: (item, { target }) => {\n                  return `@@@@@${target.name}-${target.action}-${target.content}`;\n                },\n              },\n            ],\n          },\n        ]}\n      />\n      <Flow\n        direction="horizontal"\n        progressDot\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n      />\n\n      <Flow\n        direction="vertical"\n        progressDot\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n      />\n      <Flow\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            subTitle: "2023-08-15 10:29",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n        columns={[{ name: "subTitle", format: "datetime" }]}\n      />\n    </Flex>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},73650:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(48731),o=t(55199),l=t(63743);const d={name:"Enum",summary:"<p>\u679a\u4e3e\u503c\u7ba1\u7406\u548c\u5c55\u793a\u7ec4\u4ef6\uff0c\u7528\u4e8e\u7edf\u4e00\u7ba1\u7406\u5e94\u7528\u4e2d\u7684\u679a\u4e3e\u6570\u636e\uff0c\u5982\u6027\u522b\u3001\u72b6\u6001\u3001\u7c7b\u578b\u7b49\u9009\u9879\u5217\u8868\u3002</p>\n<h2>\u4f55\u65f6\u4f7f\u7528</h2>\n<ul>\n<li>\u9700\u8981\u5c55\u793a\u679a\u4e3e\u503c\u7684\u63cf\u8ff0\u6587\u672c\u65f6</li>\n<li>\u9700\u8981\u5c06\u679a\u4e3e\u5217\u8868\u6e32\u67d3\u4e3a\u4e0b\u62c9\u6846\u3001\u5355\u9009\u6846\u7b49\u8868\u5355\u7ec4\u4ef6\u65f6</li>\n<li>\u9700\u8981\u7edf\u4e00\u7ba1\u7406\u5e94\u7528\u4e2d\u7684\u679a\u4e3e\u6570\u636e\u65f6</li>\n<li>\u9700\u8981\u652f\u6301\u591a\u8bed\u8a00\u7684\u679a\u4e3e\u63cf\u8ff0\u65f6</li>\n</ul>\n<h2>\u7279\u6027</h2>\n<ul>\n<li>\ud83d\udce6 \u7edf\u4e00\u7684\u679a\u4e3e\u6570\u636e\u7ba1\u7406</li>\n<li>\ud83d\udd04 \u652f\u6301\u540c\u6b65/\u5f02\u6b65\u52a0\u8f7d</li>\n<li>\ud83d\udce1 \u5185\u7f6eLRU\u7f13\u5b58\u673a\u5236</li>\n<li>\ud83c\udf0d \u652f\u6301\u591a\u8bed\u8a00</li>\n<li>\ud83c\udfa8 \u591a\u79cd\u683c\u5f0f\u5316\u65b9\u5f0f</li>\n<li>\ud83d\udd27 \u7075\u6d3b\u7684\u6e32\u67d3\u51fd\u6570</li>\n</ul>",api:"<h2>Enum \u7ec4\u4ef6 API</h2>\n<h3>Enum\uff08\u9ed8\u8ba4\u5bfc\u51fa\uff09</h3>\n<p>\u7528\u4e8e\u83b7\u53d6\u5355\u4e2a\u6216\u591a\u4e2a\u679a\u4e3e\u503c\u7684\u5c55\u793a\u5185\u5bb9\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>\u679a\u4e3e\u6a21\u5757\u540d\u79f0\uff0c\u5bf9\u5e94\u9884\u8bbe\u4e2d\u914d\u7f6e\u7684\u679a\u4e3e\u540d\u79f0</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>\u679a\u4e3e\u503c\uff0c\u5f53\u63d0\u4f9b\u65f6\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u9879\uff1b\u4e0d\u63d0\u4f9b\u65f6\u83b7\u53d6\u6574\u4e2a\u679a\u4e3e\u5217\u8868</td>\n<td>string | number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>\u683c\u5f0f\u5316\u65b9\u5f0f\uff1a'default'\u8fd4\u56de\u63cf\u8ff0\u6587\u672c\uff0c'origin'\u8fd4\u56de\u539f\u59cb\u5bf9\u8c61\uff0c'option'\u8fd4\u56de{label, value}\u683c\u5f0f</td>\n<td>'default' | 'origin' | 'option'</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>force</td>\n<td>\u662f\u5426\u5f3a\u5236\u5237\u65b0\u7f13\u5b58\uff0c\u8df3\u8fc7\u7f13\u5b58\u76f4\u63a5\u8bf7\u6c42</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5b50\u5143\u7d20\u6216\u6e32\u67d3\u51fd\u6570\u3002\u51fd\u6570\u63a5\u6536(data, fetchApi)\u53c2\u6570</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>\u6570\u636e\u52a0\u8f7d\u4e2d\u65f6\u7684\u5360\u4f4d\u5185\u5bb9</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u5931\u8d25\u65f6\u7684\u5c55\u793a\u5185\u5bb9</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u81ea\u5b9a\u4e49\u52a0\u8f7d\u4e2d\u72b6\u6001\u7684\u5c55\u793a</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>EnumResource</h3>\n<p>\u7528\u4e8e\u83b7\u53d6\u5b8c\u6574\u7684\u679a\u4e3e\u5217\u8868\u8d44\u6e90\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>\u679a\u4e3e\u6a21\u5757\u540d\u79f0\uff0c\u652f\u6301\u6570\u7ec4\u4ee5\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>\u683c\u5f0f\u5316\u65b9\u5f0f</td>\n<td>'origin' | 'option' | 'default'</td>\n<td>'origin'</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u6e32\u67d3\u51fd\u6570\uff0c\u63a5\u6536\u679a\u4e3e\u5217\u8868\u4f5c\u4e3a\u53c2\u6570</td>\n<td>Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>\u6570\u636e\u52a0\u8f7d\u4e2d\u65f6\u7684\u5360\u4f4d\u5185\u5bb9</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u5931\u8d25\u65f6\u7684\u5c55\u793a\u5185\u5bb9</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u81ea\u5b9a\u4e49\u52a0\u8f7d\u4e2d\u72b6\u6001\u7684\u5c55\u793a</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>\u679a\u4e3e\u914d\u7f6e</h3>\n<p>\u679a\u4e3e\u6570\u636e\u901a\u8fc7 <code>preset</code> \u51fd\u6570\u6216 <code>PureGlobal/Global</code> \u7ec4\u4ef6\u7684 <code>preset.enums</code> \u914d\u7f6e\uff1a</p>\n<pre><code class=\"language-javascript\">// \u5168\u5c40\u914d\u7f6e\npreset({\n  base: {\n    gender: () =&gt; [\n      { value: 'M', description: '\u7537' },\n      { value: 'F', description: '\u5973' }\n    ]\n  }\n});\n\n// \u6216\u901a\u8fc7 Global \u7ec4\u4ef6\u914d\u7f6e\n&lt;PureGlobal preset={{\n  enums: {\n    status: async ({ language }) =&gt; {\n      // \u652f\u6301\u5f02\u6b65\u52a0\u8f7d\n      return [\n        { value: '1', description: '\u542f\u7528' },\n        { value: '0', description: '\u7981\u7528' }\n      ];\n    }\n  }\n}}&gt;\n</code></pre>\n<h3>\u679a\u4e3e\u9879\u6570\u636e\u7ed3\u6784</h3>\n<table>\n<thead>\n<tr>\n<th>\u5b57\u6bb5\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u5fc5\u586b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>value</td>\n<td>\u679a\u4e3e\u503c</td>\n<td>string | number</td>\n<td>\u662f</td>\n</tr>\n<tr>\n<td>description</td>\n<td>\u679a\u4e3e\u63cf\u8ff0\u6587\u672c</td>\n<td>string</td>\n<td>\u662f</td>\n</tr>\n<tr>\n<td>translation</td>\n<td>\u591a\u8bed\u8a00\u7ffb\u8bd1\u5bf9\u8c61</td>\n<td>object</td>\n<td>\u5426</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Enum_cf204",style:"",list:[{title:"\u57fa\u7840\u7528\u6cd5",description:"\u5c55\u793a\u679a\u4e3e\u7684\u57fa\u672c\u4f7f\u7528\uff0c\u5305\u62ec\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u503c\u548c\u679a\u4e3e\u5217\u8868",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Select, Divider } = antd;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          // \u540c\u6b65\u52a0\u8f7d\u7684\u679a\u4e3e\n          gender: [\n            { value: "M", description: "\u7537" },\n            { value: "F", description: "\u5973" },\n          ],\n          // \u5f02\u6b65\u52a0\u8f7d\u7684\u679a\u4e3e\n          status: async ({ locale }) => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "1", description: "\u542f\u7528" },\n                  { value: "0", description: "\u7981\u7528" },\n                ]);\n              }, 500);\n            });\n          },\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u503c</h4>\n          <Space>\n            <span>\u6027\u522b\uff1a</span>\n            <Enum moduleName="gender" name="M" />\n            <Divider type="vertical" />\n            <span>\u81ea\u5b9a\u4e49\u6e32\u67d3\uff1a</span>\n            <Enum moduleName="gender" name="F">\n              {(data) => <strong style={{ color: "#f5222d" }}>{data.description}</strong>}\n            </Enum>\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u83b7\u53d6\u679a\u4e3e\u5217\u8868</h4>\n          <Enum moduleName="gender">\n            {(list) => {\n              return (\n                <Space>\n                  <span>\u53ef\u9009\u9879\uff1a</span>\n                  {list.map((item, index) => (\n                    <span key={item.value}>\n                      {item.description}\n                      {index < list.length - 1 && "\u3001"}\n                    </span>\n                  ))}\n                </Space>\n              );\n            }}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a\u4e0b\u62c9\u6846</h4>\n          <Enum moduleName="status">\n            {(list) => {\n              return (\n                <Select\n                  style={{ width: 150 }}\n                  placeholder="\u8bf7\u9009\u62e9\u72b6\u6001"\n                  options={list.map((item) => ({\n                    value: item.value,\n                    label: item.description,\n                  }))}\n                />\n              );\n            }}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u5360\u4f4d\u7b26\u548c\u52a0\u8f7d\u72b6\u6001</h4>\n          <Space>\n            <span>\u72b6\u6001\uff1a</span>\n            <Enum \n              moduleName="status" \n              name="1"\n              placeholder="\u52a0\u8f7d\u4e2d..."\n            />\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u4f7f\u7528format="option"\u76f4\u63a5\u83b7\u53d6\u9009\u9879\u683c\u5f0f</h4>\n          <Enum moduleName="gender" format="option">\n            {(list) => (\n              <Select\n                style={{ width: 150 }}\n                placeholder="\u8bf7\u9009\u62e9\u6027\u522b"\n                options={list}\n              />\n            )}\n          </Enum>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u5f02\u6b65\u52a0\u8f7d\u4e0e\u7f13\u5b58",description:"\u5c55\u793a\u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\u6570\u636e\u3001Loading\u72b6\u6001\u548c\u5f3a\u5236\u5237\u65b0\u7f13\u5b58",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Button, message } = antd;\nconst { useState } = React;\n\nconst AsyncEnumExample = () => {\n  const [refreshKey, setRefreshKey] = useState(0);\n  \n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          // \u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\u6570\u636e\n          userStatus: async ({ language }) => {\n            // \u6a21\u62df\u4ece\u670d\u52a1\u5668\u83b7\u53d6\u6570\u636e\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "active", description: "\u6d3b\u8dc3" },\n                  { value: "inactive", description: "\u975e\u6d3b\u8dc3" },\n                  { value: "pending", description: "\u5f85\u5ba1\u6838" },\n                  { value: "banned", description: "\u5df2\u7981\u7528" },\n                ]);\n              }, 1500);\n            });\n          },\n          // \u540c\u6b65\u679a\u4e3e\u6570\u636e\n          priority: [\n            { value: "low", description: "\u4f4e\u4f18\u5148\u7ea7" },\n            { value: "medium", description: "\u4e2d\u4f18\u5148\u7ea7" },\n            { value: "high", description: "\u9ad8\u4f18\u5148\u7ea7" },\n            { value: "urgent", description: "\u7d27\u6025" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\uff08\u5e26Loading\u72b6\u6001\uff09</h4>\n          <Enum \n            key={refreshKey}\n            moduleName="userStatus" \n            name="active"\n            loading={<span>\u6b63\u5728\u52a0\u8f7d\u7528\u6237\u72b6\u6001...</span>}\n            placeholder="--"\n          >\n            {(data) => <div>\u5f53\u524d\u72b6\u6001\uff1a{data.description}</div>}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u5f3a\u5236\u5237\u65b0\u7f13\u5b58</h4>\n          <Space>\n            <Enum \n              moduleName="userStatus" \n              name="banned"\n              force={refreshKey > 0}\n            >\n              {(data) => data.description}\n            </Enum>\n            <Button \n              onClick={() => {\n                setRefreshKey(prev => prev + 1);\n                message.info("\u5df2\u5237\u65b0\u7f13\u5b58");\n              }}\n            >\n              \u5237\u65b0\u7f13\u5b58\n            </Button>\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u540c\u6b65\u679a\u4e3e\u6570\u636e\uff08\u7acb\u5373\u663e\u793a\uff09</h4>\n          <Space>\n            <Enum moduleName="priority" name="high" />\n            <Enum moduleName="priority" name="urgent">\n              {(data) => <span style={{ color: "red" }}>{data.description}</span>}\n            </Enum>\n          </Space>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<AsyncEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u683c\u5f0f\u5316\u65b9\u5f0f",description:"\u5c55\u793a\u4e0d\u540c\u7684\u683c\u5f0f\u5316\u65b9\u5f0f\u548c\u81ea\u5b9a\u4e49\u6e32\u67d3",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Divider, Card } = antd;\n\nconst FormatEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          orderStatus: [\n            { value: "created", description: "\u5df2\u521b\u5efa", color: "#666" },\n            { value: "paid", description: "\u5df2\u652f\u4ed8", color: "#1890ff" },\n            { value: "shipped", description: "\u5df2\u53d1\u8d27", color: "#52c41a" },\n            { value: "completed", description: "\u5df2\u5b8c\u6210", color: "#52c41a" },\n            { value: "cancelled", description: "\u5df2\u53d6\u6d88", color: "#f5222d" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <Card title="\u4e0d\u540c\u683c\u5f0f\u5316\u65b9\u5f0f" size="small">\n          <Space direction="vertical">\n            <div>\n              <strong>\u9ed8\u8ba4\u683c\u5f0f\uff08format="default"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="default" />\n            </div>\n            \n            <Divider />\n            \n            <div>\n              <strong>\u539f\u59cb\u5bf9\u8c61\uff08format="origin"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="origin">\n                {(data) => (\n                  <pre>{JSON.stringify(data, null, 2)}</pre>\n                )}\n              </Enum>\n            </div>\n            \n            <Divider />\n            \n            <div>\n              <strong>\u9009\u9879\u683c\u5f0f\uff08format="option"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="option">\n                {(data) => (\n                  <span>label: {data.label}, value: {data.value}</span>\n                )}\n              </Enum>\n            </div>\n          </Space>\n        </Card>\n        \n        <Card title="\u81ea\u5b9a\u4e49\u6e32\u67d3" size="small">\n          <Space>\n            <Enum moduleName="orderStatus" name="shipped" format="origin">\n              {(data) => (\n                <span style={{ color: data.color }}>\n                  \u25cf {data.description}\n                </span>\n              )}\n            </Enum>\n            \n            <Enum moduleName="orderStatus" name="cancelled" format="origin">\n              {(data) => (\n                <span style={{ \n                  padding: "2px 8px",\n                  backgroundColor: data.color,\n                  color: "#fff",\n                  borderRadius: "4px"\n                }}>\n                  {data.description}\n                </span>\n              )}\n            </Enum>\n          </Space>\n        </Card>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<FormatEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u6e32\u67d3\u679a\u4e3e\u5217\u8868",description:"\u5c06\u679a\u4e3e\u5217\u8868\u6e32\u67d3\u4e3a\u5404\u79cd\u8868\u5355\u7ec4\u4ef6",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Select, Radio, Checkbox, Table } = antd;\n\nconst ListEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          department: [\n            { value: "tech", description: "\u6280\u672f\u90e8" },\n            { value: "product", description: "\u4ea7\u54c1\u90e8" },\n            { value: "design", description: "\u8bbe\u8ba1\u90e8" },\n            { value: "marketing", description: "\u5e02\u573a\u90e8" },\n            { value: "hr", description: "\u4eba\u529b\u8d44\u6e90\u90e8" },\n            { value: "finance", description: "\u8d22\u52a1\u90e8" },\n          ],\n          role: [\n            { value: "admin", description: "\u7ba1\u7406\u5458", level: 1 },\n            { value: "manager", description: "\u7ecf\u7406", level: 2 },\n            { value: "employee", description: "\u5458\u5de5", level: 3 },\n            { value: "intern", description: "\u5b9e\u4e60\u751f", level: 4 },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u6e32\u67d3\u4e3a Select \u4e0b\u62c9\u6846</h4>\n          <Enum moduleName="department">\n            {(list) => (\n              <Select\n                style={{ width: 200 }}\n                placeholder="\u8bf7\u9009\u62e9\u90e8\u95e8"\n                options={list.map((item) => ({\n                  value: item.value,\n                  label: item.description,\n                }))}\n              />\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Radio \u5355\u9009\u7ec4</h4>\n          <Enum moduleName="role">\n            {(list) => (\n              <Radio.Group>\n                {list.map((item) => (\n                  <Radio key={item.value} value={item.value}>\n                    {item.description}\n                  </Radio>\n                ))}\n              </Radio.Group>\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Checkbox \u591a\u9009\u7ec4</h4>\n          <Enum moduleName="department">\n            {(list) => (\n              <Checkbox.Group>\n                {list.slice(0, 4).map((item) => (\n                  <Checkbox key={item.value} value={item.value}>\n                    {item.description}\n                  </Checkbox>\n                ))}\n              </Checkbox.Group>\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Table \u8868\u683c</h4>\n          <Enum moduleName="role" format="origin">\n            {(list) => (\n              <Table\n                size="small"\n                pagination={false}\n                columns={[\n                  { title: "\u7f16\u7801", dataIndex: "value", key: "value" },\n                  { title: "\u540d\u79f0", dataIndex: "description", key: "description" },\n                  { title: "\u7ea7\u522b", dataIndex: "level", key: "level" },\n                ]}\n                dataSource={list.map(item => ({ ...item, key: item.value }))}\n              />\n            )}\n          </Enum>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<ListEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u591a\u679a\u4e3e\u6a21\u5757",description:"\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e\u6a21\u5757\u548c\u9519\u8bef\u5904\u7406",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Card, Tag } = antd;\n\nconst MultiEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          country: [\n            { value: "CN", description: "\u4e2d\u56fd" },\n            { value: "US", description: "\u7f8e\u56fd" },\n            { value: "UK", description: "\u82f1\u56fd" },\n            { value: "JP", description: "\u65e5\u672c" },\n          ],\n          language: [\n            { value: "zh-CN", description: "\u7b80\u4f53\u4e2d\u6587" },\n            { value: "en-US", description: "\u82f1\u8bed" },\n            { value: "ja-JP", description: "\u65e5\u8bed" },\n            { value: "ko-KR", description: "\u97e9\u8bed" },\n          ],\n          timezone: [\n            { value: "UTC+8", description: "\u5317\u4eac\u65f6\u95f4" },\n            { value: "UTC+0", description: "\u683c\u6797\u5a01\u6cbb\u65f6\u95f4" },\n            { value: "UTC-5", description: "\u7ebd\u7ea6\u65f6\u95f4" },\n            { value: "UTC+9", description: "\u4e1c\u4eac\u65f6\u95f4" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <Card title="\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e\u6a21\u5757" size="small">\n          <Enum moduleName={["country", "language", "timezone"]}>\n            {([countries, languages, timezones]) => (\n              <Space direction="vertical">\n                <div>\n                  <strong>\u56fd\u5bb6\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {countries.map(item => (\n                      <Tag key={item.value}>{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n                <div>\n                  <strong>\u8bed\u8a00\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {languages.map(item => (\n                      <Tag key={item.value} color="blue">{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n                <div>\n                  <strong>\u65f6\u533a\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {timezones.map(item => (\n                      <Tag key={item.value} color="green">{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n              </Space>\n            )}\n          </Enum>\n        </Card>\n        \n        <Card title="\u7ec4\u5408\u4f7f\u7528\u591a\u4e2a\u679a\u4e3e" size="small">\n          <Space>\n            <span>\u7528\u6237\u6765\u81ea</span>\n            <Enum moduleName="country" name="CN">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>\uff0c\u4f7f\u7528</span>\n            <Enum moduleName="language" name="zh-CN">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>\uff0c\u65f6\u533a\u4e3a</span>\n            <Enum moduleName="timezone" name="UTC+8">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n          </Space>\n        </Card>\n        \n        <Card title="\u9519\u8bef\u5904\u7406" size="small">\n          <Space direction="vertical">\n            <div>\n              <strong>\u4e0d\u5b58\u5728\u7684\u679a\u4e3e\u6a21\u5757\uff1a</strong>\n              <Enum \n                moduleName="notExist" \n                name="test"\n                error={<span style={{ color: "red" }}>\u679a\u4e3e\u52a0\u8f7d\u5931\u8d25</span>}\n              />\n            </div>\n            <div>\n              <strong>\u4e0d\u5b58\u5728\u7684\u679a\u4e3e\u503c\uff08\u663e\u793a\u5360\u4f4d\u7b26\uff09\uff1a</strong>\n              <Enum \n                moduleName="country" \n                name="XX"\n                placeholder="\u672a\u77e5\u56fd\u5bb6"\n              />\n            </div>\n          </Space>\n        </Card>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<MultiEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]}]}}},74199:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(73604),o=t(55199);const l=JSON.parse('{"id":1,"coId":1,"name":"\u6d88\u606f\u7b80\u4f53","parentId":0,"enName":"xiaoxijianti","leaf":false,"children":[{"id":428,"coId":1,"name":"a\u6d4b\u8bd5\u90e8\u95e801","parentId":1,"enName":"Test BU1","leaf":false,"children":[{"id":430,"coId":1,"name":"01\u5f00\u53d1\u90e8","parentId":428,"enName":null,"leaf":true,"children":[]},{"id":431,"coId":1,"name":"01\u6d4b\u8bd5\u90e8","parentId":428,"enName":"Test bu-01","leaf":false,"children":[{"id":432,"coId":1,"name":"01\u81ea\u52a8\u5316\u90e8","parentId":431,"enName":null,"leaf":false,"children":[{"id":434,"coId":1,"name":"02UI\u81ea\u52a8\u5316","parentId":432,"enName":null,"leaf":false,"children":[{"id":485,"coId":1,"name":"\u4ee3\u7801\u7f16\u5199\u5458","parentId":434,"enName":null,"leaf":true,"children":[]},{"id":484,"coId":1,"name":"\u81ea\u52a8\u5316\u6846\u67b6\u642d\u5efa\u5458","parentId":434,"enName":null,"leaf":true,"children":[]}]}]}]}]},{"id":429,"coId":1,"name":"a\u6d4b\u8bd5\u90e8\u95e802","parentId":1,"enName":"YYY","leaf":false,"children":[{"id":483,"coId":1,"name":"\u5f00\u53d1\u7ec4","parentId":429,"enName":null,"leaf":true,"children":[]},{"id":482,"coId":1,"name":"\u6d4b\u8bd5\u90e8","parentId":429,"enName":null,"leaf":true,"children":[]}]},{"id":184,"coId":1,"name":"\u4e0a\u6d77a","parentId":1,"enName":"shanghai","leaf":true,"children":[]},{"id":78,"coId":1,"name":"\u4e8b\u4e1a\u4e00\u90e8","parentId":1,"enName":"shiyeyibu","leaf":false,"children":[{"id":89,"coId":1,"name":"RPO-\u5e7f\u5dde","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":90,"coId":1,"name":"RPO-\u82cf\u5dde","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":83,"coId":1,"name":"\u4e0a\u6d77-\u5de5\u4e1a\u5236\u9020","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":82,"coId":1,"name":"\u4e0a\u6d77-\u6570\u5b57\u79d1\u6280","parentId":78,"enName":null,"leaf":true,"children":[]}]},{"id":80,"coId":1,"name":"\u4e8b\u4e1a\u4e09\u90e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":93,"coId":1,"name":"RPO-\u5317\u4eac-\u56e2\u961f2","parentId":80,"enName":null,"leaf":true,"children":[]},{"id":92,"coId":1,"name":"\u5317\u4eac-\u9ad8\u79d1\u6280\u53ca\u4e92\u8054\u7f51","parentId":80,"enName":null,"leaf":true,"children":[]}]},{"id":79,"coId":1,"name":"\u4e8b\u4e1a\u4e8c\u90e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":88,"coId":1,"name":"PRO-\u5de5\u4e1a\u5236\u9020","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":87,"coId":1,"name":"PRO-\u751f\u547d\u79d1\u5b66-\u56e2\u961f2","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":91,"coId":1,"name":"RPO-\u5feb\u6d88\u96f6\u552e","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":86,"coId":1,"name":"RPO-\u751f\u547d\u79d1\u5b66","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":85,"coId":1,"name":"\u4e0a\u6d77-\u91d1\u878d","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":84,"coId":1,"name":"\u4e0a\u6d77-\u96f6\u552e","parentId":79,"enName":null,"leaf":true,"children":[]}]},{"id":173,"coId":1,"name":"\u5ba1\u6279\u6d41\u90e8\u95e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":176,"coId":1,"name":"GM","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":175,"coId":1,"name":"VP","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":174,"coId":1,"name":"\u51fa\u7eb3","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":180,"coId":1,"name":"\u6284\u9001\u4eba","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":178,"coId":1,"name":"\u6cd5\u52a1","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":177,"coId":1,"name":"\u8d22\u52a1\u5206\u6790","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":179,"coId":1,"name":"\u9ed8\u8ba4\u5ba1\u6279\u4eba","parentId":173,"enName":null,"leaf":true,"children":[]}]},{"id":81,"coId":1,"name":"\u6570\u5b57\u5316\u56e2\u961f","parentId":1,"enName":"Shu Zi-Hua","leaf":false,"children":[{"id":201,"coId":1,"name":"\u6d4b\u8bd5\u56e2\u961f","parentId":81,"enName":"ceshi---","leaf":true,"children":[]}]},{"id":103,"coId":1,"name":"\u661f\u8fb0\u6c34","parentId":1,"enName":null,"leaf":false,"children":[{"id":106,"coId":1,"name":"\u661f\u8fb0\u4e00\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":111,"coId":1,"name":"\u661f\u8fb0\u4e09\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":107,"coId":1,"name":"\u661f\u8fb0\u4e8c\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":151,"coId":1,"name":"\u661f\u8fb0\u56db\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]}]},{"id":101,"coId":1,"name":"\u667a\u6167\u661f","parentId":1,"enName":null,"leaf":false,"children":[{"id":104,"coId":1,"name":"\u667a\u6167\u4e00\u90e8","parentId":101,"enName":null,"leaf":false,"children":[{"id":150,"coId":1,"name":"\u667a\u6167\u4e00\u90e8-\u6708\u4eae\u661f","parentId":104,"enName":null,"leaf":true,"children":[]}]},{"id":109,"coId":1,"name":"\u667a\u6167\u4e09\u90e8","parentId":101,"enName":null,"leaf":true,"children":[]},{"id":105,"coId":1,"name":"\u667a\u6167\u4e8c\u90e8","parentId":101,"enName":null,"leaf":true,"children":[]}]},{"id":182,"coId":1,"name":"\u667a\u80fd\u540e\u53f0\uff08\u4e0a\u6d77\uff09","parentId":1,"enName":null,"leaf":true,"children":[]},{"id":181,"coId":1,"name":"\u7ba1\u7406\u4e2d\u5fc3","parentId":1,"enName":null,"leaf":true,"children":[]},{"id":194,"coId":1,"name":"\u81ea\u52a8\u5316\u90e8\u95e8","parentId":1,"enName":null,"leaf":true,"children":[]}]}');const d={name:"Filter",summary:"",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Filter_d7778",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {\n  default: Filter,\n  InputFilterItem,\n  DatePickerFilterItem,\n  DateRangePickerFilterItem,\n  TypeDateRangePickerFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  SuperSelectFilterItem,\n  SuperSelectUserFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  getFilterValue,\n  FilterItemContainer,\n} = _Filter;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, onChange] = useState([]);\n  return (\n    <Filter\n      value={value}\n      onChange={(value) => {\n        console.log(getFilterValue(value));\n        onChange(value);\n      }}\n      extra={<Filter.SearchInput name="name" label="\u59d3\u540d" />}\n      list={[\n        [\n          <InputFilterItem label="\u6587\u5b57" name="text" />,\n          <CityFilterItem label="\u57ce\u5e02" name="city" />,\n          <FilterItemContainer name="select" label="\u9ad8\u7ea7\u9009\u62e9">\n            {(props) => (\n              <div>\n                <AdvancedSelectFilterItem\n                  {...props}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: "\u7b2c\u4e00\u9879", value: 1 },\n                          {\n                            label: "\u7b2c\u4e8c\u9879",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />\n              </div>\n            )}\n          </FilterItemContainer>,\n          <DatePickerFilterItem label="\u65e5\u671f" name="date" picker="week" />,\n          <TypeDateRangePickerFilterItem\n            label="\u590d\u6742\u65e5\u671f\u8303\u56f4"\n            name="type-data-range"\n            allowEmpty={[true, true]}\n          />,\n          <DateRangePickerFilterItem label="\u65e5\u671f\u8303\u56f4" name="date-range" />,\n          <SuperSelectFilterItem\n            label="\u9009\u62e9\u4fe1\u606f"\n            name="select-value"\n            options={[\n              {\n                label: "\u7528\u6237\u4e00",\n                value: 1,\n                description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n              },\n              {\n                label: "\u7528\u6237\u4e8c",\n                value: 2,\n                description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n              },\n            ]}\n          />,\n          <SuperSelectUserFilterItem\n            label="\u7528\u6237\u9009\u62e9"\n            name="user"\n            api={{\n              loader: () => {\n                return {\n                  pageData: [\n                    {\n                      label: "\u7528\u6237\u4e00",\n                      value: 1,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                    {\n                      label: "\u7528\u6237\u4e8c",\n                      value: 2,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                    {\n                      label: "\u7528\u6237\u4e09",\n                      value: 3,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                  ],\n                };\n              },\n            }}\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="functionLast"\n            onlyAllowLastLevel\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="function"\n            selectLevel={3}\n            maxLength={3}\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="functionSingle"\n            single\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industryLast"\n            onlyAllowLastLevel\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industry"\n            selectLevel={2}\n            maxLength={3}\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industrySingle"\n            single\n          />,\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a}]},{title:"\u9ad8\u7ea7\u7b5b\u9009",description:"\u9ad8\u7ea7\u7b5b\u9009",code:'const {\n  default: Filter,\n  AdvancedFilter,\n  InputFilterItem,\n  DatePickerFilterItem,\n  DateRangePickerFilterItem,\n  TypeDateRangePickerFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  NumberRangeFilterItem,\n  getFilterValue,\n  FilterItemContainer,\n} = _Filter;\nconst { useState } = React;\n\nconst {\n  CityFilterItem: CityAdvancedFilterItem,\n  ListFilterItem,\n  InputFilterItem: InputAdvancedFilterItem,\n} = AdvancedFilter.fields;\nconst BaseExample = () => {\n  const [value, onChange] = useState([]);\n  return (\n    <AdvancedFilter\n      value={value}\n      onChange={(value) => {\n        console.log(getFilterValue(value));\n        onChange(value);\n      }}\n      list={[\n        [<CityAdvancedFilterItem name="currentCity" label="\u5f53\u524d\u57ce\u5e02" single />],\n        [<CityAdvancedFilterItem name="expectCity" label="\u671f\u671b\u57ce\u5e02" />],\n        [\n          <ListFilterItem\n            name="experience"\n            label="\u5de5\u4f5c\u7ecf\u9a8c"\n            single\n            items={[\n              {\n                value: [null, 1],\n                label: "1\u5e74\u4ee5\u4e0b",\n              },\n              {\n                value: [1, 5],\n                label: "1-5\u5e74",\n              },\n              { value: [5, null], label: "5\u5e74\u4ee5\u4e0a" },\n            ]}\n            custom={<NumberRangeFilterItem label="\u81ea\u5b9a\u4e49" unit="\u5e74" />}\n          />,\n        ],\n        [<InputAdvancedFilterItem name="company" label="\u516c\u53f8" />],\n      ]}\n      more={[\n        <InputFilterItem label="\u6587\u5b57" name="text" />,\n        <CityFilterItem label="\u57ce\u5e02" name="city" />,\n        <FilterItemContainer name="select" label="\u9ad8\u7ea7\u9009\u62e9">\n          {(props) => (\n            <div>\n              <AdvancedSelectFilterItem\n                {...props}\n                api={{\n                  loader: () => {\n                    return {\n                      pageData: [\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        {\n                          label: "\u7b2c\u4e8c\u9879",\n                          value: 2,\n                          disabled: true,\n                        },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ],\n                    };\n                  },\n                }}\n              />\n            </div>\n          )}\n        </FilterItemContainer>,\n        <DatePickerFilterItem label="\u65e5\u671f" name="date" picker="week" />,\n        <TypeDateRangePickerFilterItem\n          label="\u590d\u6742\u65e5\u671f\u8303\u56f4"\n          name="type-data-range"\n          allowEmpty={[true, true]}\n        />,\n        <DateRangePickerFilterItem label="\u65e5\u671f\u8303\u56f4" name="date-range" />,\n        <UserFilterItem\n          label="\u7528\u6237\u9009\u62e9"\n          name="user"\n          api={{\n            loader: () => {\n              return {\n                pageData: [\n                  {\n                    label: "\u7528\u6237\u4e00",\n                    value: 1,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                  {\n                    label: "\u7528\u6237\u4e8c",\n                    value: 2,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                  {\n                    label: "\u7528\u6237\u4e09",\n                    value: 3,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                ],\n              };\n            },\n          }}\n        />,\n        <FunctionSelectFilterItem\n          label="\u804c\u80fd\u9009\u62e9"\n          name="function"\n          onlyAllowLastLevel\n          single\n        />,\n        <IndustrySelectFilterItem\n          label="\u884c\u4e1a\u9009\u62e9"\n          name="industry"\n          onlyAllowLastLevel\n        />,\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Filter, TreeFilterItem } = _Filter;\nconst { default: treeData } = _data;\nconst { useState } = React;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  const [filter, setFilter] = useState([]);\n  const [filter2, setFilter2] = useState([]);\n\n  return (\n    <Space direction="vertical">\n      <Filter\n        value={filter}\n        onChange={setFilter}\n        list={[\n          [\n            <TreeFilterItem\n              name="tree"\n              single\n              label="\u6811\u7ec4\u4ef6"\n              fieldNames={{\n                title: "name",\n                key: "id",\n                children: "children",\n              }}\n              api={{\n                loader: () => {\n                  return treeData.children;\n                },\n              }}\n            />,\n          ],\n        ]}\n      />\n      <Filter\n        value={filter2}\n        onChange={setFilter2}\n        list={[\n          [\n            <TreeFilterItem\n              name="tree"\n              label="\u6811\u7ec4\u4ef6"\n              fieldNames={{\n                title: "name",\n                key: "id",\n                children: "children",\n              }}\n              api={{\n                loader: () => {\n                  return treeData.children;\n                },\n              }}\n            />,\n          ],\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a},{name:"antd",packageName:"antd",component:o},{name:"_data",packageName:"@components/Filter/doc/mock/tree-data.json",component:t.t(l,2)}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {\n  FilterValueDisplay,\n  FilterItem,\n  FilterLines,\n  PopoverItem,\n  InputFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n} = _Filter;\nconst { Space, Input } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, setValue] = useState([\n    {\n      label: "\u57ce\u5e02",\n      name: "city",\n      value: [\n        { label: "\u4e0a\u6d77", value: "010" },\n        { label: "\u5317\u4eac", value: "020" },\n      ],\n    },\n    {\n      label: "\u804c\u80fd",\n      name: "function",\n      value: [\n        { label: "\u4ea7\u54c1\u7ecf\u7406", value: "010" },\n        { label: "\u9500\u552e", value: "020" },\n        {\n          label: "\u5ba2\u6237\u7ecf\u7406",\n          value: "030",\n        },\n      ],\n    },\n  ]);\n  return (\n    <Space direction="vertical">\n      <FilterValueDisplay value={value} onChange={setValue} />\n      <Space>\n        <FilterItem label="\u5ba2\u6237" />\n        <FilterItem label="\u5ba2\u6237" active />\n        <FilterItem label="\u5ba2\u6237" open />\n        <FilterItem label="\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f" active open />\n      </Space>\n      <FilterLines\n        list={[\n          [\n            <FilterItem label="\u5ba2\u6237" />,\n            <FilterItem label="\u804c\u4f4d" />,\n            <FilterItem label="\u804c\u4f4d\u8d1f\u8d23\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n        ]}\n      />\n      <PopoverItem label="\u5ba2\u6237">\n        {({ value, onChange }) => (\n          <Input value={value} onChange={(e) => onChange(e.target.value)} />\n        )}\n      </PopoverItem>\n      <FilterLines\n        list={[\n          [\n            <InputFilterItem label="\u6587\u5b57" />,\n            <CityFilterItem label="\u57ce\u5e02" />,\n            <AdvancedSelectFilterItem\n              label="\u9ad8\u7ea7\u9009\u62e9"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <UserFilterItem\n              label="\u7528\u6237\u9009\u62e9"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <FunctionSelectFilterItem label="\u804c\u80fd\u9009\u62e9" />,\n            <IndustrySelectFilterItem label="\u884c\u4e1a\u9009\u62e9" />,\n          ],\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},77091:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(47338),o=t(55199);const l={name:"ConfirmButton",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6267\u884c\u64cd\u4f5c\u524d\u786e\u8ba4\u540e\u518d\u6267\u884c</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>message</td>\n<td>\u5220\u9664\u63d0\u793a</td>\n<td>jsx</td>\n<td>\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u5220\u9664\u63d0\u793a\u6807\u9898</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isDelete</td>\n<td>\u662f\u5426\u4e3a\u5220\u9664\u64cd\u4f5c</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>onClick</td>\n<td>\u70b9\u51fb\u786e\u8ba4\u540e\u6267\u884c\u7684\u4e8b\u4ef6</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u70b9\u51fb\u53d6\u6d88\u540e\u6267\u884c\u7684\u4e8b\u4ef6</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>disabled</td>\n<td>\u6309\u94ae\u662f\u5426\u7981\u7528</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showCancel</td>\n<td>\u662f\u5426\u663e\u793a\u53d6\u6d88\u6309\u94ae</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>cancelText</td>\n<td>\u53d6\u6d88\u6309\u94ae\u6587\u6848</td>\n<td>string</td>\n<td>\u53d6\u6d88</td>\n</tr>\n<tr>\n<td>okText</td>\n<td>\u786e\u8ba4\u6309\u94ae\u6587\u6848</td>\n<td>string</td>\n<td>\u786e\u8ba4</td>\n</tr>\n<tr>\n<td>isModal</td>\n<td>\u662f\u5426\u4ee5\u5f39\u7a97\u65b9\u5f0f\u5c55\u793a\uff0c\u9ed8\u8ba4\u4e3aPopconfirm</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>placement</td>\n<td>\u5f53isModal\u4e3afalse\u65f6\u751f\u6548\uff0c\u6307\u5b9aPopconfirm\u7684\u5f39\u51fa\u65b9\u5411</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getContainer</td>\n<td>\u6307\u5b9aPopconfirm\u6216Modal\u5f39\u51fa\u4f4d\u7f6e\uff0c\u4e00\u822c\u4e0d\u9700\u8981\u6307\u5b9a</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>ConfirmLink</h3>\n<p>\u53e6\u5916\u7684\u4e00\u79cd\u6309\u94ae\u5f62\u5f0f\u53c2\u6570\u540cConfirmButton</p>\n<h3>withConfirm</h3>\n<p>\u9ad8\u9636\u7ec4\u4ef6\u53ef\u4ee5\u81ea\u5b9a\u4e49\u6309\u94ae</p>",example:{isFull:!1,className:"ConfirmButton_5f815",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: ConfirmButton, ConfirmLink } = _ConfirmButton;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <Space direction={"vertical"}>\n      <Space>\n        <ConfirmButton\n          isDelete={false}\n          message="\u786e\u5b9a\u8981\u5220\u9664\u5417"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          isDelete={false}\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-\u6c14\u6ce1-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-\u6c14\u6ce1-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          isDelete={false}\n          message="\u786e\u5b9a\u63d0\u4ea4XX\u5417\uff1f"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-modal-\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-modal-\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          title="\u786e\u5b9a\u63d0\u4ea4XX\u5417\uff1f"\n          isDelete={false}\n          message="\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-modal-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u6709title\u7684Modal\u786e\u8ba4\u5220\u9664\n        </ConfirmButton>\n      </Space>\n      <ConfirmLink\n        onClick={() => {\n          console.log("\u6267\u884c\u5220\u9664");\n        }}\n      >\n        Link-\u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n      </ConfirmLink>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_ConfirmButton",packageName:"@components/ConfirmButton",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:t(63743)}]}]}}},82723:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.Content});var a=t(87923)},85772:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(40438),o=t(63743),l=t(55199);const d={name:"Image",summary:"<p>\u7528\u4e8e\u5c55\u793a\u4e00\u5f20\u56fe\u7247\uff0c\u548cimg\u6807\u7b7e\u4e0d\u540c\u7684\u662f\uff0c\u53ef\u4ee5\u5c55\u793a\u4e00\u5f20\u666e\u901a\u56fe\u7247\uff0c\u4e5f\u53ef\u4ee5\u901a\u8fc7id\u52a0\u8f7d\u4e00\u5f20oss\u56fe\u7247\uff0c\u5728\u52a0\u8f7doss\u5730\u5740\u548c\u56fe\u7247\u6570\u636e\u7684\u65f6\u5019\u4f1a\u663e\u793aloading\u72b6\u6001</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>src</td>\n<td>\u56fe\u7247\u7684src\u5730\u5740</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>oss\u7684id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u52a0\u8f7d\u65f6\u663e\u793a\u7684\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u9519\u8bef\u65f6\u663e\u793a\u7684\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Image.Avatar</h3>\n<p>\u7528antd\u7684Avatar\u6765\u663e\u793a\u56fe\u7247\uff0c\u53ef\u4ee5\u663e\u793a\u9ed8\u8ba4\u7684\u7537\u5973\u5934\u50cf\uff0c\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd\u7684Avatar\u7ec4\u4ef6</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>gender</td>\n<td>\u6027\u522b F\uff0cfemale\uff0cf\u4e3a\u5973\u5176\u4ed6\u4e3a\u7537</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Image_be53a",style:"",list:[{title:"\u901a\u8fc7src\u52a0\u8f7d\u4e00\u4e2a\u666e\u901a\u56fe\u7247",description:"\u901a\u8fc7src\u52a0\u8f7d\u4e00\u4e2a\u666e\u901a\u56fe\u7247",code:"const {default: Image} = _Image;\nconst BaseExample = () => {\n    return <Image src={window.PUBLIC_URL + \"/logo512.png\"} style={{width: '100px', height: '100px'}}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Image",packageName:"@components/Image",component:a}]},{title:"\u901a\u8fc7id\u52a0\u8f7d\u4e00\u4e2aoss\u56fe\u7247",description:"\u56fe\u7247\u4e00\u52a0\u8f7d\u6210\u529f\uff0c\u56fe\u7247\u4e8c\u52a0\u8f7d\u4e2d\uff0c\u56fe\u7247\u4e09\u52a0\u8f7d\u5931\u8d25",code:"const {default: Image} = _Image;\nconst {PureGlobal} = global;\nconst {Space} = antd;\nconst BaseExample = () => {\n    return <PureGlobal preset={{\n        apis: {\n            file: {\n                getUrl: {\n                    loader: ({params}) => {\n                        if (params.id === 'logo513.png') {\n                            return new Promise(() => {\n\n                            });\n                        }\n                        return new Promise((resolve) => {\n                            resolve(window.PUBLIC_URL + '/' + params.id);\n                        });\n\n                    }\n                }\n            }\n        }\n    }}>\n        <Space>\n            <Image id=\"logo512.png\" style={{width: '100px', height: '100px'}}/>\n            <Image id=\"logo513.png\" style={{width: '100px', height: '100px'}}/>\n            <Image id=\"logo511.png\" style={{width: '100px', height: '100px'}}/>\n        </Space>\n    </PureGlobal>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Image",packageName:"@components/Image",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]},{title:"\u663e\u793a\u4e00\u4e2a\u5934\u50cf",description:"\u663e\u793a\u56fe\u7247\u5934\u50cf\u548c\u9ed8\u8ba4\u5934\u50cf",code:'const { default: Image } = _Image;\nconst { Space } = antd;\nconst BaseExample = () => {\n  return (\n    <Space>\n      <Image.Avatar src={window.PUBLIC_URL + "/avatar.png"} shape="circle" />\n      <Image.Avatar\n        src={window.PUBLIC_URL + "/avatar.png"}\n        shape="circle"\n        size={80}\n      />\n      <Image.Avatar\n        src={window.PUBLIC_URL + "/avatar.png"}\n        shape="circle"\n        size={50}\n      />\n\n      <Image.Avatar shape="circle" />\n      <Image.Avatar gender="M" shape="circle" size={80} />\n      <Image.Avatar gender="female" shape="circle" size={50} />\n      <Image.Avatar gender="m" shape="circle" size={50} />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Image",packageName:"@components/Image",component:a},{name:"antd",packageName:"antd",component:l}]}]}}},86454:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.FetchButton});t(9056);var a=t(61186)},89896:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(63743),o=t(55199),l=t(64671);const d={name:"Global",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u4f7f\u7528components-core\u7684\u4efb\u4f55\u7ec4\u4ef6\u7684\u4e1a\u52a1\u7cfb\u7edf\uff0c\u9700\u8981\u5c06\u8be5\u7ec4\u4ef6\u653e\u7f6e\u4e8e\u6700\u5916\u5c42\uff0c\u5e76\u4e14\u6309\u7167\u8981\u6c42\u6b63\u786e\u8bbe\u7f6epreset\u3002</p>\n<p>\u4ee5\u4e0b\u662fcomponents-core\u7ec4\u4ef6\u7cfb\u7edf\u4e2d\u9700\u8981\u8bbe\u7f6e\u7684preset\u503c\uff0c\u53ca\u4f7f\u7528\u8fd9\u4e9b\u503c\u7684\u7ec4\u4ef6</p>\n<table>\n<thead>\n<tr>\n<th>\u540d\u79f0</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u4f7f\u7528\u7ec4\u4ef6</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>\u914d\u7f6e\u529f\u80fd\u6743\u9650\u5217\u8868\uff0cPermissions\u6839\u636e\u8be5\u5217\u8868\u91cc\u9762\u662f\u5426\u5b58\u5728\u67d0\u6743\u9650\u540d\u79f0\u5224\u65ad\u7528\u6237\u662f\u5426\u5177\u6709\u8be5\u529f\u80fd\u6743\u9650\uff0c\u6765\u63a7\u5236\u5bf9\u5e94\u64cd\u4f5c\u884c\u4e3a</td>\n<td>array</td>\n<td>Permissions</td>\n</tr>\n<tr>\n<td>ajax</td>\n<td>\u7528\u4e8e\u53d1\u9001ajax\u8bf7\u6c42\u7684\u65b9\u6cd5\uff0c\u4e00\u822c\u60c5\u51b5\u4e0b\u5176\u5e94\u8be5\u662f\u4e00\u4e2aaxios\u5bf9\u8c61</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u548c\u540e\u7aef\u8fdb\u884c\u4e00\u4e9b\u4ea4\u4e92\u884c\u4e3a\u7684\u63a5\u53e3\u96c6\u5408</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.oss</td>\n<td>\u7528\u4e8e\u901a\u8fc7\u4e00\u4e2aossId\u5411\u540e\u7aefoss\u670d\u52a1\u83b7\u53d6\u4e00\u4e2a\u53ef\u4ee5\u8bbf\u95ee\u5230\u6307\u5b9a\u6587\u4ef6\u7684url</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.ossUpload</td>\n<td>\u7528\u4e8e\u5411oss\u670d\u52a1\u4e0a\u4f20\u4e00\u4e2a\u6587\u4ef6</td>\n<td>object</td>\n<td>FormInfo.Upload,FormInfo.Avatar</td>\n</tr>\n<tr>\n<td>features</td>\n<td>\u7528\u4e8e\u914d\u7f6e\u7cfb\u7edf\u7684\u7279\u6027\u53c2\u6570</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.profile</td>\n<td>\u7cfb\u7edf\u7684\u7279\u6027\u5217\u8868\u53c2\u8003\u7ec4\u4ef6Features</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.debug</td>\n<td>\u7279\u6027\u7684\u8c03\u8bd5\u6a21\u5f0f\uff0c\u53ef\u4ee5\u5728\u63a7\u5236\u53f0\u6253\u5370Features\u7684id\u548c\u72b6\u6001</td>\n<td>boolean</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>enums</td>\n<td>\u516c\u5171\u679a\u4e3e\u503c\uff0c\u8be6\u60c5\u53c2\u770bEnum\u7ec4\u4ef6</td>\n<td>object</td>\n<td>Enum</td>\n</tr>\n<tr>\n<td>enums.helperGuide</td>\n<td>\u5e2e\u52a9\u6587\u6863\u679a\u4e3e\u914d\u7f6e</td>\n<td>function</td>\n<td>HelperGuide</td>\n</tr>\n<tr>\n<td>formInfo</td>\n<td>\u8868\u5355\u914d\u7f6e</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n<tr>\n<td>formInfo.rules</td>\n<td>\u8868\u5355\u89c4\u5219\u914d\u7f6e</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n</tbody>\n</table>\n<p>\u5168\u5c40context\u7ba1\u7406\u8bbe\u7f6e\u53ca\u9ed8\u8ba4\u6837\u5f0f</p>\n<ul>\n<li>\u8bf7\u5c06\u5168\u5c40\u8986\u76d6\u6027\u7684\u6837\u5f0f\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8bf7\u5c06\u5b57\u4f53\u6587\u4ef6\u7684\u5f15\u7528\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8bf7\u5c06antd\u7684\u8986\u76d6\u6027\u6837\u5f0f\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8be5\u7ec4\u4ef6\u9700\u8981\u653e\u7f6e\u5728\u5e94\u7528\u6839\u4f4d\u7f6e</li>\n</ul>\n<p>\u66f4\u65b0\u5b57\u4f53\u6587\u4ef6:</p>\n<ul>\n<li>\u5c06iconfont\u4e0a\u4e0b\u8f7d\u7684\u5b57\u4f53\u5305\u89e3\u538b\u540e\u653e\u5728public\u6587\u4ef6\u5939\u4e0b\u9762</li>\n<li>\u66f4\u65b0src/common/params.js \u4e2d\u7684\u53d8\u91cf iconfontBase</li>\n<li>\u4fee\u6539\u540e\u6784\u5efa\u8be5\u9879\u76ee\u53d1\u5e03\u5230\u5bf9\u5e94\u73af\u5883</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>preset</td>\n<td>\u5168\u5c40\u9884\u8bbe\u53c2\u6570\uff0c\u53ef\u4ee5\u901a\u8fc7usePreset\u83b7\u53d6\uff0c\u7531\u4e1a\u52a1\u7cfb\u7edf\u8bbe\u7f6e</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>themeToken</td>\n<td>\u8bbe\u7f6e\u4e3b\u9898\uff0c\u53c2\u770bantd\u7684themeToken\uff0c\u4e00\u822c\u53ea\u9700\u8981\u8bbe\u7f6e{colorPrimary}</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>init</td>\n<td>\u521d\u59cb\u5316\u65b9\u6cd5\uff0c\u5728\u7cfb\u7edf\u9996\u6b21\u52a0\u8f7d\u65f6\u6267\u884c\uff0c\u53ef\u4ee5\u8fd4\u56dePromise\u3002\u7528\u6765\u653e\u7f6e\u7cfb\u7edf\u663e\u793a\u4e4b\u524d\u7684\u5f02\u6b65\u64cd\u4f5c</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PureGlobal</h3>\n<p>api\u540cGlobal\uff0c\u4f46\u662f\u5c11\u4e86\u9875\u9762\u9519\u8bef\u6355\u83b7\u548cclassName:container-body\u5e26\u6765\u7684\u9ed8\u8ba4\u6700\u5c0f\u5bbd\u5ea6\u7b49\u6837\u5f0f\u8bbe\u7f6e\uff0c\u4e3b\u8981\u7528\u5728\u7ec4\u4ef6\u5e93\u7684\u6f14\u793a\u73af\u5883\u548c\u5f39\u7a97\u4e2d</p>\n<h3>usePreset</h3>\n<p>\u83b7\u53d6\u9884\u8bbe\u7684preset\uff0c\u5df2\u7ecf\u786e\u5b9a\u4e3a\u7cfb\u7edf\u9700\u8981\u4f7f\u7528\u7684key\u503c:permissions,apis,formOptions,modalOptions</p>\n<h3>useGlobalContext</h3>\n<p>\u83b7\u53d6\u548c\u8bbe\u7f6e\u5168\u5c40\u72b6\u6001\uff0c\u8be5\u72b6\u6001\u4fdd\u5b58\u5728Global\u7ec4\u4ef6\u4e00\u7ea7\uff0c\u4e0d\u4f1a\u968f\u7740\u5185\u90e8\u7ec4\u4ef6\u672c\u8eab\u7684\u9500\u6bc1\u800c\u9500\u6bc1\u3002\n\u4e3b\u8981\u7ed9\u7ec4\u4ef6\u5185\u90e8\u4f7f\u7528\uff0c\u4e1a\u52a1\u5e94\u8be5\u907f\u514d\u4f7f\u7528\u8be5api\u8bbe\u7f6e\u65b0\u7684global\u53d8\u91cf\u3002\u4e1a\u52a1\u5982\u679c\u6709\u9700\u8981\u5e94\u5f53\u81ea\u884c\u5728\u9876\u7ea7\u7ec4\u4ef6\u4e2d\u8bbe\u7f6econtext\u3002</p>\n<h4>params:useGlobalContext(globalKey)</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>globalKey</td>\n<td>\u5168\u5c40\u53c2\u6570\u7684key\uff0c\u5f53\u5b58\u5728globalKey\u65f6\uff0c\u9ed8\u8ba4\u83b7\u53d6\u548c\u8bbe\u7f6e\u90fd\u662fglobal[key]\uff0c\u5f53\u4e0d\u5b58\u5728globalKey\u83b7\u53d6\u548c\u8bbe\u7f6e\u7684\u90fd\u662fglobal\uff0c\u9664\u975e\u5b58\u5728\u591a\u4e2a\u83b7\u53d6\u548c\u8bbe\u7f6eglobal\u7684key-value\uff0c\u5426\u5219\u4e0d\u63a8\u8350\u76f4\u63a5\u4f7f\u7528\u4e0d\u5b58\u5728globalKey\u7684\u60c5\u51b5</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>return:{global,setGlobal}</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>global</td>\n<td>\u5f53\u524d\u7684global\u503c</td>\n<td>any</td>\n</tr>\n<tr>\n<td>setGlobal</td>\n<td>\u8bbe\u7f6e\u5f53\u524d\u7684global\u503c</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Global_4cc66",style:".Global_4cc66 .label {\n  font-weight: bold;\n}",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u6587\u5b57\u5927\u5c0f\u989c\u8272\u884c\u9ad8\u7684\u8bbe\u7f6e",code:"const { PureGlobal } = _Global;\nconst { Space, Divider } = antd;\nconst BaseExample = () => {\n    return (\n        <PureGlobal>\n            <Space direction=\"vertical\">\n                <div className=\"label\">\u6587\u5b57\u5927\u5c0f:</div>\n                <div style={{ fontSize: 'var(--font-size-large)' }}>\u5927\u53f7\u6587\u5b57</div>\n                <div>\u9ed8\u8ba4\u5927\u5c0f\u6587\u5b57</div>\n                <div style={{ fontSize: 'var(--font-size-small)' }}>\u5c0f\u53f7\u6587\u5b57</div>\n                <Divider />\n                <div className=\"label\">\u6587\u5b57\u989c\u8272:</div>\n                <div style={{ color: 'var(--font-color)' }}>\u9ed8\u8ba4\u989c\u8272</div>\n                <div style={{ color: 'var(--font-color-grey)' }}>\u7070\u8272</div>\n                <div style={{ color: 'var(--font-color-grey-1)' }}>\u7070\u82721</div>\n                <div style={{ color: 'var(--font-color-grey-2)' }}>\u7070\u82722</div>\n                <Divider />\n                <div className=\"label\">\u884c\u9ad8:</div>\n                <div style={{ lineHeight: 'var(--line-height-large)' }}>\n                    \u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\n                </div>\n                <div>\n                    \u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\n                </div>\n                <div style={{ lineHeight: 'var(--line-height-small)' }}>\n                    \u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\n                </div>\n            </Space>\n        </PureGlobal>\n    );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u8b66\u544a\u63d0\u793a",description:"\u5c55\u793a\u4e86\u8b66\u544a\u63d0\u793a\u7684\u8986\u76d6\u6837\u5f0f",code:'const { PureGlobal } = _Global;\nconst { Alert, Space } = antd;\nconst { default: Icon } = icon;\n\nconst BasicExample = () => {\n  return (\n    <PureGlobal>\n      <Space direction="vertical">\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988" type="success" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e" type="info" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f" type="warning" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988" type="error" showIcon />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          type="error"\n          showIcon\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="success"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="info"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="warning"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="success"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="info"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="warning"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          closable\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BasicExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o},{name:"icon",packageName:"@components/Icon",component:l}]},{title:"\u6309\u94ae",description:"\u5c55\u793a\u4e86\u6309\u94ae\u7684\u8986\u76d6\u6837\u5f0f",code:'const { PureGlobal } = _Global;\nconst { Button, Typography, Space } = antd;\nconst { default: Icon } = icon;\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal>\n      <Space direction="vertical">\n        <Space>\n          <Button size="large">\u5927\u6309\u94ae</Button>\n          <Button>\u9ed8\u8ba4\u6309\u94ae</Button>\n          <Button size="small">\u5c0f\u6309\u94ae</Button>\n        </Space>\n        <Space>\n          <Button type="primary">\u6309\u94ae</Button>\n          <Button type="link">\u6309\u94ae</Button>\n          <Button type="text">\u6309\u94ae</Button>\n        </Space>\n        <Space>\n          <Button danger>\u5371\u9669\u6309\u94ae</Button>\n          <Button type="primary" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="link" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="text" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n        </Space>\n        <Space>\n          <Button disabled>\u7981\u7528\u6309\u94ae</Button>\n          <Button type="primary" danger disabled>\n            \u7981\u7528\u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="link" disabled>\n            \u7981\u7528Link\u6309\u94ae\n          </Button>\n          <Button type="text" disabled>\n            \u7981\u7528Text\u6309\u94ae\n          </Button>\n        </Space>\n        <Space>\n          <Button type="text" icon={<Icon type="icon-tianjia" />}>\n            \u56fe\u6807\u6309\u94ae\n          </Button>\n          <Button type="text">\n            \u56fe\u6807\u6309\u94ae\u53f3\n            <Icon type="icon-arrow-thin-down" />\n          </Button>\n        </Space>\n        <Space>\n          <Button type="primary" icon={<Icon type="icon-tianjia" />} />\n          <Button icon={<Icon type="icon-tianjia" />} />\n          <Button danger icon={<Icon type="icon-tianjia" />} />\n          <Button type="link" icon={<Icon type="icon-tianjia" />} />\n          <Button type="text" icon={<Icon type="icon-tianjia" />} />\n        </Space>\n        <Space>\n          <Button type="primary" disabled icon={<Icon type="icon-tianjia" />} />\n          <Button disabled icon={<Icon type="icon-tianjia" />} />\n          <Button disabled danger icon={<Icon type="icon-tianjia" />} />\n          <Button disabled type="link" icon={<Icon type="icon-tianjia" />} />\n          <Button disabled type="text" icon={<Icon type="icon-tianjia" />} />\n        </Space>\n        <Space>\n          <Typography.Link>Link\u6587\u5b57</Typography.Link>\n          <Typography.Text className="ant-btn">\u6587\u5b57</Typography.Text>\n          <Typography.Link>\n            <Icon type="icon-tianjia" />\n            Link\u6587\u5b57\n          </Typography.Link>\n          <Typography.Text className="ant-btn">\n            <Icon type="icon-tianjia" />\n            \u6587\u5b57\n          </Typography.Text>\n          <Typography.Link className="ant-btn-dangerous">\n            Link\u6587\u5b57\n          </Typography.Link>\n        </Space>\n        <Space>\n          <Button className="btn-no-padding" type="link" size="large">\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link">\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="small">\n            \u5c0f\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text" size="large">\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text">\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text" size="small">\n            \u5c0f\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="large" danger>\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" danger>\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="small" danger>\n            \u5c0f\u6309\u94ae\n          </Button>\n        </Space>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o},{name:"icon",packageName:"@components/Icon",component:l}]},{title:"\u65e0\u8fb9\u6846\u6807\u7b7e",description:"\u5c55\u793a\u4e86\u65e0\u8fb9\u6846\u6807\u7b7e",code:'const { PureGlobal } = _Global;\nconst { Tag, Space } = antd;\n\nconst BasicExample = () => {\n  return (\n    <PureGlobal>\n      <Space>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e1\n        </Tag>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e2\n        </Tag>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e3\n        </Tag>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BasicExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},91026:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(29556),o=t(8002),l=t(96252),d=t(87558);const r={name:"Tooltip",summary:"<p>\u7b80\u5355\u7684\u6587\u5b57\u63d0\u793a\u6c14\u6ce1\u6846</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>\u9ed8\u8ba4\u5bbd\u5ea6 360\uff0csmall \u5bbd\u5ea6 240</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u6807\u9898\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showInfo</td>\n<td>\u5c55\u793a\u6807\u9898\u65c1\u7684\u63d0\u793a\u6309\u94ae</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfo</td>\n<td>\u91cd\u8981\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfoType</td>\n<td>\u91cd\u8981\u5185\u5bb9\u7c7b\u578b\uff0csuccess,error,warning</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>moreInfo</td>\n<td>\u5176\u4ed6\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>TooltipFetch</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>\u83b7\u53d6\u6570\u636e\u7684\u63a5\u53e3\uff0c\u53c2\u8003@kne/react-fetch</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>fetchContent</td>\n<td>\u5f53api\u63a5\u53e3\u8fd4\u56de\u503c\u7684\u65f6\u5019\u8c03\u7528\uff0c\u53ef\u4ee5\u83b7\u53d6\u5230\u63a5\u53e3\u53c2\u6570\uff0c\u8fd4\u56de\u503c\u4f1a\u66f4\u65b0\u5230Tootip\u7684\u53c2\u6570\u4e2d</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Tooltip_c9830",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Tooltip, TooltipInfoLabel } = _Tooltip;\nconst { default: Space } = space;\nconst {\n  default: FormInfo,\n  Form,\n  Input,\n  TypeDateRangePicker,\n  SubmitButton,\n  CancelButton,\n} = formInfo;\n\nconst MoreInfo = () => {\n  return (\n    <Form>\n      <FormInfo\n        column={1}\n        list={[\n          <Input label="\u59d3\u540d" name="name" rule="REQ" />,\n          <TypeDateRangePicker\n            name="type_date"\n            label="\u65e5\u671f\u65f6\u95f4\u6bb5"\n            rule="REQ"\n          />,\n          <Space\n            style={{\n              width: "100%",\n              justifyContent: "end",\n            }}\n          >\n            <CancelButton>\u53d6\u6d88</CancelButton>\n            <SubmitButton>\u786e\u5b9a</SubmitButton>\n          </Space>,\n        ]}\n      />\n    </Form>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <Tooltip content="\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f">\u5c0f\u6bb5\u4fe1\u606f</Tooltip>\n      <Tooltip\n        size="small"\n        content="\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\uff0c\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\uff0c\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u3002"\n      >\n        \u5927\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip title="\u6807\u9898" content="\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u3002">\n        \u5e26\u6709\u6807\u9898\u7684\u5c0f\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip\n        title="\u6807\u9898"\n        content="\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0"\n      >\n        \u5e26\u6709\u6807\u9898\u7684\u5927\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip\n        importantInfo="\u7b5b\u9009\u65e5\u671f\u8303\u56f4\u5185\uff0c\u804c\u4f4d\u4e0a\u5b89\u6392\u987e\u95ee\u9762\u8bd5\u7684\u5019\u9009\u4eba\u603b\u6570\u3002\u6839\u636e\u6240\u586b\u5199\u7684\u987e\u95ee\u3010\u9762\u8bd5\u9762\u8bd5\u3011\u65f6\u95f4\u6765\u8fdb\u884c\u7edf\u8ba1\uff0c\u800c\u975e\u5728\u7cfb\u7edf\u7684\u64cd\u4f5c\u65f6\u95f4\u3002"\n        subtitle="\u793a\u4f8b:"\n        content="2022.10.21\u5728\u7cfb\u7edf\u64cd\u4f5c\u987e\u95ee\u9762\u8bd5\uff0c\u4f46\u586b\u5199\u7684\u987e\u95ee\u9762\u8bd5\u65f6\u95f4\u4e3a2022.10.20\uff0c\u5219\u6570\u636e\u4f1a\u7edf\u8ba1\u57282022.10.20\uff0c\u800c\u975e2022.10.21 \u3002"\n      >\n        \u5e26\u6709\u91cd\u8981\u4fe1\u606f\n      </Tooltip>\n      <TooltipInfoLabel\n        title="\u5e26\u6709Info\u4fe1\u606f"\n        tooltipTitle={{\n          importantInfo:\n            "\u7b5b\u9009\u65e5\u671f\u8303\u56f4\u5185\uff0c\u804c\u4f4d\u4e0a\u5b89\u6392\u987e\u95ee\u9762\u8bd5\u7684\u5019\u9009\u4eba\u603b\u6570\u3002\u6839\u636e\u6240\u586b\u5199\u7684\u987e\u95ee\u3010\u9762\u8bd5\u9762\u8bd5\u3011\u65f6\u95f4\u6765\u8fdb\u884c\u7edf\u8ba1\uff0c\u800c\u975e\u5728\u7cfb\u7edf\u7684\u64cd\u4f5c\u65f6\u95f4\u3002",\n          subtitle: "\u793a\u4f8b:",\n          content:\n            "2022.10.21\u5728\u7cfb\u7edf\u64cd\u4f5c\u987e\u95ee\u9762\u8bd5\uff0c\u4f46\u586b\u5199\u7684\u987e\u95ee\u9762\u8bd5\u65f6\u95f4\u4e3a2022.10.20\uff0c\u5219\u6570\u636e\u4f1a\u7edf\u8ba1\u57282022.10.20\uff0c\u800c\u975e2022.10.21 \u3002",\n        }}\n      />\n      <Tooltip\n        trigger="click"\n        title="\u6807\u9898"\n        content="\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9"\n        moreInfo={<MoreInfo />}\n      >\n        \u5e26\u6709\u8868\u5355\u4fe1\u606f\n      </Tooltip>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Tooltip",packageName:"@components/Tooltip",component:a},{name:"space",packageName:"antd/lib/space",component:o},{name:"formInfo",packageName:"@components/FormInfo",component:l}]},{title:"\u5e26\u6709\u8fdc\u7a0b\u6570\u636e\u52a0\u8f7d\u7684\u63d0\u793a",description:"\u5c55\u793a\u5e26\u6709\u8fdc\u7a0b\u6570\u636e\u52a0\u8f7d\u7684\u63d0\u793a",code:'const { TooltipFetch } = _Tooltip;\nconst { preset } = reactFetch;\nconst { default: Descriptions } = _Descriptions;\nconst { default: StateTag } = _StateTag;\n\npreset({\n  ajax: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              clientName: "\u817e\u8baf",\n              title: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n              type: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968",\n              date: "2022-08-15",\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n});\n\nconst BaseExample = () => {\n  return (\n    <TooltipFetch\n      api={{\n        url: "/api/data",\n      }}\n      size="large"\n      fetchContent={(data) => {\n        return {\n          content: (\n            <Descriptions\n              dataSource={[\n                [\n                  { label: "\u5ba2\u6237\u540d\u79f0", content: data.clientName },\n                  { label: "\u53d1\u7968\u62ac\u5934", content: data.title },\n                ],\n                [\n                  { label: "\u53d1\u7968\u7c7b\u578b", content: data.type },\n                  { label: "\u53d1\u7968\u65e5\u671f", content: data.date },\n                ],\n              ]}\n            />\n          ),\n        };\n      }}\n    >\n      <StateTag text="\u54c8\u54c8\u54c8" />\n    </TooltipFetch>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Tooltip",packageName:"@components/Tooltip",component:a},{name:"reactFetch",packageName:"@kne/react-fetch",component:d},{name:"_Descriptions",packageName:"@components/Descriptions",component:t(5633)},{name:"_StateTag",packageName:"@components/StateTag",component:t(3874)}]}]}}},91707:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(330),o=t(55199),l=t(21079);const d={name:"FlexBox",summary:"<p>\u7528\u4e8e\u6839\u636e\u76d2\u5b50\u5927\u5c0f\u54cd\u5e94\u5f0f\u5c55\u793a\u4e0d\u540c\u5217</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"FlexBox_51df0",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FlexBox } = _FlexBox;\nconst { Card } = antd;\nconst BaseExample = () => {\n  return (\n    <FlexBox\n      dataSource={[\n        {\n          title: "Title 1",\n        },\n        {\n          title: "Title 2",\n        },\n        {\n          title: "Title 3",\n        },\n        {\n          title: "Title 4",\n        },\n        {\n          title: "Title 5",\n        },\n        {\n          title: "Title 6",\n        },\n      ]}\n      renderItem={(item) => (\n        <FlexBox.Item>\n          <Card title={item.title}>Card content</Card>\n        </FlexBox.Item>\n      )}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FlexBox",packageName:"@components/FlexBox",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:"const { default: FlexBox } = _FlexBox;\nconst { Card, Button } = antd;\nconst { range } = lodash;\nconst { useRef } = React;\nconst BaseExample = () => {\n  const ref = useRef();\n  return (\n    <div>\n      <FlexBox.Fetch\n        ref={ref}\n        getFetchApi={({ size }) => {\n          return {\n            data: {\n              pageSize: size,\n            },\n            loader: ({ data }) => {\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve({\n                    pageData: range(0, data.pageSize).map((index) => {\n                      return {\n                        key: index,\n                        title: `\u7b2c${index}\u9879`,\n                      };\n                    }),\n                  });\n                }, 1000);\n              });\n            },\n          };\n        }}\n        renderItem={(item) => (\n          <FlexBox.Item>\n            <Card title={item.title}>Card content</Card>\n          </FlexBox.Item>\n        )}\n      />\n      <Button\n        onClick={() => {\n          console.log(ref.current);\n        }}\n      >\n        \u83b7\u53d6FetchApi\n      </Button>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_FlexBox",packageName:"@components/FlexBox",component:a},{name:"antd",packageName:"antd",component:o},{name:"lodash",packageName:"lodash",component:l}]}]}}},93314:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(24666),o=t(55199);const l={name:"HistoryStore",summary:"<p>\u5386\u53f2\u8bb0\u5f55\u63d0\u793a</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"HistoryStore_a963f",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: HistoryStore } = _HistoryStore;\nconst { Input } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, setValue] = useState("");\n  return (\n    <HistoryStore\n      onSelect={(value) => {\n        setValue(value);\n      }}\n    >\n      {({ appendHistory, openHistory }) => (\n        <Input.Search\n          value={value}\n          onChange={(e) => {\n            setValue(e.target.value);\n          }}\n          onFocus={openHistory}\n          onSearch={(value) => {\n            appendHistory({\n              value,\n              label: value,\n            });\n          }}\n        />\n      )}\n    </HistoryStore>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_HistoryStore",packageName:"@components/HistoryStore",component:a},{name:"antd",packageName:"antd",component:o}]}]}}}}]);
-//# sourceMappingURL=2242.59326c7a.chunk.js.map
+"use strict";(self.webpackChunk_kne_components_components_core=self.webpackChunk_kne_components_components_core||[]).push([[2242,2723],{5633:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.Descriptions});t(55664);var a=t(87923)},9745:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(50196),o=t(13050),l=t(63743);const d={name:"FilePreview",summary:"<p>\u6587\u4ef6\u9884\u89c8</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"FilePreview_143ff",style:"",list:[{title:"HtmlPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FilePreview, HtmlPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <HtmlPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/demo2.html"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"PdfPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { PdfPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <PdfPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/resume.pdf"}\n      renderTextLayer={true}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"TextPreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { TextPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <TextPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/demo.txt"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"ImagePreview",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { ImagePreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <ImagePreview url={getPublicPath("components-core") + "/mock/resume.png"} />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"unknown",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { UnknownPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <UnknownPreview url={getPublicPath("components-core") + "/mock/demo.des"} />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o}]},{title:"office",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {default: FilePreview} = _FilePreview;\nconst {getPublicPath} = remoteLoader;\nconst {PureGlobal} = _Global;\nconst BaseExample = () => {\n    return (\n        <PureGlobal\n            preset={{\n                apis: {\n                    file: {\n                        getUrl: {\n                            loader:()=>{\n                                return "http://ieee802.org:80/secmail/docIZSEwEqHFr.doc";\n                            },\n                        },\n                    },\n                },\n            }}\n        >\n            <FilePreview\n                id="63bb2013-c743-4d2d-9d91-935c865f1c4d"\n                originName="docIZSEwEqHFr.doc"\n            />\n        </PureGlobal>\n    );\n};\n\nrender(<BaseExample/>);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]},{title:"audio",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { AudioPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <AudioPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/audio.wav"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]},{title:"video",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { VideoPreview } = _FilePreview;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <VideoPreview\n      maxWidth={900}\n      url={getPublicPath("components-core") + "/mock/video.mp4"}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FilePreview",packageName:"@components/FilePreview",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"_Global",packageName:"@components/Global",component:l}]}]}}},12027:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(87227),o=t(55199);const l={name:"StateBar",summary:"<p>\u7528\u4e8e State Bar</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stateOption</td>\n<td>state\u64cd\u4f5c\u5217\u8868</td>\n<td>string</td>\n<td>{key: string, tab: ReactNode}[]</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>\u5f53\u524d\u6fc0\u6d3b tab \u9762\u677f\u7684 key</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>\u5f53\u524dtab\u5c55\u793a\u6837\u5f0f</td>\n<td>'tab'\u3001'radio'\u3001'step'</td>\n<td>'tab'</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u4e8b\u4ef6\u8fd4\u56de\u9009\u4e2d\u7684key</td>\n<td>(value: string) =&gt; void</td>\n<td></td>\n</tr>\n<tr>\n<td>tabBarExtraContent</td>\n<td>\u5c55\u793a\u5728state bar\u53f3\u4fa7</td>\n<td>ReactNode</td>\n<td>null</td>\n</tr>\n<tr>\n<td>isInner</td>\n<td>\u5e95\u90e8\u7ebf\u5ef6\u5c55\u81f3\u603b\u957f</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<h3>Mapping</h3>\n<h4>stateOption</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>key</td>\n<td>\u5bf9\u5e94 activeKey</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>tab</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u6587\u5b57</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"StateBar_de00a",style:"",list:[{title:"State Bar",description:"State Bar",code:'const { default: StateBar } = _StateBar;\nconst { Button, Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [size, setSize] = useState("default");\n  const [isInner, setIsInner] = useState(false);\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={isInner}\n        options={[\n          { label: "inner", value: true },\n          { label: "normal", value: false },\n        ]}\n        onChange={(e) => {\n          setIsInner(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          { label: "large", value: "large" },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <StateBar\n        size={size}\n        isInner={isInner}\n        stateOption={[\n          { tab: "\u5168\u90e8", key: "1" },\n          { tab: "\u79d1\u76ee\u4e00", key: "2" },\n          {\n            tab: "\u79d1\u76ee\u4e8c",\n            key: "3",\n          },\n          { tab: "\u79d1\u76ee\u4e09", key: "4" },\n          { tab: "\u79d1\u76ee\u56db", key: "5" },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Radio State Bar",description:"Radio State Bar",code:'const { default: StateBar } = _StateBar;\nconst { Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseStateExample = () => {\n  const [size, setSize] = useState("default");\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          { label: "large", value: "large" },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <StateBar\n        size={size}\n        type="radio"\n        stateOption={[\n          { tab: "\u5168\u90e8", key: "1" },\n          { tab: "\u79d1\u76ee\u4e00", key: "2" },\n          { tab: "\u79d1\u76ee\u4e8c", key: "3" },\n          { tab: "\u79d1\u76ee\u4e09", key: "4" },\n          { tab: "\u79d1\u76ee\u56db", key: "5" },\n          { tab: "\u79d1\u76ee\u4e001", key: "22" },\n          { tab: "\u79d1\u76ee\u4e8c2", key: "33" },\n          { tab: "\u79d1\u76ee\u4e093", key: "44" },\n          { tab: "\u79d1\u76ee\u56db4", key: "55", style: { cursor: "copy" } },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseStateExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Step State Bar",description:"Step State Bar",code:'const { default: StateBar } = _StateBar;\n\nconst BaseStateExample = () => {\n  return (\n    <StateBar\n      type="step"\n      stateOption={[\n        { tab: "\u5168\u90e8", key: "1" },\n        { tab: "\u79d1\u76ee\u4e00", key: "2" },\n        { tab: "\u79d1\u76ee\u4e8c", key: "3" },\n        { tab: "\u79d1\u76ee\u4e09", key: "4" },\n        { tab: "\u79d1\u76ee\u56db", key: "5" },\n        { tab: "\u79d1\u76ee\u4e001", key: "22" },\n        { tab: "\u79d1\u76ee\u4e8c2", key: "33" },\n        { tab: "\u79d1\u76ee\u4e093", key: "44" },\n        { tab: "\u79d1\u76ee\u56db4", key: "55", className: "last" },\n      ]}\n      tabBarExtraContent={<div>\u6d4b\u8bd5</div>}\n    />\n  );\n};\n\nrender(<BaseStateExample />);\n\n',scope:[{name:"_StateBar",packageName:"@components/StateBar",component:a}]}]}}},17540:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(63361),o=t(63743),l=t(53132),d=t(94679),r=t(55199);const i={name:"Features",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u7cfb\u7edf\u4e2d\u9700\u8981\u901a\u8fc7\u4e00\u4e9b\u6761\u4ef6\uff0c\u7cfb\u7edf\u6027\u5730\u8ba9\u6574\u4e2a\u7cfb\u7edf\u7684\u67d0\u4e9b\u529f\u80fd\u5c4f\u853d\u6216\u8005\u6709\u53e6\u5916\u7684\u4e00\u4e9b\u5c55\u73b0\u65b9\u5f0f\uff0c\u53ef\u4ee5\u7528\u8be5\u7ec4\u4ef6\u6765\u5b9e\u73b0</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u5168\u5c40\u6027\u914d\u7f6e\uff0c\u4e00\u6b21\u6027\u58f0\u660e\uff0c\u907f\u514d\u5c06\u5404\u79cd\u5224\u65ad\u8bed\u53e5\u6563\u843d\u5728\u9879\u76ee\u5404\u5904\u9020\u6210\u96be\u4ee5\u7ef4\u62a4</li>\n<li>\u5177\u6709\u7279\u5f81\u5224\u65ad\u548c\u4f9d\u8d56\u6027\u5224\u65ad\uff0c\u5373\u5f53\u7cfb\u7edf\u63cf\u8ff0\u6027\u6587\u4ef6\u4e2d\u542b\u6709\u67d0\u4e2a\u6a21\u5757\u4e14\u542b\u6709\u6240\u6709\u4f9d\u8d56\u9879\u6a21\u5757\u5219\u5224\u65ad\u8be5\u7ec4\u4ef6\u4e3a\u6b63\u5e38\u72b6\u6001\uff0c\u5176\u4ed6\u60c5\u51b5\u4e3a\u5173\u95ed\u72b6\u6001</li>\n<li>\u53ef\u4ee5\u901a\u8fc7\u914d\u7f6e\u6587\u4ef6\u7ed9\u6b63\u5e38\u72b6\u6001\u548c\u5173\u95ed\u72b6\u6001\u7684\u7ec4\u4ef6\u4f20\u9012\u4e0d\u540c\u7684props\u6765\u63a7\u5236\u4e24\u79cd\u72b6\u6001\u4e0b\u7ec4\u4ef6\u7684\u4e0d\u540c\u903b\u8f91</li>\n<li>\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\uff0c\u7ec4\u4ef6\u7684id\u662f\u7b80\u5199\uff0c\u53ea\u9700\u8981\u4fdd\u8bc1\u540c\u4e00\u5c42\u7ea7\u7684\u7ec4\u4ef6id\u4e0d\u91cd\u590d\u5c31\u53ef\u4ee5\u4e86\uff0c\u5b83\u7684\u771f\u5b9eid\u4f1a\u901a\u8fc7\u5176\u6240\u5728\u7684\u4e0a\u4e0b\u7ea7\u5173\u7cfb\uff0c\u901a\u8fc7\u5192\u53f7\u5c06\u6bcf\u4e00\u5c42\u7684\u7ec4\u4ef6id\u94fe\u63a5\u8d77\u6765\u7ec4\u6210\u5176\u771f\u5b9e\u7684id\uff0c\u4f60\u53ef\u4ee5\u6253\u5f00\u8c03\u8bd5\u6a21\u5f0f\u67e5\u770b\u6bcf\u4e00\u4e2a\u7ec4\u4ef6\u5b9e\u9645\u8fd0\u884c\u65f6\u7684id\u548c\u5224\u65ad\u72b6\u6001</li>\n<li>\u7ec4\u4ef6\u7684type\u53ef\u4ee5\u8bbe\u7f6e\u4e3a\u4e09\u79cd\uff1asystem,module,feature\u3002system\u4e3a\u914d\u7f6e\u6587\u4ef6\u6700\u9876\u7ea7\u7ec4\u4ef6\uff0cmodule\u4e3a\u529f\u80fd\u6a21\u5757\uff0c\u9ed8\u8ba4Layout\u7684Page\u7ec4\u4ef6openFeatures\u4e3atrue\u65f6\u5b83\u7684name\u4f1a\u88ab\u8bbe\u7f6e\u6210module\uff0cfeature\u4e3a\u5177\u4f53\u7684\u529f\u80fd\u9879</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6a21\u5757\u6216\u529f\u80fdid\uff0c\u901a\u8fc7Global\u91cc\u9762\u7684preset\u7684features\u914d\u7f6e\u786e\u5b9a\u8be5\u6a21\u5757\u5f00\u542f\u6216\u8005\u5173\u95ed</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>features \u53c2\u6570\u8bbe\u7f6e</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>debug</td>\n<td>\u662f\u5426\u5f00\u542f\u8c03\u8bd5\u6a21\u5f0f\uff0c\u5f00\u542f\u540e\u63a7\u5236\u53f0\u4f1a\u6253\u5370\u6240\u6709\u6a21\u5757\u7684id\u548c\u5224\u65ad\u7ed3\u679c</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>profile</td>\n<td>\u6a21\u5757\u914d\u7f6e\u5217\u8868\uff0c\u5177\u4f53\u53c2\u8003\u4e0b\u9762profile\u53c2\u6570\u8bf4\u660e</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>profile\u53c2\u6570\u8bf4\u660e</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6a21\u5757\u7684\u552f\u4e00\u6807\u8bc6\u7b26\uff0c\u9700\u8981\u4fdd\u8bc1\u5728\u5f53\u524d\u4e00\u7ea7\u4e2d\u4e0d\u91cd\u590d\uff0c\u5b9e\u9645id\u4e3a\u6240\u6709\u7236\u7ea7\u7684id\u7528\u2019:\u2018\u94fe\u63a5\u7684\u5b57\u7b26\u4e32</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>\u53ef\u80fd\u53d6\u503c\u4e3asystem,module,feature\uff0c\u6ce8\u610f\u6700\u5916\u5c42\u7684type\u5fc5\u987b\u4e3asystem</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>\u6a21\u5757\u7684\u4e2d\u6587\u540d\u79f0\uff0c\u4e0d\u53c2\u4e0e\u5224\u65ad\uff0c\u53ea\u6807\u8bc6\u6a21\u5757\u540d\u5e2e\u52a9\u5f00\u53d1\u8005\u8bc6\u522b</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>close</td>\n<td>\u6a21\u5757\u662f\u5426\u5173\u95ed\uff0c\u53ef\u4ee5\u7f3a\u7701\u8be5\u503c\uff0c\u7f3a\u7701\u65f6profile\u91cc\u9762\u5b58\u5728\u67d0id\u7684\u6a21\u5757\u5373\u4e3a\u6a21\u5757\u5f00\u542f\uff0c\u4e0d\u5b58\u5728\u5373\u4e3a\u5173\u95ed\u3002\u5728\u7279\u6b8a\u60c5\u51b5\u4e0b\uff0c\u5728profile\u5b58\u5728\u8be5\u6a21\u5757\u914d\u7f6e\u4f46\u662f\u5e0c\u671b\u5176\u5173\u95ed\u65f6\u53ef\u4ee5\u663e\u793a\u6307\u5b9a\u8be5\u53c2\u6570\u4e3atrue\u6765\u5173\u95ed\u6a21\u5757</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>dependencies</td>\n<td>\u4f9d\u8d56\u6a21\u5757\u5217\u8868\uff0c\u6bcf\u4e00\u9879\u4e3a\u4e00\u4e2a\u6a21\u5757id\uff08\u8be5id\u5fc5\u987b\u4e3a\u5b8c\u6574\u7684id\u4e32\uff0c\u5373\u5e26\u6709\u6240\u6709\u7236\u7ea7id\u7684\u7528\u2019:\u2018\u94fe\u63a5\u8d77\u6765\u7684\u5b57\u7b26\u4e32\uff09,\u5f53\u6240\u6709id\u7684\u6307\u4ee3\u6a21\u5757\u90fd\u88ab\u5224\u65ad\u5f00\u542f\u65f6\uff0c\u8be5\u6a21\u5757\u88ab\u5224\u65ad\u4e3a\u5f00\u542f</td>\n<td>array[string]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>options</td>\n<td>\u6a21\u5757\u5f00\u542f\u65f6\u83b7\u53d6\u7684\u53c2\u6570</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rejectedOptions</td>\n<td>\u6a21\u5757\u5173\u95ed\u65f6\u83b7\u53d6\u7684\u53c2\u6570</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u88ab\u63a7\u5236\u7684\u6a21\u5757\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230({isPass,options})\u53c2\u6570 isPass\u4e3a\u6a21\u5757\u662f\u5426\u5f00\u542f\uff0coptions\u5728\u6a21\u5757\u5f00\u542f\u65f6\u4e3aoptions\u53c2\u6570\uff0c\u5728\u6a21\u5757\u5173\u95ed\u65f6\u4e3arejectedOptions\u53c2\u6570\uff0c\u5176\u4e0d\u4e3afunction\u7c7b\u578b\u65f6\u5f53\u6a21\u5757\u5173\u95ed\u5219\u4e0d\u663e\u793achildren\uff0c\u6a21\u5757\u5f00\u542f\u65f6\u6b63\u5e38\u663e\u793achildren</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"Features_98f77",style:"",list:[{title:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u4e00\u5f00\u542f\u529f\u80fd\u4e8c\u5173\u95ed\u7684\u60c5\u51b5",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u4e00\u5f00\u542f\u529f\u80fd\u4e8c\u5173\u95ed\u7684\u60c5\u51b5",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                    dependencies: ["erc:client"],\n                  },\n                ],\n              },\n              {\n                id: "position",\n                type: "module",\n                name: "\u804c\u4f4d",\n                children: [\n                  {\n                    id: "position-list",\n                    type: "feature",\n                    options: [],\n                    rejectedOptions: [],\n                  },\n                ],\n              },\n              {\n                id: "client",\n                type: "module",\n                name: "\u5ba2\u6237",\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <PermissionsPage name="home" openFeatures>\n          <Features id="test">\u529f\u80fd\u6a21\u5757\u4e00</Features>\n          <Features id="test2">\u529f\u80fd\u6a21\u5757\u4e8c</Features>\n        </PermissionsPage>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l}]},{title:"\u5c55\u793a\u4e86\u6253\u5f00\u9875\u9762\u7279\u6027\u914d\u7f6e\u5f00\u542f\u548c\u5173\u95ed\u7684\u60c5\u51b5",description:"\u5c55\u793a\u4e86\u6253\u5f00\u9875\u9762\u7279\u6027\u914d\u7f6e\u5f00\u542f\u548c\u5173\u95ed\u7684\u60c5\u51b5",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst { Route, Routes } = Router;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                  },\n                  {\n                    id: "test2",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd2",\n                    dependencies: ["erc:client"],\n                  },\n                ],\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Layout\n        navigation={{\n          isFixed: false,\n          list: [\n            {\n              key: "position",\n              title: "\u804c\u4f4d",\n              path: "/position",\n            },\n            {\n              key: "client",\n              title: "\u5ba2\u6237",\n              path: "/client",\n            },\n          ],\n        }}\n      >\n        <Routes>\n          <Route\n            index\n            element={\n              <PermissionsPage name="home" openFeatures>\n                home\u9875\u9762\u6a21\u5757\n                <div>\n                  <Features id="test">\u5f00\u542f\u6a21\u5757</Features>\n                  <Features id="test2">\u5173\u95ed\u6a21\u5757</Features>\n                </div>\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path="/position"\n            element={\n              <PermissionsPage name="position" openFeatures>\n                position\u9875\u9762\u6a21\u5757\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path="/client"\n            element={\n              <PermissionsPage name="client">\n                client\u9875\u9762\u6a21\u5757,\u672a\u6253\u5f00features\n              </PermissionsPage>\n            }\n          />\n        </Routes>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l},{name:"Router",packageName:"react-router-dom",component:d}]},{title:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u5f00\u542f\u548c\u5173\u95ed\u53c2\u6570\u83b7\u53d6",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7cfb\u7edf\u4e2d\u529f\u80fd\u5f00\u542f\u548c\u5173\u95ed\u53c2\u6570\u83b7\u53d6",code:'const { default: Features } = _Features;\nconst { default: Layout, PermissionsPage } = layout;\nconst { PureGlobal } = global;\nconst { useState } = React;\nconst { Button, Space } = antd;\nconst BaseExample = () => {\n  const [close, setClose] = useState(false);\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "home",\n                type: "module",\n                name: "\u9996\u9875",\n                children: [\n                  {\n                    id: "test",\n                    type: "feature",\n                    name: "\u6d4b\u8bd5\u529f\u80fd",\n                    options: {\n                      state: "\u5f00\u542f",\n                    },\n                    rejectedOptions: {\n                      state: "\u5173\u95ed",\n                    },\n                    close: close,\n                  },\n                ],\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Space direction="vertical">\n        <Button\n          onClick={() => {\n            setClose((value) => !value);\n          }}\n        >\n          \u5207\u6362\n        </Button>\n        <Layout navigation={{ isFixed: false }}>\n          <PermissionsPage name="home" openFeatures>\n            <Features id="test">\n              {({ isPass, options }) => {\n                return isPass\n                  ? "\u6a21\u5757\u5f00\u542f,options:" + JSON.stringify(options)\n                  : "\u6a21\u5757\u5173\u95ed,options:" + JSON.stringify(options);\n              }}\n            </Features>\n          </PermissionsPage>\n        </Layout>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Features",packageName:"@components/Features",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"layout",packageName:"@components/Layout",component:l},{name:"antd",packageName:"antd",component:r}]}]}}},18495:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"FetchButton",summary:"<p>\u7528\u4e8e\u70b9\u51fb\u540e\u52a0\u8f7d\u6570\u636e\u7684\u6309\u94ae</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"FetchButton_8e1c9",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FetchButton } = _FetchButton;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <FetchButton\n        api={{\n          loader: async () => {\n            return new Promise((resolve, reject) => {\n              setTimeout(() => {\n                resolve({ data: "xxxxx" });\n              }, 1000);\n            });\n          },\n        }}\n        onClick={(data) => {\n          console.log(data);\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </FetchButton>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FetchButton",packageName:"@components/FetchButton",component:t(86454)}]}]}}},20031:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(24474),o=t(13050),l=t(21079),d=t(55199);const r={name:"FileList",summary:"<p>\u6587\u4ef6\u5217\u8868\u5c55\u793a\uff0c\u9884\u89c8\uff0c\u4e0a\u4f20</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td></td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"FileList_a785a",style:"",list:[{title:"\u5b8c\u6574\u793a\u4f8b",description:"\u63d0\u4f9b\u4e00\u4e2a\u4e0a\u4f20\u6587\u4ef6\uff0c\u663e\u793a\u6587\u4ef6\u5217\u8868\uff0c\u9884\u89c8\u6587\u4ef6\u7684\u5c55\u793a",code:'const { default: FileList } = _FileList;\nconst { createWithRemoteLoader, getPublicPath } = remoteLoader;\nconst { useState } = React;\nconst { uniqueId } = lodash;\n\nconst ajax = {\n  postForm: (config) => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              id: "uBFNeYQBnHRXlZaTGZpA",\n              originalName: config.file.name,\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n};\n\nconst apis = {\n  onSave: async ({ data }) => {\n    return {\n      ossId: uniqueId("oss_"),\n      filename: data.originalName,\n      date: new Date(),\n      userName: "\u54c8\u54c8\u54c8",\n    };\n  },\n  onDelete: (item) => {},\n};\n\nconst preset = {\n  apis: {\n    file: {\n      getUrl: {\n        loader: async ({ params }) => {\n          const mapping = {\n            "01": "/avatar.png",\n            "02": "/mock/resume.pdf",\n            "03": "/mock/resume.pdf",\n          };\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(getPublicPath("components-core") + mapping["03"]);\n            }, 100);\n          });\n        },\n      },\n    },\n    previewOffice: {\n      loader: async () => {\n        return new Promise((resolve) => {\n          setTimeout(() => {\n            resolve({\n              name: "\u6d4b\u8bd5\u5f00\u53d1_\u590f\u6c38\u6631_\u672c\u79d1_5\u5e74.docx",\n              data: [\n                {\n                  id: "gWw26Y0BeK_D6zxND5vh",\n                  originalName: "attachment/gWw26Y0BeK_D6zxND5vh.pdf",\n                  url:\n                    getPublicPath("components-core") +\n                    "/mock/resume.pdf",\n                },\n              ],\n            });\n          }, 0);\n        });\n      },\n    },\n    ossUpload: ({ file }) => {\n      return ajax.postForm({ file });\n    },\n  },\n};\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-core:Global@PureGlobal"],\n})(({ remoteModules }) => {\n  const [PureGlobal] = remoteModules;\n  const [list, setList] = useState([\n    {\n      id: "1",\n      filename: "avatar.pdf",\n    },\n    {\n      id: "2",\n      filename: "\u6d4b\u8bd5\u5f00\u53d1_\u590f\u6c38\u6631_\u672c\u79d1_5\u5e74.docx",\n    },\n  ]);\n  return (\n    <PureGlobal preset={preset}>\n      <FileList\n        defaultPreviewFileId="1"\n        list={list}\n        setList={setList}\n        apis={apis}\n      />\n    </PureGlobal>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"lodash",packageName:"lodash",component:l}]},{title:"\u4e0a\u4f20\u6587\u4ef6\u5217\u8868",description:"\u5c55\u793a\u4e00\u4e2a\u4e0a\u4f20\u6587\u4ef6\u5c55\u793a\u4e0a\u4f20\u6210\u529f\u6587\u4ef6\u5217\u8868",code:'const { FileUpload } = _FileList;\nconst { createWithRemoteLoader, getPublicPath } = remoteLoader;\nconst { useState } = React;\nconst { uniqueId } = lodash;\n\nconst ajax = {\n  postForm: (config) => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              id: "uBFNeYQBnHRXlZaTGZpA",\n              originalName: config.file.name,\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n};\n\nconst apis = {\n  onSave: async ({ data }) => {\n    const id = uniqueId();\n    return {\n      ossId: id,\n      filename: data.originalName,\n      date: new Date(),\n      userName: "\u54c8\u54c8\u54c8",\n    };\n  },\n  onDelete: (item) => {},\n};\n\nconst preset = {\n  apis: {\n    file: {\n      getUrl: {\n        loader: async ({ params }) => {\n          const mapping = {\n            "01": "/avatar.png",\n            "02": "/mock/demo.html",\n            "03": "/mock/1_\u738b\u6676\u7b80\u5386-2023_06_2.pdf",\n          };\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(getPublicPath("components-core") + mapping["03"]);\n            }, 1000);\n          });\n        },\n      },\n    },\n    ossUpload: ({ file }) => {\n      return ajax.postForm({ file });\n    },\n  },\n};\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-core:Global@PureGlobal"],\n})(({ remoteModules }) => {\n  const [PureGlobal] = remoteModules;\n  const [list, setList] = useState([]);\n  return (\n    <PureGlobal preset={preset}>\n      <FileUpload list={list} setList={setList} apis={apis} />\n      <div>\u975e\u53d7\u63a7\u60c5\u51b5</div>\n      <FileUpload\n        setList={(fileList) => {\n          console.log(">>>>>>>>>>", fileList);\n        }}\n        apis={apis}\n      />\n    </PureGlobal>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:o},{name:"lodash",packageName:"lodash",component:l}]},{title:"\u62d6\u62fd\u4e0a\u4f20",description:"\u5c55\u793a\u4e00\u4e2a\u62d6\u62fd\u4e0a\u4f20\u6587\u4ef6\uff0c\u5f97\u5230File\u5bf9\u8c61",code:'const { DragArea, DragAreaOuter, UploadButton, DragButton } = _FileList;\nconst { Row, Col, Divider, Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <DragAreaOuter\n      title={\n        <Row>\n          <Col flex={1}>\u6807\u9898</Col>\n          <Col>\n            <Space split={<Divider type="vertical" />}>\n              <DragButton />\n              <UploadButton>\u4e0a\u4f20</UploadButton>\n            </Space>\n          </Col>\n        </Row>\n      }\n      onFileSelected={(fileList) => {\n        console.log(fileList);\n      }}\n    >\n      <DragArea />\n    </DragAreaOuter>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FileList",packageName:"@components/FileList",component:a},{name:"antd",packageName:"antd",component:d}]}]}}},21763:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(53132),o=t(63743),l=t(55199);const d={name:"Layout",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6bcf\u4e2a\u767b\u5f55\u540e\u7684\u7cfb\u7edf\u9875\u9762\u90fd\u5e94\u8be5\u5728Layout\u7684\u6846\u67b6\u4e4b\u4e0b\uff0c\u5b83\u5b9a\u4e49\u4e86\u9875\u9762\u7684\u57fa\u672c\u6846\u67b6\u3002\u6839\u636e\u8bbe\u8ba1\u5bf9\u4e8e\u9875\u9762\u7684\u4e0d\u540c\u8981\u6c42\uff0c\u9002\u5f53\u9009\u62e9\u4e0d\u540c\u7684\u7ec4\u5408</p>\n<h3>\u7279\u70b9</h3>\n<p>Layout\u5c06\u6574\u4e2a\u9875\u9762\u5212\u5206\u6210\u4ee5\u4e0b\u51e0\u4e2a\u533a\u57df</p>\n<ol>\n<li>\u5bfc\u822a\u533a</li>\n<li>\u5185\u5bb9\u533a</li>\n<li>\u5de6\u83dc\u5355\u533a</li>\n<li>\u53f3\u64cd\u4f5c\u533a</li>\n<li>\u9875\u5934\u533a</li>\n<li>\u9875\u5934\u4fe1\u606f\u533a</li>\n<li>\u9875\u9762\u6807\u9898\u533a</li>\n</ol>\n<p>\u901a\u8fc7\u7ed9Page\u914d\u7f6e\u4e0d\u540c\u7684\u53c2\u6570\u5b9e\u73b0\u4e0d\u540c\u533a\u57df\u7684\u663e\u793a</p>\n<h3>\u6ce8\u610f</h3>\n<ul>\n<li>Page\u7684name\u53c2\u6570\u5fc5\u987b\u8981\u4f20\uff0c\u7528\u6765\u5728\u9875\u9762\u8df3\u8f6c\u65f6\u786e\u5b9aPage\u662f\u4e0d\u662f\u540c\u4e00\u4e2a\uff0c\u51b3\u5b9a\u7740Page\u662f\u5426\u8d70install\u5468\u671f</li>\n<li>Page\u7ec4\u4ef6\u7684\u53c2\u6570\u662f\u901a\u8fc7Context\u4fdd\u5b58\u5728Layout\u4e2d\u7684\uff0c\u8fd9\u6837\u505a\u7684\u76ee\u7684\u662f\u4e3a\u4e86\u8ba9\u9875\u9762\u8df3\u8f6c\u65f6\uff0c\u9664\u9875\u9762\u533a\u4ee5\u5916\u7684\u533a\u57df\u5728\u524d\u540e\u4fe9\u9875\u9762\u5dee\u522b\u4e0d\u5927\u7684\u60c5\u51b5\u4e0b\u8d70\u66f4\u65b0\u5468\u671f\u800c\u4e0d\u662finstall\u5468\u671f\uff0c\u4ee5\u6b64\u5e26\u6765\u66f4\u5feb\u7684\u6e32\u67d3\u901f\u5ea6\u907f\u514d\u4e0d\u5fc5\u8981\u7684\u91cd\u590d\u5b89\u88c5\u548c\u5378\u8f7d</li>\n<li>\u8bf7\u5c3d\u91cf\u901a\u8fc7Page\u63d0\u4f9b\u7684\u53c2\u6570\u6765\u914d\u7f6e\u51fa\u8bbe\u8ba1\u8981\u6c42\u7684\u9875\u9762\uff0c\u4e0d\u8981\u81ea\u884c\u7528css\u5b9e\u73b0\uff0c\u4ee5\u4fbf\u4e8eLayout\u7ec4\u4ef6\u80fd\u4ece\u6574\u4f53\u63a7\u5236\u9875\u9762\u7684\u57fa\u672c\u5f62\u5f0f\u548c\u4e0d\u540c\u533a\u57df\u7684padding\u548cmargin\uff0c\u8ba9\u7cfb\u7edf\u66f4\u52a0\u7edf\u4e00\u5316\u6807\u51c6\u5316</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>navigation</td>\n<td>\u5bfc\u822a\u53c2\u6570\u53c2\u8003 Navigation \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u4e00\u822c\u653e\u7f6ePage\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Page</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>menu</td>\n<td>\u5de6\u83dc\u5355\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filter</td>\n<td>\u9875\u9762\u6807\u9898\u4f4d\u7f6e\u7b5b\u9009\u5668\u53c2\u6570,\u53c2\u8003 Filter \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>menuOpen</td>\n<td>\u5de6\u83dc\u5355\u662f\u5426\u9ed8\u8ba4\u6253\u5f00</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuWidth</td>\n<td>\u5de6\u83dc\u5355\u5bbd\u5ea6</td>\n<td>string</td>\n<td>240px</td>\n</tr>\n<tr>\n<td>menuFixed</td>\n<td>\u5de6\u83dc\u5355\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuCloseButton</td>\n<td>\u63a7\u5236\u5de6\u83dc\u5355\u663e\u793a\u9690\u85cf\u7684\u6309\u94ae\u662f\u5426\u663e\u793a</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>header</td>\n<td>\u9875\u5934\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>headerFixed</td>\n<td>\u9875\u5934\u533a\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>headerInfo</td>\n<td>\u9875\u5934\u4fe1\u606f\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>backUrl</td>\n<td>\u53f3\u4fa7\u5185\u5bb9\u533a\u7684\u6807\u9898\u524d\u5c55\u793a\u8fd4\u56de\u6309\u94ae\uff0c\u5e76\u8fd4\u56de\u5230\u8be5url</td>\n<td>\u53c2\u8003 useNavigate</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u9875\u9762\u6807\u9898</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleExtra</td>\n<td>\u9875\u9762\u6807\u9898\u533a\u53f3\u4fa7\u4f4d\u7f6e\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleLeftExtra</td>\n<td>\u9875\u9762\u6807\u9898\u533a\u5de6\u4fa7\u4f4d\u7f6e\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>noMargin</td>\n<td>\u9875\u9762\u5185\u5bb9\u533a\u662f\u5426\u53bb\u6389Margin</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>noPadding</td>\n<td>\u9875\u9762\u5185\u5bb9\u533a\u662f\u5426\u53bb\u6389Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>option</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>optionWidth</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5bbd\u5ea6</td>\n<td>string</td>\n<td>400px</td>\n</tr>\n<tr>\n<td>optionNoPadding</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u662f\u5426\u53bb\u6389Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFixed</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFooter</td>\n<td>\u53f3\u64cd\u4f5c\u533a\u5e95\u90e8\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openFeatures</td>\n<td>Page\u662f\u5426\u542f\u7528Features\uff0c\u542f\u7528\u65f6\u5982\u679c\u914d\u7f6e\u6587\u4ef6\u4e2d\u6ca1\u6709\u8be5\u6a21\u5757id\u5219\u5224\u65ad\u4e3a\u6a21\u5757\u5173\u95ed\uff0c\u4f1a\u5c06name\u4f5c\u4e3aFeatures\u7684id\u8fdb\u884c\u8bbe\u7f6e</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<h3>Affix</h3>\n<p>\u53ef\u4ee5\u63a7\u5236\u5176\u4e2d\u7684\u5185\u5bb9\u662f\u5426\u662ffixed\u5e03\u5c40</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>isFixed</td>\n<td>\u5185\u5bb9\u662f\u5426fixed\u5e03\u5c40</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>offsetTop</td>\n<td>\u8ddd\u79bb\u7a97\u53e3\u9876\u90e8\u8fbe\u5230\u6307\u5b9a\u504f\u79fb\u91cf\u540e\u89e6\u53d1</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>offsetBottom</td>\n<td>\u8ddd\u79bb\u7a97\u53e3\u5e95\u90e8\u8fbe\u5230\u6307\u5b9a\u504f\u79fb\u91cf\u540e\u89e6\u53d1</td>\n<td>number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u56fa\u5b9a\u72b6\u6001\u6539\u53d8\u65f6\u89e6\u53d1\u7684\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Menu</h3>\n<p>\u663e\u793a\u4e00\u4e2a\u83dc\u5355\uff0c\u6700\u591a\u652f\u6301\u4e24\u7ea7\uff0c\u652f\u6301\u7b2c\u4e00\u7ea7\u5c55\u5f00\u6536\u8d77\uff0c\u652f\u6301\u8def\u5f84\u5339\u914d\u81ea\u52a8\u9ad8\u4eae</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>\u83dc\u5355\u9879</td>\n<td>array[object]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>\u83dc\u5355\u9879\u663e\u793a\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>\u83dc\u5355\u9879\u7684key\u8981\u6c42\u5fc5\u987b\u552f\u4e00</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].iconType</td>\n<td>\u83dc\u5355\u9879\u524d\u9762\u7684icon\u7c7b\u578b\u53c2\u8003 Icon\u7ec4\u4ef6\u7684type\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].path</td>\n<td>\u83dc\u5355\u9879\u7684\u8def\u5f84</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].onClick</td>\n<td>\u83dc\u5355\u9879\u70b9\u51fb\u89e6\u53d1\u4e8b\u4ef6\uff0c\u6ce8\u610f\uff1a\u5982\u679c\u83dc\u5355\u9879\u5df2\u7ecf\u4f20\u5165path\u53c2\u6570\u5219\u8be5\u53c2\u6570\u4e0d\u751f\u6548</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>\u83dc\u5355\u9879\u7684\u7b2c\u4e8c\u7ea7\u9879\u5217\u8868\uff0c\u53c2\u8003items\u53c2\u6570\u3002\u6ce8\u610f\u8be5\u7ec4\u4ef6\u53ea\u652f\u6301\u4e24\u7ea7\u83dc\u5355\uff0c\u6240\u4ee5\u8be5\u53c2\u6570\u5185\u90e8\u7684\u83dc\u5355\u9879\u4e0d\u518d\u652f\u6301children\u53c2\u6570</td>\n<td>array[object]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>currentKey</td>\n<td>\u5f53\u524d\u88ab\u9009\u4e2d\u7684\u83dc\u5355\u9879\u7684key\uff0c\u5982\u679c\u83dc\u5355\u9879\u53c8path\u53c2\u6570\uff0c\u4e0d\u9700\u8981\u4f20\u9012\u8be5\u53c2\u6570\uff0c\u7ec4\u4ef6\u4f1a\u6839\u636e\u8def\u7531\u81ea\u52a8\u5224\u65ad\u9009\u4e2d\u9879</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>currentKey\u4ea7\u751f\u4fee\u6539\u65f6\u89e6\u53d1\u51fd\u6570\uff0c\u6ce8\u610f\uff1a\u5982\u679c\u83dc\u5355\u9879\u5df2\u7ecf\u4f20\u5165path\u53c2\u6570\u5219\u8be5\u53c2\u6570\u4e0d\u751f\u6548</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>allowCollapsed</td>\n<td>\u662f\u5426\u5141\u8bb8\u4e00\u7ea7\u83dc\u5355\u6536\u8d77</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>defaultOpenKeys</td>\n<td>\u521d\u59cb\u5c55\u5f00\u7684 SubMenu \u83dc\u5355\u9879 key \u6570\u7ec4</td>\n<td>string[]</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PermissionsPage</h3>\n<p>\u52a0\u5165\u6743\u9650\u5224\u65ad\u7684Page\uff0c\u9519\u8bef\u7c7b\u578b\u9ed8\u8ba4\u4e3aerror\uff0c\u5373\u5728\u8be5\u9875\u9762\u6ca1\u6709\u6743\u9650\u65f6\u663e\u793a\u9519\u8bef</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>\u6743\u9650\u5217\u8868\u53c2\u8003 Permissions \u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!0,className:"Layout_ebd9b",style:".Layout_ebd9b .layout-content {\n  color: #fff;\n  background: var(--primary-color-4);\n  height: 100%;\n  text-align: center;\n  line-height: 300px;\n}\n.Layout_ebd9b .with-title-layout-content {\n  height: 100%;\n}\n.Layout_ebd9b .layout-menu {\n  background: #ff9c6e;\n  color: #fff;\n  height: 110vh;\n  text-align: center;\n  line-height: 300px;\n}\n.Layout_ebd9b .header {\n  background: #ff9c6e;\n  height: 100px;\n  padding: 10px;\n  color: #fff;\n}\n.Layout_ebd9b .right-options {\n  background: var(--primary-color-4);\n  height: 110vh;\n  color: #fff;\n}\n.Layout_ebd9b .header-info {\n  padding: 10px;\n  height: 100px;\n  background: var(--primary-color-4);\n  color: #fff;\n}",list:[{title:"\u57fa\u7840\u4e0a\u4e0b\u5e03\u5c40",description:"\u5c55\u793a\u6700\u57fa\u7840\u7684\u4e0a\u5bfc\u822a\u680f\uff0c\u4e0b\u5185\u5bb9\u7684\u5e03\u5c40",code:'const { default: Layout, Page } = _Layout;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        enums: {\n          helperGuide: () => [\n            {\n              value: "base-detail",\n              content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863",\n              url: "/",\n            },\n          ],\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <Page name="base" helperGuideName="base-detail">\n          <div className="layout-content">\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Layout",packageName:"@components/Layout",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5e26\u6709\u5de6\u4fa7\u83dc\u5355\u5e03\u5c40",description:"\u5c55\u793a\u5e26\u6709\u5de6\u4fa7\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page, Menu } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        name="left-menu"\n        menuFixed={false}\n        menu={\n          <Menu\n            items={[\n              {\n                label: "\u7236\u7ea7\u6807\u98981",\n                key: "p-0",\n                iconType: "icon-zhanghaodenglu",\n                children: [\n                  {\n                    label: "\u5b50\u6807\u98981",\n                    key: "s-0",\n                    path: "/link1",\n                  },\n                  {\n                    label: "\u5b50\u6807\u98982",\n                    key: "s-1",\n                    path: "/link2",\n                  },\n                ],\n              },\n              {\n                label: "\u7236\u7ea7\u6807\u98982",\n                key: "p-1",\n                iconType: "icon-zhanghaodenglu",\n                children: [\n                  {\n                    label: "\u5b50\u6807\u98981",\n                    key: "s-2",\n                    path: "/link3",\n                  },\n                  {\n                    label: "\u5b50\u6807\u98982",\n                    key: "s-3",\n                    path: "/link4",\n                  },\n                ],\n              },\n              {\n                label: "\u7236\u7ea7\u6807\u98983",\n                key: "p-2",\n                iconType: "icon-zhanghaodenglu",\n                path: "/link5",\n              },\n            ]}\n          />\n        }\n        titleExtra={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        backUrl={"/"}\n        title="\u6807\u9898"\n      >\n        <div className="layout-content with-title-layout-content">\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5de6\u4fa7\u56fa\u5b9a\u5e26Header",description:"\u5c55\u793a\u5e26\u6709header\u7684\u5de6\u4fa7\u56fa\u5b9a\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Space className="container" direction="vertical">\n      <Layout navigation={{ isFixed: false }}>\n        <Page\n          name="with-header"\n          helperGuideName="base-detail"\n          menu={<div className="layout-menu">\u5de6\u4fa7\u83dc\u5355\u533a</div>}\n          titleExtra={\n            <Space>\n              <Button type="primary">\u65b0\u5efa</Button>\n            </Space>\n          }\n          title="\u6807\u9898"\n          hideCloseSvg={true}\n          headerHeight="40px"\n          menuFixed={false}\n          header={<div className="header">header</div>}\n          headerFixed={false}\n          headerInfo={<div className="header-info">header info\u533a\u57df</div>}\n        >\n          <div>\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      enums: {\n        helperGuide: () => [\n          {\n            value: "base-detail",\n            content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863",\n            url: "/",\n          },\n        ],\n      },\n    }}\n  >\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u53f3\u4fa7\u56fa\u5b9a",description:"\u5c55\u793a\u5e26\u6709header\u7684\u53f3\u4fa7\u56fa\u5b9a\u83dc\u5355\u5e03\u5c40",code:'const { default: Layout, Page } = layout;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        name="fix-right-menu"\n        optionFixed={false}\n        option={<div className="right-options">\u53f3\u4fa7\u64cd\u4f5c\u533a\u57df</div>}\n        optionFooter={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        titleExtra={\n          <Space>\n            <Button type="primary">\u65b0\u5efa</Button>\n          </Space>\n        }\n        title="\u6807\u9898"\n        header={<div className="header">header</div>}\n        headerFixed={false}\n        menuFixed={false}\n      >\n        <div>\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u5e26\u6709filter\u7684\u5217\u8868\u9875",description:"\u5c55\u793a\u5e26\u6709filter\u7684\u5217\u8868\u9875",code:'const { default: Layout, Page } = layout;\nconst {\n  InputFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  getFilterValue,\n} = filter;\nconst { useState } = React;\nconst { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  const [filter, setFilter] = useState([]);\n  return (\n    <PureGlobal preset={{}}>\n      <Layout navigation={{ isFixed: false }}>\n        <Page\n          name="base"\n          helperGuideName="base-detail"\n          titleExtra={\n            <Space>\n              <Button type="primary">\u6dfb\u52a0</Button>\n            </Space>\n          }\n          filter={{\n            extraExpand: (\n              <Button type="primary" size="small">\n                \u8ba2\u9605\u7b5b\u9009\u9879\n              </Button>\n            ),\n            value: filter,\n            onChange: (value) => {\n              setFilter(value);\n              console.log(getFilterValue(value));\n            },\n            list: [\n              [\n                <InputFilterItem label="\u6587\u5b57" name="text" />,\n                <CityFilterItem label="\u57ce\u5e02" name="city" />,\n                <AdvancedSelectFilterItem\n                  label="\u9ad8\u7ea7\u9009\u62e9"\n                  name="select"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: "\u7b2c\u4e00\u9879", value: 1 },\n                          { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <UserFilterItem\n                  label="\u7528\u6237\u9009\u62e9"\n                  name="user"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7528\u6237\u4e00",\n                            value: 1,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e8c",\n                            value: 2,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e09",\n                            value: 3,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <FunctionSelectFilterItem\n                  label="\u804c\u80fd\u9009\u62e9"\n                  name="function"\n                  onlyAllowLastLevel\n                  single\n                />,\n                <IndustrySelectFilterItem\n                  label="\u884c\u4e1a\u9009\u62e9"\n                  name="industry"\n                  onlyAllowLastLevel\n                />,\n              ],\n              [\n                <UserFilterItem\n                  label="\u804c\u4f4d\u534f\u52a9\u4eba"\n                  name="position_user"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7528\u6237\u4e00",\n                            value: 1,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e8c",\n                            value: 2,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                          {\n                            label: "\u7528\u6237\u4e09",\n                            value: 3,\n                            description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n              ],\n            ],\n          }}\n        >\n          <div className="layout-content">\u5185\u5bb9\u533a</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o},{name:"filter",packageName:"@components/Filter",component:t(73604)}]},{title:"\u5de6\u4fa7\u5bfc\u822a\u83dc\u5355",description:"\u5c55\u793a\u4e00\u4e2a\u5de6\u4fa7\u5bfc\u822a\u83dc\u5355",code:'const { Menu } = layout;\nconst { Space } = antd;\nconst { useState } = React;\n\nconst ControlMenu = () => {\n  const [current, setCurrent] = useState();\n  return (\n    <Menu\n      currentKey={current}\n      onChange={setCurrent}\n      items={[\n        {\n          label: "\u7236\u7ea7\u6807\u98981",\n          key: "p-0",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-0",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-1",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98982",\n          key: "p-1",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-2",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-3",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98983",\n          key: "p-2",\n          iconType: "icon-zhanghaodenglu",\n        },\n      ]}\n    />\n  );\n};\n\nconst Example = () => {\n  return (\n    <Space size={10}>\n      <Menu\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <Menu\n        items={[\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-0",\n            path: "/link1",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-1",\n            path: "/link2",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-2",\n            path: "/link3",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-3",\n            path: "/link4",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <ControlMenu />\n    </Space>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l}]},{title:"PageHeader",description:"\u9875\u9762\u5934",code:'const { default: Layout, Page, Menu, PageHeader } = layout;\n\nconst Example = () => {\n  return (\n    <Layout navigation={{ isFixed: false }}>\n      <Page\n        menu={<div className="layout-menu">\u5de6\u4fa7\u83dc\u5355\u533a</div>}\n        title="\u6807\u9898"\n        hideCloseSvg={true}\n        menuFixed={false}\n        name="pageHeaderLayout"\n        header={\n          <PageHeader\n            iconType="icon-color-shenpi-biaoti"\n            title="\u8be6\u60c5\u9875\u540d\u79f0"\n            info="\u7f16\u53f7:85767"\n            options={[\n              {\n                children: "\u65b0\u5efa",\n              },\n              {\n                children: "\u64cd\u4f5c1",\n              },\n              {\n                children: "\u64cd\u4f5c2",\n              },\n              {\n                children: "\u64cd\u4f5c3",\n              },\n              {\n                children: "\u64cd\u4f5c4",\n              },\n            ]}\n            tags={["\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f", "\u8f85\u52a9\u4fe1\u606f"]}\n          />\n        }\n        headerFixed={false}\n      >\n        <div>\u5185\u5bb9\u533a</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"layout",packageName:"@components/Layout",component:a},{name:"antd",packageName:"antd",component:l}]}]}}},22978:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(6617),o=t(55199);const l={name:"ButtonGroup",summary:"<p>\u7528\u4e8e\u6839\u636e\u5f53\u524d\u5bb9\u5668\u7a7a\u95f4\u81ea\u52a8\u8ba1\u7b97\u591a\u4f59\u6309\u94ae\u6536\u8d77</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>button\u6309\u94ae\u5c5e\u6027\u7684\u6570\u7ec4</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>more</td>\n<td>\u66f4\u591a\u6309\u94ae\u5360\u4f4d</td>\n<td>jsx</td>\n<td>&lt;Button&gt;\u66f4\u591a&lt;Icon type=\"icon-arrow-thin-down\"/&gt;&lt;/Button&gt;</td>\n</tr>\n<tr>\n<td>compact</td>\n<td>\u662f\u5426\u4e3a\u7d27\u51d1\u6a21\u5f0f</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u5f53compact\u4e3afalse\u65f6\u4e3a\u6309\u94ae\u95f4\u9694\u5927\u5c0f\uff0c\u5426\u5219\u4e3a\u6309\u94ae\u5927\u5c0f</td>\n<td>'small','middle','large',number</td>\n<td>8</td>\n</tr>\n<tr>\n<td>split,align</td>\n<td>\u53c2\u8003antd Space</td>\n<td>-</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"ButtonGroup_e3fc2",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { Button, Space } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          list={[\n            {\n              type: "primary",\n              children: "\u64cd\u4f5c1",\n            },\n            {\n              children: "\u64cd\u4f5c2",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n              hidden: true,\n            },\n            {\n              children: "\u64cd\u4f5c4",\n              message: "\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f",\n              disabled: true,\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u7d27\u51d1\u6a21\u5f0f",description:"\u7d27\u51d1\u6a21\u5f0f",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { Button, Space } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          compact\n          list={[\n            {\n              type: "primary",\n              children: "\u64cd\u4f5c1",\n            },\n            {\n              children: "\u64cd\u4f5c2",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n            },\n            {\n              children: "\u64cd\u4f5c3",\n              message: "\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f",\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u6e32\u67d3\u51fd\u6570",description:"\u6e32\u67d3\u51fd\u6570",code:'const { default: ButtonGroup } = _ButtonGroup;\nconst { default: ConfirmButton } = _ConfirmButton;\nconst { Button, Space } = antd;\nconst { useState, useEffect } = React;\n\nconst LoadChildren = ({ children }) => {\n  const [loading, setLoading] = useState(true);\n  useEffect(() => {\n    setTimeout(() => {\n      setLoading(false);\n    }, 1000);\n  }, []);\n  if (loading) {\n    return null;\n  }\n  return children({\n    onClick: () => {\n      console.log("\u52a0\u8f7d\u5b8c\u6210");\n    },\n  });\n};\nconst BaseExample = () => {\n  const [width, setWidth] = useState(200);\n  return (\n    <Space>\n      <div style={{ width: `${width}px` }}>\n        <ButtonGroup\n          list={[\n            (props) => {\n              return (\n                <Button {...props} type="primary">\n                  \u64cd\u4f5c1\n                </Button>\n              );\n            },\n            (props) => {\n              return <Button {...props}>\u64cd\u4f5c2</Button>;\n            },\n            (props) => {\n              return <Button {...props}>\u64cd\u4f5c3</Button>;\n            },\n            (props) => {\n              return (\n                <LoadChildren key={props.key}>\n                  {({ onClick }) => {\n                    return (\n                      <ConfirmButton\n                        {...props}\n                        isModal={props.isDropdown}\n                        message="\u786e\u5b9a\u8981\u6267\u884c\u64cd\u4f5c\u5417\uff1f"\n                        onClick={onClick}\n                      >\n                        \u64cd\u4f5c4\n                      </ConfirmButton>\n                    );\n                  }}\n                </LoadChildren>\n              );\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          \u589e\u52a0\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          \u51cf\u5c11\u5bb9\u5668\u5bbd\u5ea6\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_ButtonGroup",packageName:"@components/ButtonGroup",component:a},{name:"_ConfirmButton",packageName:"@components/ConfirmButton",component:t(47338)},{name:"antd",packageName:"antd",component:o}]}]}}},24666:(n,e,t)=>{t.r(e),t.d(e,{default:()=>y});const a="style_overlay__ZS5Wz__2Npqm",o="style_overlay-content__IVFmc__2Npqm",l="style_state-tag__+59RJ__2Npqm";var d=t(73884),r=t(25644),i=t(3874),s=t(55199),c=t(69175),m=t.n(c),p=t(20977),u=t.n(p),h=t(70720),g=t.n(h),b=t(83136),f=t.n(b),v=t(70579);const y=n=>{let{className:e,overlayClassName:t,storeName:c="HISTORY_STORE_KEY",maxLength:p=5,label:h="\u6700\u8fd1\u641c\u7d22",children:b,onSelect:y,zIndex:k,getPopupContainer:S}=n;const[I,x]=(0,d.useState)(()=>r.A.getItem(c)||[]),[F,N]=(0,d.useState)(!1),P=(0,d.useCallback)(()=>{0!==I.length&&N(!0)},[I]),B=(0,d.useRef)(c);B.current=c,(0,d.useEffect)(()=>{r.A.setItem(B.current,I)},[I]);const C=(0,d.useCallback)(n=>{n.value&&n.label&&x(e=>{const t=m()(e,{value:n.value});return t.splice(0,0,n),p?u()(t,"value").slice(0,p):t}),N(!1)},[p]),E=(0,d.useCallback)(()=>{N(!1)},[]),T=g()(E),_=(0,d.useRef)(null),w=(0,d.useRef)(null);T.current={contains:n=>_.current.contains(n)||F&&w.current.contains(n)};const G=(0,d.useRef)(null),[L,R]=(0,d.useState)(0);return(0,d.useLayoutEffect)(()=>{const n=()=>{R(_.current.clientWidth)};n();const e=new ResizeObserver(n);e.observe(_.current);const t=new MutationObserver(n);return t.observe(_.current,{subtree:!0,childList:!0}),()=>{t.disconnect(),e.disconnect()}},[]),(0,v.jsx)(s.Popover,{zIndex:k,placement:"bottom",transitionName:"ant-slide-up",arrow:!1,open:F,getPopupContainer:S,overlayClassName:f()(t,a),content:(0,v.jsx)("div",{className:o,style:{width:L},ref:w,children:(0,v.jsxs)(s.Space,{direction:"vertical",children:[(0,v.jsx)("div",{children:h}),(0,v.jsx)(s.Space,{wrap:!0,children:I.map(n=>(0,v.jsx)(i.default,{className:l,text:n.label,type:"result",onClick:()=>{y&&y(n.value,n),G.current&&G.current(n.value,n),E(),C(n)}}))})]})}),children:(0,v.jsx)("div",{ref:_,className:f()(e),children:b({open:F,openHistory:P,appendHistory:C,setOnSelect:n=>{G.current=n},close:E})})})}},25724:(n,e,t)=>{t.d(e,{A:()=>o});var a=t(82723);const o={name:"Content",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6210\u7ec4\u5c55\u793a\u591a\u4e2a\u5b57\u6bb5\uff0c\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<p>labelAlign\u4e0d\u4e3aauto\u65f6\u4f1a\u81ea\u52a8\u8ba1\u7b97label\u7684\u6700\u5c0f\u5bbd\u5ea6\u4f7f\u6240\u6709label\u7684\u5bbd\u5ea6\u7b49\u4e8e\u6700\u957f\u7684label\u5bbd\u5ea6\u4f7f\u89c6\u89c9\u4e0a\u66f4\u52a0\u6574\u9f50\u6709\u79e9\u5e8f\u611f</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>\u5185\u5bb9\uff0c\u4e3a\u4e00\u4e2a\u6570\u7ec4\uff0c\u6570\u7ec4\u91cc\u9762\u6bcf\u4e00\u4e2a\u503c{label,content}</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td>label\u7684\u5bf9\u9f50\u65b9\u5f0f\u53ef\u4ee5\u4f20\u5165\u7684\u503c left,right,center,auto,\u4e3aauto\u65f6label\u4e0d\u8ba1\u7b97\u6700\u5c0f\u5bbd\u5ea6</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>\u663e\u793a\u5217\u6570</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\u6216\u652f\u6301\u54cd\u5e94\u5f0f\u7684\u5bf9\u8c61\u5199\u6cd5\u6765\u8bbe\u7f6e\u6c34\u5e73\u95f4\u9694 { xs: 8, sm: 16, md: 24}\u3002\u6216\u8005\u4f7f\u7528\u6570\u7ec4\u5f62\u5f0f\u540c\u65f6\u8bbe\u7f6e [\u6c34\u5e73\u95f4\u8ddd, \u5782\u76f4\u95f4\u8ddd]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Content_f15c1",style:"",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u57fa\u672c\u5185\u5bb9",code:"const {default:Content} = _Content;\nconst BaseExample = ()=>{\n    return <Content list={[\n        {label:'\u6807\u9898',content:'\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807\u9898',content:'\u5185\u5bb9\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807',content:'\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {label:'\u6807\u9898\u6807\u9898\u6807\u9898',content:'\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'}\n    ]}/>;\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]},{title:"labelAlign auto",description:"\u5c55\u793a\u4e86\u8bbe\u7f6elabelAlign\u4e3aauto\u7684\u60c5\u51b5",code:"const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content labelAlign=\"auto\" list={[\n        {label: '\u6807\u9898', content: '\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807\u9898', content: '\u5185\u5bb9\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807', content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {\n            label: '\u6807\u9898\u6807\u9898\u6807\u9898',\n            content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]},{title:"\u591a\u5217",description:"\u5c55\u793a\u4e86\u4e24\u5217\u7684\u60c5\u51b5",code:"const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content col={2} labelAlign=\"auto\" list={[\n        {label: '\u6807\u9898', content: '\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807\u9898', content: '\u5185\u5bb9\u5185\u5bb9'},\n        {label: '\u6807\u9898\u6807', content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'},\n        {\n            label: '\u6807\u9898\u6807\u9898\u6807\u9898',\n            content: '\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Content",packageName:"@components/Content",component:a}]}]}}},28928:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(3382),o=t(63743),l=t(55199),d=t(87558),r=t(82723);const i={name:"Modal",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u9700\u8981\u7528\u6237\u5904\u7406\u4e8b\u52a1\uff0c\u53c8\u4e0d\u5e0c\u671b\u8df3\u8f6c\u9875\u9762\u4ee5\u81f4\u6253\u65ad\u5de5\u4f5c\u6d41\u7a0b\u65f6\uff0c\u53ef\u4ee5\u5728\u5f53\u524d\u9875\u9762\u6b63\u4e2d\u6253\u5f00\u4e00\u4e2a\u6d6e\u5c42\uff0c\u627f\u8f7d\u76f8\u5e94\u7684\u64cd\u4f5c\u3002</p>\n<h3>\u7279\u70b9</h3>\n<p>\u8be5\u7ec4\u4ef6\u662fantd Modal\u7ec4\u4ef6\u7684\u518d\u5c01\u88c5\uff1a</p>\n<ul>\n<li>\u4fee\u6539\u4e86footer\u90e8\u5206\u7684\u8bbe\u7f6e\u903b\u8f91,\u80fd\u66f4\u52a0\u7b80\u5355\u7684\u5b9a\u4e49footer\u533a\u57df\u7684\u529f\u80fd</li>\n<li>\u6dfb\u52a0\u4e86withDecorator\u53ef\u4ee5\u66f4\u52a0\u65b9\u4fbf\u7684\u5904\u7406Modal\u5916\u5c42\u7684\u663e\u793a\u903b\u8f91</li>\n<li>\u6269\u5c55\u4e86\u7528\u4e8e\u65b9\u6cd5\u8c03\u7528\u7684useModal\u7684hooks\uff0c\u53ef\u4ee5\u901a\u8fc7hooks\u83b7\u5f97\u4e00\u4e2aModal\u7684\u8c03\u7528\u65b9\u6cd5\uff0c\u5e76\u4e14\u4fdd\u8bc1\u5176\u548cModal\u7ec4\u4ef6\u5f0f\u8c03\u7528\u6709\u76f8\u540c\u7684UI\u8868\u73b0\u548c\u884c\u4e3a</li>\n<li>\u6269\u5c55\u4e86ModalButton\u7ec4\u4ef6\uff0c\u53ef\u4ee5\u5728\u70b9\u51fb\u8be5\u6309\u94ae\u65f6\u6267\u884c\u52a0\u8f7d\u6570\u636e\uff0c\u5e76\u4e14Button\u7684\u72b6\u6001\u53d8\u4e3aloading\uff0c\u5728\u6570\u636e\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u518d\u5f39\u51fa\u5f39\u7a97</li>\n<li>\u6269\u5c55\u4e86TabsModal\u7ec4\u4ef6\uff0c\u5b83\u662f\u4e00\u4e2aTabs\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5bf9\u5f39\u7a97title\u505a\u4e86\u7279\u6b8a\u5904\u7406\uff0c\u66f4\u52a0\u7b26\u5408UI\u4ea4\u4e92\u903b\u8f91</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>\u5f39\u7a97\u7684footer\uff0c\u5f53\u5176\u88ab\u663e\u5f0f\u8bbe\u7f6e\u6210null\u4e14footerButtons\u6ca1\u6709\u8bbe\u7f6e\u8fc7\u65f6\u5f39\u7a97\u4e0d\u663e\u793afooter\u3002\u5f53\u5b83\u7c7b\u578b\u4e3afunction\u65f6\u53ef\u4ee5\u5f97\u5230close\u65b9\u6cd5\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>\u5f39\u7a97footer\u7684\u6309\u94ae\u533a\uff0c\u9ed8\u8ba4\u4e3a\u786e\u8ba4\u548c\u53d6\u6d88\u6309\u94ae\uff0c\u9ed8\u8ba4\u6309\u94ae\u5206\u522b\u54cd\u5e94onConfirm\u548conCancel\u65b9\u6cd5\uff0c\u5982\u679c\u81ea\u5b9a\u4e49\u8bbe\u7f6efooterButtons\u5219\u9700\u8981\u81ea\u884c\u4f20\u5165onClick\u53c2\u6570\uff0conConfirm\u548conCancel\u65b9\u6cd5\u5c06\u4e0d\u751f\u6548</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>\u5f39\u7a97\u5173\u95ed\u65f6\u8c03\u7528\uff0c\u5f39\u7a97\u53d7\u63a7\u65f6\u7531\u8be5\u65b9\u6cd5\u5c06\u5916\u90e8open\u72b6\u6001\u4fee\u6539</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>\u5f53footerButtons\u672a\u81ea\u5b9a\u4e49\u8bbe\u7f6e\u65f6\u70b9\u51fb\u786e\u8ba4\u6309\u94ae\u89e6\u53d1\u6267\u884c\u8be5\u65b9\u6cd5\uff0c\u5f53\u5176\u8fd4\u56dePromise\u70b9\u51fb\u540ePromise\uff0cresolve\u4e4b\u524d\u786e\u8ba4\u6309\u94ae\u663e\u793a\u4e3aloading\u72b6\u6001\uff0c\u8fd4\u56de\u503c\u4e3afalse\u6216\u8005Promise\u7684resolve\u503c\u4e3afalse\u65f6\u5f39\u7a97\u4e0d\u4f1a\u88ab\u5173\u95ed\uff0c\u5176\u4ed6\u60c5\u51b5\u5f39\u7a97\u9ed8\u8ba4\u5173\u95ed</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u548conConfirm\u7c7b\u4f3c\uff0c\u5176\u4e3a\u70b9\u51fb\u53d6\u6d88\u6309\u94ae\u89e6\u53d1</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5f39\u7a97\u5185\u5bb9\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230close\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\uff0c\u4f1a\u63a5\u6536\u5230\u5f39\u7a97children\u7684render\u65b9\u6cd5\uff0c\u53ef\u4ee5\u5728\u5176\u5916\u90e8\u6dfb\u52a0\u4fee\u9970\u5185\u5bb9\u540e\u6267\u884crender\u65b9\u6cd5\uff0c\u7ed9render\u65b9\u6cd5\u4f20\u5165\u7684\u503c\u53ef\u4ee5\u5728children,footer,rightOptions\u7c7b\u578b\u4e3afunction\u65f6\u63a5\u6536\u5230\u5bf9\u5e94\u7684\u53c2\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rightOptions</td>\n<td>\u5f39\u7a97\u53f3\u4fa7\u533a\u57df\uff0c\u548cchildren\u7c7b\u4f3c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\u7c7b\u578b</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>\u70b9\u51fb\u8499\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd Modal\u7ec4\u4ef6</p>\n<h3>useModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:modal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>TabsModal</h3>\n<p>\u4e00\u4e2aTabs\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5bf9\u5f39\u7a97title\u505a\u4e86\u7279\u6b8a\u5904\u7406\uff0c\u66f4\u52a0\u7b26\u5408UI\u4ea4\u4e92\u903b\u8f91</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>\u540cantd Tabs\u7684items\u53c2\u6570</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u6587\u5b57</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>\u9009\u9879\u5361\u5934\u663e\u793a\u5185\u5bb9\uff0c\u548cantd Tabs\u4e0d\u540c\u7684\u662f\u5b83\u53ef\u4ee5\u662f\u4e00\u4e2afunction\u548cModal\u7684children\u7c7b\u4f3c\u53ef\u4ee5\u63a5\u6536items[].withDecorator\u4f20\u5165\u7684\u53c2\u6570</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>\u5bf9\u5e94activeKey\u503c</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>\u5f53\u524d\u6fc0\u6d3b tab \u9762\u677f\u7684 key</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\u548cModal\u7684withDecorator\u4f5c\u7528\u4e00\u81f4</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>defaultActiveKey</td>\n<td>\u521d\u59cb\u5316\u9009\u4e2d\u9762\u677f\u7684 key\uff0c\u5982\u679c\u6ca1\u6709\u8bbe\u7f6e activeKey</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>\u5207\u6362\u9762\u677f\u7684\u56de\u8c03</td>\n<td>function</td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3>useTabsModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aTabsModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:tabsModal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>tabsModal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aTabsModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cTabsModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>ModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>\n<h3>TabsModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faTabsModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cTabsModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!1,className:"Modal_c59d6",style:"",list:[{title:"\u666e\u901a\u5f39\u7a97",description:"\u5c55\u793a\u5f39\u7a97\u7684\u57fa\u672c\u7528\u6cd5\uff0c\u81ea\u5b9a\u4e49footer\u7b49\u529f\u80fd\u3002\n\u6ce8\u610f:\n1.onConfirm\u548conCancel\u53ea\u5bf9\u4e8e\u9ed8\u8ba4\u7684footerButtons\u751f\u6548\uff0c\u5982\u679c\u662f\u81ea\u5b9a\u4e49\u7684footerButtons\u5219\u4e0d\u9700\u8981\u4f20\u8fd9\u4e24\u4e2a\u53c2\u6570\uff0c\u76f4\u63a5\u5b9a\u4e49\u6309\u94ae\u7684onClick\u5373\u53ef\u3002\n2.\u81ea\u5b9a\u4e49\u7684footerButtons\u7684onClick\u53ef\u4ee5\u8fd4\u56de\u4e00\u4e2aPromise\u6765\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97\uff0cresolve\u7684\u503c\u4e3afalse\u4e0d\u5173\u95ed\u5f39\u7a97\uff0c\u5176\u4ed6\u60c5\u51b5\u4f1a\u81ea\u52a8\u5173\u95ed\u5f39\u7a97\u3002\u5728resolve\u672a\u8fd4\u56de\u4e4b\u524d\u6309\u94ae\u4f1a\u53d8\u6210loading\u72b6\u6001",code:'const { default: Modal, useModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space, message, Radio } = antd;\nconst { PureGlobal } = global;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  const [size, setSize] = useState("default");\n  const [open, setOpen] = useState(false);\n  return (\n    <Space direction="vertical">\n      <Radio.Group\n        value={size}\n        options={[\n          { label: "small", value: "small" },\n          { label: "default", value: "default" },\n          {\n            label: "large",\n            value: "large",\n          },\n        ]}\n        onChange={(e) => {\n          setSize(e.target.value);\n        }}\n        optionType="button"\n        buttonStyle="solid"\n      />\n      <Space wrap>\n        <Modal\n          title="\u786e\u5b9a\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97"\n          size={size}\n          open={open}\n          onClose={() => {\n            setOpen(false);\n          }}\n          onConfirm={() => {\n            return new Promise((resolve) => {\n              message.success("\u5f39\u7a971s\u540e\u5173\u95ed");\n              setTimeout(() => {\n                message.success("\u5f39\u7a97\u5173\u95ed");\n                resolve();\n              }, 1000);\n            });\n          }}\n        >\n          <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>\n        </Modal>\n        <Button\n          onClick={() => {\n            setOpen(true);\n          }}\n        >\n          \u786e\u5b9a\u5ef6\u8fdf\u5173\u95ed\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "hooks\u8c03\u7528\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n            });\n          }}\n        >\n          hooks\u8c03\u7528\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u8d85\u9ad8\u5f39\u7a97",\n              size,\n              children: (\n                <div style={{ height: "2000px" }}>\n                  \u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\u8d85\u9ad8\u5f39\u7a97\n                </div>\n              ),\n            });\n          }}\n        >\n          \u5c55\u793a\u8d85\u9ad8\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u81ea\u5b9a\u4e49footer\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footer: ({ close }) => (\n                <Space>\n                  <span>\u81ea\u5b9a\u4e49footer</span>\n                  <Button\n                    type="link"\n                    onClick={() => {\n                      close();\n                    }}\n                  >\n                    \u5173\u95ed\n                  </Button>\n                </Space>\n              ),\n            });\n          }}\n        >\n          \u5c55\u793a\u81ea\u5b9a\u4e49footer\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u65e0footer\u5f39\u6846",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footer: null,\n            });\n          }}\n        >\n          \u65e0footer\u5f39\u6846\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u81ea\u5b9a\u4e49\u6309\u94ae\u7ec4",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              footerButtons: [\n                {\n                  children: "\u6309\u94ae\u4e00",\n                },\n                {\n                  type: "primary",\n                  children: "\u6309\u94ae\u4e8c",\n                },\n                {\n                  children: "\u6309\u94ae\u4e09",\n                },\n              ],\n            });\n          }}\n        >\n          \u81ea\u5b9a\u4e49\u6309\u94ae\u7ec4\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: "\u6709rightOptions\u7684\u5f39\u7a97",\n              size,\n              children: <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>,\n              rightOptions: <div>\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9\u53f3\u4fa7\u5185\u5bb9</div>,\n              rightSpan: 12,\n            });\n          }}\n        >\n          \u6709rightOptions\u7684\u5f39\u7a97\n        </Button>\n        <Button\n          onClick={() => {\n            const StateContainer = ({ children }) => {\n              const [disabled, setDisabled] = useState(false);\n              return children({ disabled, setDisabled });\n            };\n\n            modal({\n              title: "\u6709rightOptions\u7684\u5f39\u7a97",\n              size,\n              withDecorator: (render) => {\n                return <StateContainer>{render}</StateContainer>;\n              },\n              footerButtons: ({ disabled }) => [\n                {\n                  type: "primary",\n                  disabled,\n                  children: "\u786e\u5b9a",\n                },\n              ],\n              children: ({ disabled, setDisabled }) => (\n                <div>\n                  \u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97[{String(disabled)}]\n                  <Button\n                    onClick={() => {\n                      setDisabled((disabled) => !disabled);\n                    }}\n                  >\n                    \u5207\u6362\u786e\u5b9a\u6309\u94aedisabled\n                  </Button>\n                </div>\n              ),\n            });\n          }}\n        >\n          children\u63a7\u5236footerButtons\u72b6\u6001\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]},{title:"childrenRef\u7684\u4f7f\u7528",description:"",code:'const { default: Modal, useModal } = _Modal;\nconst { Button } = antd;\nconst BaseExample = () => {\n  const modal = useModal();\n\n  return (\n    <Button\n      onClick={() => {\n        modal({\n          title: "\u793a\u4f8b\u5f39\u6846",\n          children: ({ childrenRef }) => {\n            return (\n              <div ref={childrenRef}>\n                \u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\u793a\u4f8b\u5f39\u6846\n              </div>\n            );\n          },\n          onConfirm: (e, { childrenRef }) => {\n            console.log(childrenRef.current);\n          },\n        });\n      }}\n    >\n      \u70b9\u51fb\u5f39\u51fa\u5f39\u6846\n    </Button>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"antd",packageName:"antd",component:l}]},{title:"\u9700\u8981\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",description:"\u53ef\u4ee5\u901a\u8fc7withDecorator\u5c5e\u6027\u5b9e\u73b0\u5f39\u7a97\u7684\u52a0\u8f7d\u6570\u636e\u6216\u8005\u52a0\u8f7d\u8fdc\u7a0b\u7ec4\u4ef6\u7684\u903b\u8f91\uff0c\u5728\u6570\u636e\u6216\u8005\u8fdc\u7a0b\u7ec4\u4ef6\u52a0\u8f7d\u5b8c\u6210\u4e4b\u524d\u5f39\u7a97\u5c55\u793aloading\u72b6\u6001\uff0c\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540echildren\u53ef\u4ee5\u83b7\u53d6\u5230\u52a0\u8f7d\u7684\u6570\u636e",code:'const { default: Modal, useModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space } = antd;\nconst { default: Fetch } = fetch;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  const [open, setOpen] = useState(false);\n  return (\n    <Space wrap>\n      <Modal\n        title="\u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f"\n        withDecorator={(render) => (\n          <Fetch\n            loader={() => {\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve([\n                    {\n                      label: "\u5185\u5bb91",\n                      content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                    },\n                    {\n                      label: "\u5185\u5bb92",\n                      content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                    },\n                  ]);\n                }, 1000);\n              });\n            }}\n            render={({ data }) => render({ data })}\n          />\n        )}\n        open={open}\n        onClose={() => {\n          setOpen(false);\n        }}\n      >\n        {({ data }) => <Content list={data} col={2} />}\n      </Modal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: "hooks\u8c03\u7528\u65b9\u5f0f",\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5185\u5bb91",\n                          content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                        },\n                        {\n                          label: "\u5185\u5bb92",\n                          content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: ({ data }) => <Content list={data} col={2} />,\n          });\n        }}\n      >\n        hooks\u8c03\u7528\u65b9\u5f0f\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: (props) => {\n              return "hooks\u8c03\u7528\u65b9\u5f0f";\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5185\u5bb91",\n                          content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n                        },\n                        {\n                          label: "\u5185\u5bb92",\n                          content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: ({ data }) => <Content list={data} col={2} />,\n          });\n        }}\n      >\n        hooks title\u8c03\u7528\u65b9\u5f0f\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]},{title:"\u53ef\u4ee5\u5f39\u51fa\u5f39\u7a97\u7684\u6309\u94ae",description:"\u53ef\u4ee5\u70b9\u51fb\u6309\u94ae\u5f39\u51fa\u5f39\u7a97\uff0c\u5e76\u4e14\u5728\u5f39\u7a97\u5f39\u51fa\u4e4b\u524d\u53ef\u4ee5\u52a0\u8f7d\u6570\u636e\uff0c\u52a0\u8f7d\u6570\u636e\u65f6\uff0c\u6309\u94ae\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u518d\u5f39\u51fa\u5f39\u7a97",code:'const { ModalButton, TabsModalButton } = _Modal;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\nconst { default: FormInfo, Input, TextArea } = _FormInfo;\n\nconst api = {\n  loader: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve([\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n        ]);\n      }, 1000);\n    });\n  },\n};\n\nconst BaseExample = () => {\n  return (\n    <Space wrap>\n      <ModalButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",\n            children: <Content list={data} col={2} />,\n          };\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </ModalButton>\n      <TabsModalButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            items: data.map(({ label, content }, index) => {\n              return {\n                key: index,\n                children: content,\n                label,\n              };\n            }),\n          };\n        }}\n      >\n        \u70b9\u51fb\u52a0\u8f7d\u6570\u636e\u7684Tabs\u5f39\u7a97\n      </TabsModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"_Content",packageName:"@components/Content",component:r},{name:"_FormInfo",packageName:"@components/FormInfo",component:t(96252)}]},{title:"tabs\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2atabs\u5f39\u7a97\uff0ctabs\u7684\u9009\u9879\u7684label\u4f1a\u5360\u636e\u5f39\u7a97title\u4f4d\u7f6e\uff0c\u5f39\u6846\u7684title\u5c06\u4e0d\u663e\u793a\ntabs\u7684items\u591a\u52a0\u4e86withDecorator\u53c2\u6570\u548cModal\u7684withDecorator\u53c2\u6570\u7c7b\u4f3c\u53ef\u4ee5\u63a7\u5236\u5176\u5916\u90e8\u663e\u793a\u53ca\u6e32\u67d3\u5185\u5bb9\ntabs\u7684items\u7684children\u4e5f\u53ef\u4ee5\u662ffunction\uff0c\u540c\u6837\u53ef\u4ee5\u63a5\u6536\u5230TabsModal\u7684withDecorator\u4f20\u56de\u7684\u53c2\u6570",code:'const { TabsModal, useTabsModal } = _Modal;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\nconst { Button, Space } = antd;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const tabsModal = useTabsModal();\n  return <Space wrap>\n    <TabsModal open={open} onClose={() => {\n      setOpen(false);\n    }} items={[{\n      label: "\u9879\u76ee 1", key: "item-1", children: <div>\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1</div>\n    }, {\n      label: "\u9879\u76ee 2", key: "item-2", children: <div>\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2</div>\n    }]} rightOptions={<div>\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9</div>}>\n      <div>\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97\u5f39\u7a97</div>\n    </TabsModal>\n    <Button onClick={() => {\n      setOpen(true);\n    }}>\u7ec4\u4ef6\u8c03\u7528\u65b9\u5f0f</Button>\n    <Button onClick={() => {\n      tabsModal({\n        rightOptions: <div>\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9\u53f3\u8fb9\u680f\u5185\u5bb9</div>, items: [{\n          label: "\u9879\u76ee 1", key: "item-1", children: <div>\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1\u9879\u76ee 1</div>\n        }, {\n          label: "\u9879\u76ee 2", key: "item-2", children: <div>\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2\u9879\u76ee 2</div>\n        }]\n      });\n    }}>hooks\u8c03\u7528\u65b9\u5f0f</Button>\n    <Button onClick={() => {\n      tabsModal({\n        title: "\u6b64title\u4e0d\u5c55\u793a",\n        rightOptions: ({ data }) => <Content list={data} />,\n        withDecorator: (render) => <Fetch loader={() => {\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve([{ label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" }, {\n                label: "\u5185\u5bb92", content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92"\n              }]);\n            }, 1000);\n          });\n        }} render={({ data }) => render({ data })} />,\n        items: [{\n          label: "\u9879\u76ee 1", key: "item-1", children: ({ data }) => <Content list={data} col={2} />\n        }, {\n          withDecorator: (render) => <Fetch loader={() => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([{ label: "\u5185\u5bb93", content: "\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93\u5185\u5bb93" }, {\n                  label: "\u5185\u5bb94", content: "\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94\u5185\u5bb94"\n                }]);\n              }, 1000);\n            });\n          }} render={({ data }) => render({ tabData: data })} />,\n          label: "\u9879\u76ee 2",\n          key: "item-2",\n          children: ({ data, tabData }) => <Content list={[...data, ...tabData]} col={2} />\n        }]\n      });\n    }}>\u590d\u6742\u6570\u636e\u52a0\u8f7d</Button>\n  </Space>;\n};\n\nrender(<PureGlobal><BaseExample /></PureGlobal>);\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]},{title:"\u6d88\u606f\u786e\u8ba4\u548c\u63d0\u793a",description:"\u5c55\u793a\u786e\u8ba4\u6d88\u606f\u63d0\u9192",code:'const { default: Modal, useConfirmModal } = _Modal;\nconst { useState } = React;\nconst { Button, Space, message } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  const confirmModal = useConfirmModal();\n  return (\n    <Space wrap>\n      <Button\n        onClick={() => {\n          confirmModal({\n            danger: true,\n            type: "confirm",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        confirm\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "confirm",\n            confirmType: "warning",\n            title: "\u786e\u5b9a\u8981\u7f16\u8f91\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91\u786e\u5b9a\u8981\u7f16\u8f91",\n          });\n        }}\n      >\n        confirm \u8b66\u544a\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "info",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        info\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "info",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        info\u65e0\u6807\u9898\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "success",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        success\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "warning",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        warning\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: "error",\n            title: "\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f",\n            message:\n              "\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664",\n          });\n        }}\n      >\n        error\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Modal",packageName:"@components/Modal",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l},{name:"fetch",packageName:"@kne/react-fetch",component:d},{name:"_Content",packageName:"@components/Content",component:r}]}]}}},28967:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(29053),o=t(63743),l=t(55199);const d={name:"Permissions",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u7cfb\u7edf\u4e2d\u5b58\u5728\u4e00\u4e9b\u529f\u80fd\u548c\u64cd\u4f5c\u53ea\u5141\u8bb8\u67d0\u4e9b\u89d2\u8272\u7528\u6237\u4f7f\u7528\uff0c\u4f7f\u7528\u8be5\u7ec4\u4ef6\u53ef\u4ee5\u8ba9\u5176\u5305\u88f9\u7684\u7ec4\u4ef6\u6216\u8005\u533a\u57df\u6839\u636e\u7cfb\u7edf\u7684\u6743\u9650\u5217\u8868\u914d\u7f6e\u5c55\u793a\u4e0d\u540c\u7684\u72b6\u6001</p>\n<h3>\u7279\u70b9</h3>\n<p>\u901a\u8fc7\u5728Global\u4e2d\u7684preset\u4e2d\u8bbe\u7f6epermissions\u4f5c\u4e3a\u5f53\u524d\u7528\u6237\u7684\u6743\u9650\u5217\u8868\uff0c\u5728Permissions\u7ec4\u4ef6\u914d\u7f6epermissions\u4f5c\u4e3a\u8be5\u529f\u80fd\u8981\u6c42\u5177\u5907\u7684\u6743\u9650\u9879\uff0c\u5f53\u8981\u6c42\u5177\u5907\u7684\u6743\u9650\u9879\u5168\u90e8\u5728\u7528\u6237\u7684\u6743\u9650\u5217\u8868\u4e2d\u627e\u5230\u65f6\u4e3a\u6743\u9650\u901a\u8fc7\u72b6\u6001\u5426\u5219\u4e3a\u6743\u9650\u4e0d\u901a\u8fc7\u72b6\u6001</p>\n<p>\u5f53\u6743\u9650\u4e0d\u901a\u8fc7\u65f6\uff0cPermissions\u7ec4\u4ef6\u53ef\u4ee5\u6709\u4e09\u79cd\u65b9\u5f0f\u5448\u73b0\uff1a</p>\n<ol>\n<li>\u7528\u6237\u53ef\u4ee5\u770b\u5230\u64cd\u4f5c\u529f\u80fd\u7684\u7ec4\u4ef6\u663e\u793a\uff0c\u4f46\u662f\u4e0d\u80fd\u8fdb\u884c\u64cd\u4f5c\uff0c\u5728\u9f20\u6807\u79fb\u5165\u65f6\u4f1a\u4ee5ToolTip\u63d0\u793a\u9519\u8bef\u539f\u56e0\uff0c\u4e00\u822c\u7528\u5728\u6309\u94ae\u7b49\u9700\u8981\u7528\u6237\u4ea4\u4e92\u7684\u529f\u80fd\u4f4d\u7f6e</li>\n<li>\u7528\u6237\u4e0d\u80fd\u770b\u5230\u64cd\u4f5c\u529f\u80fd\u6216\u8005\u6570\u636e\u5448\u73b0\uff0c\u5bf9\u5e94\u533a\u57df\u663e\u793a\u9519\u8bef\u539f\u56e0\uff0c\u4e00\u822c\u7528\u5728\u8981\u6570\u636e\u5c55\u793a\u7b49\u573a\u666f</li>\n<li>\u9690\u85cf\u5185\u90e8\u7ec4\u4ef6\uff0c\u4e00\u822c\u7528\u5728\u4e0d\u9700\u8981\u5e72\u6270\u5230\u7528\u6237\u6216\u7528\u6237\u4e0d\u9700\u8981\u4e86\u89e3\u5176\u6ca1\u6709\u6743\u9650\u7684\u529f\u80fd\u6216\u6570\u636e\u7b49\u573a\u666f</li>\n</ol>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>\u7c7b\u578b\uff0c\u53ef\u9009\u503c\u4e3ahidden\uff0ctooltip\uff0cerror\uff0c\u5206\u522b\u4e3a\u9690\u85cf\uff0c\u6c14\u6ce1\u63d0\u793a\uff0c\u9519\u8bef\u63d0\u793a\u4e09\u79cd\u5f62\u5f0f</td>\n<td>string</td>\n<td>hidden</td>\n</tr>\n<tr>\n<td>tagName</td>\n<td>\u5f53\u524d\u7ec4\u4ef6\u7684tagName\uff0c\u540cReact.createElement\u7684type\u53c2\u6570\uff0c\u9ed8\u8ba4\u4e3aspan</td>\n<td>string</td>\n<td>span</td>\n</tr>\n<tr>\n<td>message</td>\n<td>\u63d0\u793a\u6587\u6848</td>\n<td>string</td>\n<td>\u60a8\u6682\u65e0\u6743\u9650\uff0c\u8bf7\u8054\u7cfb\u7ba1\u7406\u5458</td>\n</tr>\n<tr>\n<td>request</td>\n<td>\u6743\u9650\u5217\u8868\u4e3a\u4e00\u4e2a\u5b57\u7b26\u4e32\u6570\u7ec4\uff0c\u6bcf\u4e2aitem\u4e3a\u4e00\u9879\u6743\u9650\u7684key\uff0c\u6240\u6709\u6743\u9650\u5728\u5168\u5c40\u7684permissions\u4e2d\u5b58\u5728\u5219\u5224\u65ad\u4e3a\u6743\u9650\u901a\u8fc7</td>\n<td>array[string]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u8be5\u53c2\u6570\u53ef\u4ee5\u4f20function\u7c7b\u578b\uff0cchildren({isPass, type, request})\uff0cisPass\u4e3a\u6743\u9650\u6821\u9a8c\u662f\u5426\u901a\u8fc7\uff0ctype\u4e3a\u63d0\u793a\u7c7b\u578b\uff0crequest\u4e3a\u6240\u9700\u6743\u9650\u5217\u8868\uff0c\u53ef\u4ee5\u81ea\u884c\u5b9e\u73b0\u6743\u9650\u7684\u5c55\u793a</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Permissions_d08cc",style:".Permissions_d08cc .box {\n  padding: 20px;\n  background: #f8f8f8;\n}",list:[{title:"\u5c55\u793a\u6743\u9650\u4e0d\u901a\u8fc7\u7684\u51e0\u79cd\u5f62\u5f0f",description:"\u901a\u8fc7\u5207\u6362\u4e0d\u540c\u7684type\uff0c\u53ef\u4ee5\u9884\u89c8\u4e09\u79cd\u4e0d\u540ctype\u7684\u8868\u73b0\u5f62\u5f0f",code:'const { default: Permissions } = _Permissions;\nconst { PureGlobal } = global;\nconst { Button, Radio, Space } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [type, setType] = useState("tooltip");\n  return (\n    <PureGlobal\n      preset={{\n        permissions: ["permission_1", "permission_2"],\n      }}\n    >\n      <Space direction="vertical">\n        <Radio.Group\n          value={type}\n          options={[\n            { label: "tooltip", value: "tooltip" },\n            {\n              label: "error",\n              value: "error",\n            },\n            { label: "hidden", value: "hidden" },\n          ]}\n          onChange={(e) => {\n            setType(e.target.value);\n          }}\n          optionType="button"\n          buttonStyle="solid"\n        />\n        <Permissions type={type} request={["permission_2"]}>\n          <div className="box">\n            <Button onClick={() => console.log("\u6267\u884c\u64cd\u4f5c")}>\u6709\u6743\u9650\u64cd\u4f5c</Button>\n          </div>\n        </Permissions>\n        <Permissions type={type} request={["permission_3"]}>\n          <div className="box">\n            <Button onClick={() => console.log("\u6267\u884c\u64cd\u4f5c")}>\u65e0\u6743\u9650\u64cd\u4f5c</Button>\n          </div>\n        </Permissions>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Permissions",packageName:"@components/Permissions",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]}]}}},32159:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"HelperGuide",summary:"<p>\u7ed9\u7528\u6237\u63d0\u4f9b\u5e2e\u52a9\u6587\u6863</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"HelperGuide_4e237",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: HelperGuide } = _HelperGuide;\nconst { PureGlobal } = Global;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        enums: {\n          helperGuide: () => [\n            {\n              value: "test",\n              content:\n                "\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u54c8\u554a\u54c8\u54c8\u54c8",\n              url: "/xxxx",\n            },\n          ],\n        },\n      }}\n    >\n      <HelperGuide name="test" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_HelperGuide",packageName:"@components/HelperGuide",component:t(75363)},{name:"Global",packageName:"@components/Global",component:t(63743)}]}]}}},38799:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(79329),o=t(63743),l=t(55199);const d={name:"Navigation",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u7cfb\u7edf\u7684\u9876\u90e8\u5bfc\u822a\uff0c\u4e00\u7ea7\u5bfc\u822a\u9879\u504f\u5de6\u9760\u8fd1 logo \u653e\u7f6e\uff0c\u8f85\u52a9\u83dc\u5355\u504f\u53f3\u653e\u7f6e\u3002</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u96c6\u6210\u4e86Permissions\u6743\u9650\u5224\u65ad\uff0c\u53ef\u4ee5\u901a\u8fc7\u6743\u9650\u5217\u8868\u6765\u5224\u65ad\u5bfc\u9879\u662f\u5426\u663e\u793a</li>\n<li>\u5728\u5c4f\u5e55\u663e\u793a\u4e0d\u4e86\u5168\u90e8\u7684\u4e00\u7ea7\u5bfc\u822a\u65f6\u53ef\u4ee5\u81ea\u52a8\u5c06\u540e\u9762\u7684\u5bfc\u822a\u9879\u6536\u8d77\u5230\u66f4\u591a\u4e0b\u62c9\u83dc\u5355\u91cc\u9762</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Navigation_84649",style:".Navigation_84649 .fold-items {\n  width: 600px;\n}",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nrender(\n  <PureGlobal>\n    <Navigation\n      list={menuList}\n      isFixed={false}\n      permissions={[\n        "client:client:look",\n        "jd:job:look",\n        "cv:cv:look",\n        "contract:mgr:look",\n        "payment:mgr:look",\n        "client:invoice:center",\n        "client:invoice:manager",\n        "system:permissions:mgr",\n      ]}\n    />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nrender(\n  <PureGlobal>\n    <div className="fold-items">\n      <Navigation\n        isFixed={false}\n        list={menuList}\n        permissions={[\n          "client:client:look",\n          "jd:job:look",\n          "cv:cv:look",\n          "contract:mgr:look",\n          "payment:mgr:look",\n          "client:invoice:center",\n          "client:invoice:manager",\n          "system:permissions:mgr",\n        ]}\n      />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { useState } = React;\nconst { PureGlobal } = global;\nconst { default: Navigation } = _Navigation;\nconst { Checkbox, Space } = antd;\n\nconst menuList = [\n  {\n    key: "client",\n    title: "\u5ba2\u6237",\n    path: "/client",\n    permission: "client:client:look",\n  },\n  {\n    key: "position",\n    title: "\u804c\u4f4d",\n    path: "/position",\n    permission: "jd:job:look",\n  },\n  {\n    key: "ats",\n    title: "\u62db\u8058\u6d41\u7a0b",\n    path: "/ats",\n  },\n  {\n    key: "talent",\n    title: "\u4eba\u624d\u5e93",\n    permission: "cv:cv:look",\n    path: "/talent",\n  },\n  {\n    key: "contract",\n    title: "\u5408\u540c",\n    permission: "contract:mgr:look",\n    path: "/contract",\n  },\n  {\n    key: "payment",\n    title: "\u4ed8\u6b3e\u4fe1\u606f",\n    permission: "payment:mgr:look",\n    path: "/payment",\n  },\n  {\n    key: "invoice-center",\n    title: "\u5f00\u7968",\n    permission: "client:invoice:center",\n    path: "/invoice-center",\n  },\n  {\n    key: "invoice-manage",\n    title: "\u53d1\u7968\u7ba1\u7406",\n    permission: "client:invoice:manager",\n    path: "/invoice-manage",\n  },\n  {\n    key: "setting",\n    title: "\u8bbe\u7f6e",\n    permission: (permissions) =>\n      permissions.some(\n        (x) =>\n          [\n            "system:permissions:mgr",\n            "system:org:mgr",\n            "system:user:mgr",\n          ].indexOf(x) !== -1\n      ),\n    path: "/setting",\n  },\n];\n\nconst Example = () => {\n  const [permissions, setPermissions] = useState([]);\n  return (\n    <PureGlobal>\n      <Space className="container" direction="vertical" size={32}>\n        <Navigation isFixed={false} list={menuList} permissions={permissions} />\n        <Checkbox.Group\n          value={permissions}\n          options={[\n            "client:client:look",\n            "jd:job:look",\n            "cv:cv:look",\n            "contract:mgr:look",\n            "payment:mgr:look",\n            "client:invoice:center",\n            "client:invoice:manager",\n            "system:permissions:mgr",\n          ]}\n          onChange={(values) => {\n            setPermissions(values);\n          }}\n        />\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<Example />);\n\n',scope:[{name:"_Navigation",packageName:"@components/Navigation",component:a},{name:"antd",packageName:"antd",component:l},{name:"global",packageName:"@components/Global",component:o}]}]}}},43728:(n,e,t)=>{t.d(e,{A:()=>a});const a={name:"Descriptions",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u6700\u591a\u652f\u6301\u4e24\u5217\u6570\u636e\u5c55\u793a\uff0c\u591a\u4f59\u7684\u5217\u5c06\u4e0d\u5c55\u793a</li>\n<li>\u652f\u6301Features\u63a7\u5236\u5217\u5185\u5bb9\u5f00\u542f\u548c\u5173\u95ed</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u8be6\u60c5\u6570\u636e\u6e90\uff0c\u5185\u90e8\u6bcf\u4e2a\u6570\u7ec4\u4e3a\u4e00\u884c\u6570\u636e\uff0c\u6bcf\u884c\u6570\u636e\u4e2d\u6bcf\u4e2a\u5bf9\u8c61\u4e3a\u4e00\u5217\u6570\u636e\uff0c\u6bcf\u884c\u6700\u591a\u5305\u542b2\u5217\u5185\u5bb9\uff0c\u591a\u4f59\u7684\u4f1a\u88ab\u4e22\u5f03</td>\n<td>array[[{display,label,content,featureId}]]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{display}]]</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a,\u5f53\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230(item,dataSource)\u53c2\u6570\uff0citem\u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0cdataSource\u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684dataSource\u914d\u7f6e</td>\n<td>boolean,function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>dataSource[[{label}]]</td>\n<td>\u6570\u636e\u5c55\u793a\u7684label</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{content}]]</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{featureId}]]</td>\n<td>Features\u63a7\u5236\u7684id\uff0c\u53c2\u8003Features\u7ec4\u4ef6\u7684id\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Descriptions_8bc84",style:"",list:[{title:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",description:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",code:'const { default: Descriptions } = _Descriptions;\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: "\u5ba2\u6237\u540d\u79f0", content: "\u817e\u8baf" },\n          {\n            label: "\u53d1\u7968\u62ac\u5934",\n            content: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n          },\n        ],\n        [\n          { label: "\u53d1\u7968\u7c7b\u578b", content: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968" },\n          {\n            label: "\u53d1\u7968\u5f00\u5177\u65e5\u671f",\n            content: "2022-08-15",\n          },\n        ],\n        [{ label: "\u9000\u7968\u91d1\u989d", content: "22000.00\u5143" }],\n        [\n          {\n            label: "\u53d1\u7968\u53f7",\n            content: (\n              <div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n              </div>\n            ),\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9700\u8981\u91cd\u5f00\u53d1\u7968", content: "\u5426" },\n          {\n            label: "\u662f\u5426\u6d89\u53ca\u91d1\u878d\u53d8\u52a8",\n            content: "\u5426",\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9020\u6210\u5b9e\u8d28\u635f\u5931", content: "\u5426" },\n          { label: "\u8d23\u4efb\u5f52\u5c5e", content: "\u5ba2\u6237\u539f\u56e0" },\n        ],\n        [\n          {\n            label: "\u9000\u7968\u539f\u56e0",\n            content: "\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf",\n          },\n        ],\n        [{ label: "\u9644\u4ef6", content: "\u9644\u4ef6\u540d\u79f0" }],\n        [\n          { label: "\u64cd\u4f5c\u65f6\u95f4", content: "2022-08-01 16:32" },\n          {\n            label: "\u64cd\u4f5c\u4eba",\n            content: "\u897f\u897f\u6b6a",\n          },\n        ],\n        [\n          {\n            label: "\u8d85\u957f\u5185\u5bb9",\n            content:\n              "\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9",\n          },\n          {\n            label: "\u8d85\u957f\u82f1\u6587",\n            content:\n              "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Descriptions",packageName:"@components/Descriptions",component:t(5633)}]}]}}},45426:(n,e,t)=>{t.d(e,{A:()=>s});var a=t(64671),o=t(55199),l=t(87558),d=t(63743),r=t(89946),i=t(13050);const s={name:"Icon",summary:"<p>\u53ef\u4ee5\u663e\u793a\u4e00\u4e2a\u56fe\u6807\uff0c\u56fe\u6807\u5fc5\u987b\u5728\u5b57\u4f53\u6587\u4ef6\u4e2d\u88ab\u5b9a\u4e49\u8fc7</p>",api:'<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>\u56fe\u6807\u7c7b\u578b\uff0c\u53c2\u8003\u793a\u4f8b\u4e0b\u7684\u5b57\u7b26\u4e32</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>colorful</td>\n<td>\u662f\u5426\u662f\u5f69\u8272\u56fe\u6807</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>prefix</td>\n<td>\u56fe\u6807\u524d\u7f00</td>\n<td>string</td>\n<td>""</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u56fe\u6807\u5927\u5c0f</td>\n<td>number</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>',example:{isFull:!0,className:"Icon_81743",style:".Icon_81743 .item {\n  width: 150px;\n  word-break: break-all;\n}\n.Icon_81743 .item .ant-typography {\n  position: relative;\n}\n.Icon_81743 .item .ant-typography-copy {\n  visibility: hidden;\n  position: absolute;\n  right: -20px;\n}\n.Icon_81743 .item:hover .ant-typography-copy {\n  visibility: visible;\n}",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Icon } = _Icon;\nconst { Slider, Space, Typography } = antd;\nconst { useState } = React;\nconst { createWithFetch } = ReactFetch;\nconst { loadFont } = Global;\nconst { default: axios } = _axios;\nconst { createWithRemoteLoader } = remoteLoader;\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-iconfont:Font"],\n})(({ remoteModules }) => {\n  const [Font] = remoteModules;\n  const [value, setValue] = useState(30);\n  return (\n    <Space direction="vertical">\n      <Space>\n        <div>\u8c03\u6574\u5927\u5c0f:</div>\n        <Slider\n          style={{ width: 100 }}\n          max={60}\n          min={12}\n          value={value}\n          onChange={setValue}\n        />\n        <div>{value}px</div>\n      </Space>\n      {\n        <Font>\n          {({ list }) => {\n            return (\n              <Space wrap align="top" size="large">\n                {list.map(({ name, font_class }) => {\n                  return (\n                    <Space\n                      className="item"\n                      direction="vertical"\n                      align="center"\n                      key={name}\n                    >\n                      <Icon type={font_class} size={value} />\n                      <Typography.Text\n                        copyable={{\n                          text:\n                            \'<Icon type="\' +\n                            font_class +\n                            \'" size={\' +\n                            value +\n                            "} />",\n                        }}\n                      >\n                        {font_class}\n                      </Typography.Text>\n                      <div>{name}</div>\n                    </Space>\n                  );\n                })}\n              </Space>\n            );\n          }}\n        </Font>\n      }\n    </Space>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Icon",packageName:"@components/Icon",component:a},{name:"antd",packageName:"antd",component:o},{name:"ReactFetch",packageName:"@kne/react-fetch",component:l},{name:"Global",packageName:"@components/Global",component:d},{name:"_axios",packageName:"axios",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:i}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Icon } = _Icon;\nconst { Space, Slider, Typography } = antd;\nconst { useState } = React;\nconst { createWithFetch } = ReactFetch;\nconst { createWithRemoteLoader } = remoteLoader;\nconst { default: axios } = _axios;\n\nconst BaseExample = createWithRemoteLoader({\n  modules: ["components-iconfont:ColorfulFont"],\n})(({ remoteModules }) => {\n  const [ColorfulFont] = remoteModules;\n  const [value, setValue] = useState(30);\n  return (\n    <Space direction="vertical">\n      <Space>\n        <div>\u8c03\u6574\u5927\u5c0f:</div>\n        <Slider\n          style={{ width: 100 }}\n          max={60}\n          min={12}\n          value={value}\n          onChange={setValue}\n        />\n        <div>{value}px</div>\n      </Space>\n      <ColorfulFont>\n        {({ list }) => (\n          <Space wrap align="top" size="large">\n            {list.map(({ name }) => {\n              return (\n                <Space\n                  className="item"\n                  direction="vertical"\n                  align="center"\n                  key={name}\n                >\n                  <Icon colorful type={name} size={value} />\n                  <Typography.Text\n                    copyable={{\n                      text:\n                        \'<Icon colorful type="\' +\n                        name +\n                        \'" size={\' +\n                        value +\n                        "} />",\n                    }}\n                  >\n                    {name}\n                  </Typography.Text>\n                </Space>\n              );\n            })}\n          </Space>\n        )}\n      </ColorfulFont>\n    </Space>\n  );\n});\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Icon",packageName:"@components/Icon",component:a},{name:"antd",packageName:"antd",component:o},{name:"ReactFetch",packageName:"@kne/react-fetch",component:l},{name:"Global",packageName:"@components/Global",component:d},{name:"_axios",packageName:"axios",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:i}]}]}}},45516:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(28148),o=t(55199);const l={name:"Menu",summary:"<p>\u652f\u6301\u8fdc\u7a0b\u52a0\u8f7d\u6570\u636e\u7684\u83dc\u5355</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Menu_b6154",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Menu } = _Menu;\nconst { Space } = antd;\nconst { useState } = React;\n\nconst ControlMenu = () => {\n  const [current, setCurrent] = useState("s-0");\n  return (\n    <Menu\n      currentKey={current}\n      onChange={setCurrent}\n      items={[\n        {\n          label: "\u7236\u7ea7\u6807\u98981",\n          key: "p-0",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-0",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-1",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98982",\n          key: "p-1",\n          iconType: "icon-zhanghaodenglu",\n          children: [\n            {\n              label: "\u5b50\u6807\u98981",\n              key: "s-2",\n            },\n            {\n              label: "\u5b50\u6807\u98982",\n              key: "s-3",\n            },\n          ],\n        },\n        {\n          label: "\u7236\u7ea7\u6807\u98983",\n          key: "p-2",\n          iconType: "icon-zhanghaodenglu",\n        },\n      ]}\n    />\n  );\n};\nconst BaseExample = () => {\n  return (\n    <Space>\n      <div style={{ maxWidth: "200px" }}>\n        <Menu\n          defaultItems={[\n            {\n              label: "\u7236\u7ea7\u6807\u98981",\n              iconType: "icon-zhanghaodenglu",\n              children: [\n                {\n                  label:\n                    "\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u5b50\u6807\u98981\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7",\n                  path: "/link1",\n                },\n                {\n                  label: "\u5b50\u6807\u98982",\n                  path: "/link2",\n                },\n              ],\n            },\n            {\n              label: "\u7236\u7ea7\u6807\u98982",\n              iconType: "icon-zhanghaodenglu",\n              children: [\n                {\n                  label: "\u5b50\u6807\u98981",\n                  path: "/link3",\n                },\n                {\n                  label: "\u5b50\u6807\u98982",\n                  path: "/link4",\n                },\n              ],\n            },\n            {\n              label: "\u7236\u7ea7\u6807\u98983",\n              iconType: "icon-zhanghaodenglu",\n              fetchOptions: {\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: "\u5b50\u6807\u98981",\n                          path: "/link5",\n                        },\n                        {\n                          label: "\u5b50\u6807\u98982",\n                          path: "/link6",\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              },\n            },\n          ]}\n        />\n      </div>\n\n      <Menu\n        items={[\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-0",\n            path: "/link1",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-1",\n            path: "/link2",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98981",\n            key: "s-2",\n            path: "/link3",\n          },\n          {\n            iconType: "icon-zhanghaodenglu",\n            label: "\u5b50\u6807\u98982",\n            key: "s-3",\n            path: "/link4",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            key: "p-0",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-0",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-1",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            key: "p-1",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                key: "s-2",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                key: "s-3",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            key: "p-2",\n            iconType: "icon-zhanghaodenglu",\n            path: "/link5",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        defaultItems={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            iconType: "icon-zhanghaodenglu",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link4",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98983",\n            iconType: "icon-zhanghaodenglu",\n            fetchOptions: {\n              loader: () => {\n                return new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve([\n                      {\n                        label: "\u5b50\u6807\u98981",\n                        path: "/link5",\n                      },\n                      {\n                        label: "\u5b50\u6807\u98982",\n                        path: "/link6",\n                      },\n                    ]);\n                  }, 1000);\n                });\n              },\n            },\n          },\n        ]}\n      />\n      <Menu\n        defaultItems={[\n          {\n            label: "\u7236\u7ea7\u6807\u98981",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link1",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link2",\n              },\n            ],\n          },\n          {\n            label: "\u7236\u7ea7\u6807\u98982",\n            children: [\n              {\n                label: "\u5b50\u6807\u98981",\n                path: "/link3",\n              },\n              {\n                label: "\u5b50\u6807\u98982",\n                path: "/link4",\n              },\n            ],\n          },\n        ]}\n      />\n      <ControlMenu />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Menu",packageName:"@components/Menu",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},46312:(n,e,t)=>{t.d(e,{A:()=>c});var a={};t.r(a),t.d(a,{default:()=>i});var o={};t.r(o),t.d(o,{default:()=>s});var l=t(47458),d=t(63743),r=t(55199);const i={ButtonText:"confirm"},s={ButtonText:"\u786e\u5b9a"},c={name:"Intl",summary:"<p>\u652f\u6301\u7cfb\u7edf\u56fd\u9645\u5316</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Intl_51734",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:"const {FormattedMessage, IntlProvider} = _Intl;\nconst {PureGlobal} = global;\nconst {Select, Space} = antd;\nconst {default: en} = localeEN;\nconst {default: cn} = localeCN;\nconst {useState} = React;\nconst BaseExample = () => {\n    const [locale, setLocale] = useState('zh-CN');\n    return (<Space>\n        <Select value={locale} onChange={setLocale}\n                options={['zh-CN', 'en-US'].map(key => ({value: key, label: key}))}/>\n        <PureGlobal\n            preset={{\n                locale\n            }}\n        >\n            <IntlProvider locale={locale} importMessages={locale => {\n                return {\n                    default: {\n                        'zh-CN': cn, 'en-US': en\n                    }[locale]\n                };\n            }}>\n                <FormattedMessage defaultMessage=\"\u6309\u94ae\" id=\"ButtonText\">\n                    {text => <div>{text}</div>}\n                </FormattedMessage>\n            </IntlProvider>\n\n        </PureGlobal>\n    </Space>);\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Intl",packageName:"@components/Intl",component:l},{name:"global",packageName:"@components/Global",component:d},{name:"antd",packageName:"antd",component:r},{name:"localeEN",packageName:"@components/Intl/doc/locale/en-US",component:a},{name:"localeCN",packageName:"@components/Intl/doc/locale/zh-CN",component:o}]}]}}},46631:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(19343),o=t(63743),l=t(13050),d=t(21079),r=t(55199);const i={name:"File",summary:"<p>\u63d0\u4f9b\u6587\u4ef6\u5c55\u793a\uff0cOSS\u6587\u4ef6id\u8f6c\u6362\u8bbf\u95ee\u5730\u5740\uff0c\u6587\u4ef6\u5217\u8868\uff0c\u4e0b\u8f7d\u7b49\u64cd\u4f5c</p>\n<p>\u6ce8\u610f\uff1a</p>\n<ul>\n<li>\u5982\u679c\u9700\u8981\u663e\u793a\u6216\u8005\u8f6c\u6362oss id\u7684\u6587\u4ef6\uff0c\u9700\u8981Global\u7684preset apis\u8bbe\u7f6e\u8fc7oss\u63a5\u53e3\u6216\u8005\u4f20\u5165apis.oss\u53c2\u6570\uff0coss\u8fd4\u56de\u8bbf\u95ee\u5730\u5740</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3aoss\u6587\u4ef6\uff0c\u4f20\u5165ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3a\u666e\u901a\u6587\u4ef6\u5730\u5740\uff0c\u4f20\u5165\u8be5\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u6587\u4ef6\u5931\u8d25\u5c55\u793a\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u52a0\u8f7d\u6587\u4ef6loading\u8fc7\u7a0b\u4e2d\u663e\u793a\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n</tbody>\n</table>\n<h4>Download</h4>\n<p>\u4e0b\u8f7d\u6587\u4ef6\u6309\u94ae</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u6587\u4ef6\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>\u672a\u547d\u540d\u4e0b\u8f7d\u6587\u4ef6</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>\u4e0b\u8f7d\u6210\u529f\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>\u4e0b\u8f7d\u5931\u8d25\u56de\u8c03\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3aoss\u6587\u4ef6\uff0c\u4f20\u5165ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>\u5982\u679c\u6587\u4ef6\u4e3a\u666e\u901a\u6587\u4ef6\u5730\u5740\uff0c\u4f20\u5165\u8be5\u53c2\u6570</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>List</h4>\n<p>\u663e\u793a\u6587\u4ef6\u5217\u8868\uff0c\u53ef\u4ee5\u5e26\u6709\u7f16\u8f91\u6587\u4ef6\u540d\u79f0\uff0c\u6587\u4ef6\u9884\u89c8\uff0c\u6587\u4ef6\u5220\u9664\u7b49\u529f\u80fd</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u6587\u4ef6\u5217\u8868</td>\n<td>array[{id,type,filename,date,userName}]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>dataSource[].id</td>\n<td>id:\u6587\u4ef6\u7684id\uff0c\u4e00\u822c\u4e3aossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].type</td>\n<td>\u6587\u4ef6\u72b6\u6001\u4e3auploading\u65f6\u8be5\u884c\u6587\u4ef6\u5c55\u793a\u4e3aloading\u72b6\u6001</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].filename</td>\n<td>\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].date</td>\n<td>\u6587\u4ef6\u4e0a\u4f20\u65e5\u671f</td>\n<td>Date,date timestamp</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].userName</td>\n<td>\u6587\u4ef6\u4e0a\u4f20\u4eba</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getPermission</td>\n<td>\u83b7\u53d6\u64cd\u4f5c\u6743\u9650\uff0c\u4f1a\u5728render\u6bcf\u6761\u6570\u636e\u65f6\u8c03\u7528\uff0c\u83b7\u53d6\u5230\u53c2\u6570\u5217\u8868[type,itemData],type:preview\u9884\u89c8,edit\u7f16\u8f91,download\u4e0b\u8f7d\uff0c\u8fd4\u56defalse\u4e3a\u6ca1\u6709\u6743\u9650\uff0c\u5176\u4ed6\u60c5\u51b5\u4e3a\u6709\u6743\u9650</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>\u662f\u5426\u5f00\u542f\u9884\u89c8\u529f\u80fd\uff0c\u548cgetPermission type:preview\u9884\u89c8\u7ed3\u679c\u540c\u4e8b\u63a7\u5236\uff0c\u5168\u90fd\u5224\u65ad\u901a\u8fc7\u624d\u80fd\u5f00\u542f\u9884\u89c8\u529f\u80fd</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>infoItemRenders</td>\n<td>\u81ea\u5b9a\u4e49\u5217</td>\n<td>array[{span,render}]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>infoItemRenders[].span</td>\n<td>\u5f53\u524d\u5217\u6805\u683c\u6570</td>\n<td>number</td>\n<td>4</td>\n</tr>\n<tr>\n<td>infoItemRenders[].render</td>\n<td>render\u51fd\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u64cd\u4f5c\u7684api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>\u6587\u4ef6\u540d\u7f16\u8f91\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>\u6587\u4ef6\u9884\u89c8\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>\u6587\u4ef6\u5220\u9664\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>OptionButtons</h4>\n<p>\u6587\u4ef6\u64cd\u4f5c\u6309\u94ae\uff0c\u53ef\u4ee5\u5e26\u6709\u7f16\u8f91\u6587\u4ef6\u540d\u79f0\uff0c\u6587\u4ef6\u9884\u89c8\uff0c\u6587\u4ef6\u5220\u9664\u7b49\u529f\u80fd</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u64cd\u4f5c\u7684api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>\u6587\u4ef6\u540d\u7f16\u8f91\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>\u6587\u4ef6\u9884\u89c8\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>\u6587\u4ef6\u5220\u9664\u56de\u8c03\u63a5\u53e3</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>\u662f\u5426\u5f00\u542f\u9884\u89c8\u529f\u80fd\uff0c\u548cgetPermission type:preview\u9884\u89c8\u7ed3\u679c\u540c\u4e8b\u63a7\u5236\uff0c\u5168\u90fd\u5224\u65ad\u901a\u8fc7\u624d\u80fd\u5f00\u542f\u9884\u89c8\u529f\u80fd</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n</tbody>\n</table>\n<h4>FileLink</h4>\n<p>\u5916\u89c2\u7c7b\u4f3cLink\u7684\u7ec4\u4ef6\uff0c\u70b9\u51fb\u540e\u53ef\u4ee5\u5f39\u51fa\u6587\u4ef6\u9884\u89c8\u6846</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>title</td>\n<td>\u5f39\u7a97\u6807\u9898</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>id</td>\n<td>\u6587\u4ef6oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>originName</td>\n<td>\u6587\u4ef6\u540d\u79f0</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openDownload</td>\n<td>\u662f\u5426\u5f00\u542f\u6587\u4ef6\u4e0b\u8f7d</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal\u7684\u5176\u4ed6\u53c2\u6570\uff0c\u53c2\u8003Modal\u7ec4\u4ef6</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>downloadBlobFile(target, filename)</h4>\n<p>\u4e0b\u8f7d\u6587\u4ef6\u7684\u65b9\u6cd5</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>target</td>\n<td>\u4e0b\u8f7d\u94fe\u63a5\u5730\u5740,\u6216\u8005\u4e8c\u8fdb\u5236\u6570\u636e</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u540e\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>{isLoading,download,...others} = useDownload({id,filename,apis,onError,onSuccess});</h4>\n<p>\u751f\u6210\u4e0b\u8f7d\u6587\u4ef6function\u7684hooks\uff0c\u5e26\u6709\u4e0b\u8f7d\u4e2d\u7684\u72b6\u6001\u63a7\u5236</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>\u6587\u4ef6ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>\u4e0b\u8f7d\u540e\u7684\u6587\u4ef6\u540d</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>\u4e0b\u8f7d\u5931\u8d25\u56de\u8c03</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>\u4e0b\u8f7d\u6210\u529f\u56de\u8c03</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isLoading</td>\n<td>\u662f\u5426\u6b63\u5728\u4e0b\u8f7d\u4e2d</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>download</td>\n<td>\u6267\u884c\u8be5\u65b9\u6cd5\u5f00\u59cb\u4e0b\u8f7d</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>others</td>\n<td>\u5176\u4ed6@kne/react-fetch useFetch\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>modal = useFileModal()</h4>\n<p>\u6587\u4ef6\u9884\u89c8\u5f39\u6846\u65b9\u6cd5\u751f\u6210\u7684hooks</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>\u6267\u884c\u540e\u5f39\u51fa\u6587\u4ef6\u9884\u89c8\u5f39\u7a97</td>\n<td>function({title, id, originName, apis, openDownload, ...modalProps})</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({title})</td>\n<td>\u5f39\u7a97\u6807\u9898</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>modal({id})</td>\n<td>\u6587\u4ef6oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({originName})</td>\n<td>\u6587\u4ef6\u540d\u79f0</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({apis})</td>\n<td>\u901a\u8fc7oss id\u83b7\u53d6oss\u6587\u4ef6\u5730\u5740\u63a5\u53e3{oss} oss\u4e3a\u4e00\u4e2a@kne/react-fetch\u53c2\u6570\uff0c\u5982\u679cGlobal\u7684preset\u5df2\u8bbe\u7f6e\u8be5\u503c\uff0c\u5207\u5f53\u524d\u7ec4\u4ef6\u4e5f\u9700\u8981\u5e94\u7528\u8be5\u503c\u65f6\u53ef\u4ee5\u4e0d\u4f20</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({openDownload})</td>\n<td>\u662f\u5426\u5f00\u542f\u6587\u4ef6\u4e0b\u8f7d</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal\u7684\u5176\u4ed6\u53c2\u6570\uff0c\u53c2\u8003Modal\u7ec4\u4ef6</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"File_0b279",style:"",list:[{title:"\u83b7\u53d6\u6587\u4ef6\u5730\u5740",description:"\u901a\u8fc7\u4e00\u4e2aossId\u83b7\u53d6\u6587\u4ef6\u5730\u5740",code:'const { default: File } = _File;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return <File id="qqq">{({ url }) => url}</File>;\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(getPublicPath("components-core") + "/avatar.png");\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u4e0b\u8f7d",description:"\u5c55\u793a\u6587\u4ef6\u4e0b\u8f7d",code:'const { Download } = _File;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <Download\n      id="123"\n      filename="\u4e0b\u8f7d\u7684\u6587\u4ef6"\n      onSuccess={() => {\n        console.log("\u4e0b\u8f7d\u6210\u529f");\n      }}\n    >\n      \u6587\u4ef6\u4e0b\u8f7d\n    </Download>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(getPublicPath("components-core") + "/avatar.png");\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u5217\u8868",description:"\u5c55\u793a\u6587\u4ef6\u5217\u8868",code:'const { List } = _FileList;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\n\nconst BaseExample = () => {\n  return (\n    <Space direction="vertical">\n      <List\n        dataSource={[\n          {\n            uuid: "121233",\n            type: "uploading",\n            filename: "\u5f20\u4e09\u7684\u7b80\u5386.doc",\n          },\n          {\n            id: "xxxxx",\n            filename: "\u6211\u662f\u4e00\u4efd\u7b80\u5386.pdf",\n            date: "2022-07-15T11:09:15.000+08:00",\n            userName: "\u7528\u6237\u540d",\n          },\n        ]}\n      />\n      <List dataSource={[]} />\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal\n    preset={{\n      apis: {\n        file: {\n          getUrl: {\n            loader: async ({ params }) => {\n              console.log(params);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(\n                    getPublicPath("components-core") +\n                      "/mock/resume.pdf"\n                  );\n                }, 1000);\n              });\n            },\n          },\n        },\n      },\n    }}\n  >\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FileList",packageName:"@components/File",component:a},{name:"lodash",packageName:"lodash",component:d},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l}]},{title:"\u6587\u4ef6\u94fe\u63a5",description:"\u5c55\u793a\u6587\u4ef6\u94fe\u63a5",code:'const { FileLink, useFileModal } = _File;\nconst { getPublicPath } = remoteLoader;\nconst { PureGlobal } = global;\nconst { Button } = antd;\n\nconst CustomButton = ({ children, ...p }) => {\n  const modal = useFileModal(p);\n  return (\n    <Button\n      onClick={() => {\n        modal();\n      }}\n    >\n      {p.originName}\n    </Button>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        apis: {\n          file: {\n            getUrl: {\n              loader: async ({ params }) => {\n                const mapping = {\n                  "01": "/avatar.png",\n                  "02": "/mock/demo2.html",\n                  "03": "/mock/resume.pdf",\n                };\n                return new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve(\n                      getPublicPath("components-core") + mapping[params.id]\n                    );\n                  }, 1000);\n                });\n              },\n            },\n          },\n        },\n      }}\n    >\n      <FileLink id="01" originName="\u6211\u662f\u4e00\u4e2a\u56fe\u7247.jpg" />\n      <FileLink id="02" originName="\u6211\u662f\u4e00\u4e2a\u7f51\u9875.html" />\n      <FileLink id="03" originName="\u6211\u662f\u4e00\u4e2apdf.pdf" />\n      <CustomButton id="03" originName="\u6211\u662f\u4e00\u4e2apdf.pdf" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_File",packageName:"@components/File",component:a},{name:"remoteLoader",packageName:"@kne/remote-loader",component:l},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r}]}]}}},52616:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(3874),o=t(5633),l=t(21079),d=t(55199);const r={name:"StateTag",summary:"<p>\u7528\u4e8e\u5c55\u793a\u6807\u7b7e</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>tag\u7684\u7c7b\u578b\uff0c\u7c7b\u578b\u51b3\u5b9a\u663e\u793a\u7684\u989c\u8272</td>\n<td>'default'(#666666)\u3001'skill'(#666666)(\u6b64\u65f6\u8fb9\u6846\u989c\u8272\u4e3a #EEEEEE)\u3001'success'(#027A48)\u3001'progress'(#F09700)\u3001'danger'(#D14343)\u3001'info'(#155ACF)\u3001'other'(#6740C3)(\u5f85\u5b9a\u989c\u8272)\u3001'result'(#666666)\u3001'filterResult'(#5CB8B2)</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>showBorder</td>\n<td>\u662f\u5426\u5c55\u793a\u8fb9\u6846</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>showBackground</td>\n<td>\u662f\u5426\u5c55\u793a\u80cc\u666f\u8272</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>text</td>\n<td>tag\u6587\u6848</td>\n<td>string</td>\n<td>''</td>\n</tr>\n<tr>\n<td>filterName</td>\n<td>tag\u7c7b\u578b\u4e3a\u201cfilterResult\u201d\u65f6\u663e\u793a\u5728\u524d\u8fb9\u7684\u6587\u6848</td>\n<td>string</td>\n<td>''</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003 <a href=\"https://ant.design/components/tag-cn\">antd Tag.Tag</a></p>",example:{isFull:!0,className:"StateTag_cfeaa",style:"",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u72b6\u6001\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\nconst { default: Descriptions } = _Descriptions;\nconst { range } = lodash;\nconst { Space, Typography } = antd;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <div>\u4f7f\u7528\u573a\u666f: \u5217\u8868\u9875Table,\u7b80\u5386\u8be6\u60c5\u9875</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5f85XX\uff0c\u6682\u505c" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "info", text: "\u5f85\u63d0\u4ea4\u5f00\u7968" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="info" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "XX\u4e2d\uff0c\u6b63\u5728XX\u4e2d" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "progress", text: "\u9000\u7968\u5ba1\u6838\u4e2d" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="progress" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u901a\u8fc7\uff0c\u6210\u529f\uff0c\u5b8c\u6210" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "success", text: "\u6807\u7b7e\u5185\u5bb9" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="success" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u4e0d\u901a\u8fc7\uff0c\u5931\u8d25\uff0c\u6dd8\u6c70\uff0c\u7f3a\u5e2d\uff0c\u62d2\u7edd" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "danger", text: "\u9000\u7968\u62d2\u7edd" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="danger" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u53d6\u6d88\uff0c\u64a4\u9500\uff0c\u505c\u6b62" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "default", text: "\u64a4\u9500\u5f00\u7968\u5ba1\u6838" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="default" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\uff08\u6682\u65f6\u8fd8\u672a\u7528\u5230\uff09" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <Space>\n                  <StateTag {...{ type: "other", text: "\u6807\u7b7e\u5185\u5bb9" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: \'<StateTag type="other" text="\u6807\u7b7e\u5185\u5bb9" />\',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n        ]}\n      />\n      <br />\n      <br />\n      <div>\u4e2a\u522b\u7279\u6b8a\u573a\u666f\uff08\u9700\u8981\u5355\u72ec\u8be2\u95eeUI):</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5f85XX\uff0c\u6682\u505c" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u63a8\u8350\u7b80\u5386" }} />\n                  <StateTag {...{ type: "success", text: "\u5df2\u9000\u7968" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5df2XX\u5f85XX" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u5f00\u7968\u5f85\u5bc4\u51fa" }} />\n                  <StateTag {...{ type: "success", text: "\u5df2\u5f85\u5bc4\u5f85\u6536\u6b3e" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            {\n              label: "\u4f7f\u7528\u89c4\u5219",\n              content: "\u5df2XX+\u8bcd\u8bed\uff1a\u6839\u636e\u540e\u9762\u7684\u8bcd\u8bed\u8bed\u4e49\u8fdb\u884c\u5224\u65ad",\n            },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5df2\u6210\u529f" }} />\n                  <StateTag {...{ type: "default", text: "\u5df2\u53d6\u6d88" }} />\n                  <StateTag {...{ type: "danger", text: "\u5df2\u5931\u8d25" }} />\n                  <StateTag {...{ type: "progress", text: "\u5df2\u6682\u505c" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: "\u4f7f\u7528\u89c4\u5219", content: "\u5b8c\u5168\u6839\u636e\u8bed\u4e49\u8bed\u5883\u5224\u65ad" },\n            {\n              label: "\u793a\u4f8b",\n              content: (\n                <div>\n                  <StateTag {...{ type: "success", text: "\u5168\u90e8\u5230\u6b3e" }} />\n                  <StateTag {...{ type: "success", text: "\u90e8\u5206\u5230\u6b3e" }} />\n                  <StateTag {...{ type: "success", text: "\u7b80\u5386\u4eae\u70b9" }} />\n                  <StateTag {...{ type: "danger", text: "\u7b80\u5386\u98ce\u9669\u70b9" }} />\n                </div>\n              ),\n            },\n          ],\n        ]}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a},{name:"_Descriptions",packageName:"@components/Descriptions",component:o},{name:"lodash",packageName:"lodash",component:l},{name:"antd",packageName:"antd",component:d}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u6280\u80fd\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"skill"}\n        showBorder\n        showBackground={false}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u4e0b\u62c9\u83dc\u5355\u3001\u5f39\u7a97\u4e2d\u5df2\u9009\u7ed3\u679c\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"result"}\n        showBackground={false}\n        closable\n        onClose={() => console.log("close")}\n      />\n      <StateTag\n        text={"\u6280\u80fd\u6807\u7b7e"}\n        type={"result"}\n        closable\n        onClose={() => console.log("close")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u7b5b\u9009\u7ec4\u4ef6\u4e2d\u7b5b\u9009\u7ed3\u679c\u6807\u7b7e",code:'const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        filterName={"BD"}\n        text={"\u9648\u67ab\u6797\uff0c\u738b\u6653\u6668"}\n        type={"filterResult"}\n        closable\n        onClose={() => console.log("close")}\n      />\n      <br />\n      <StateTag\n        filterName={"\u6dfb\u52a0\u4eba"}\n        text={"\u9648\u67ab\u6797\uff0c\u738b\u6653\u6668\uff0c\u9648\u8def\uff0c\u5f20\u529b"}\n        type={"filterResult"}\n        closable\n        onClose={() => console.log("close")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a}]},{title:"\u57fa\u672c\u793a\u4f8b",description:"\u679a\u4e3e\u72b6\u6001\u6807\u7b7e",code:'const { StateTagEnum } = _StateTag;\nconst { PureGlobal } = global;\nconst { Space } = antd;\n\nconst BaseExample = ()=>{\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          testEnums: async ({ locale }) => {\n            console.log(locale);\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "1", description: "\u7b2c\u4e00\u9879", type: \'success\' },\n                  { value: "2", description: "\u7b2c\u4e8c\u9879", type: \'danger\' },\n                  { value: "3", description: "\u7b2c\u4e09\u9879", type: \'info\'},\n                ]);\n              }, 1000);\n            });\n          },\n        },\n      }}\n    >\n      <Space>\n        <StateTagEnum moduleName="testEnums" name="1" />\n        <StateTagEnum moduleName="testEnums" name="2" />\n        <StateTagEnum moduleName="testEnums" name="3" />\n      </Space>\n    </PureGlobal>\n  )\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_StateTag",packageName:"@components/StateTag",component:a},{name:"antd",packageName:"antd",component:d},{name:"global",packageName:"@components/Global",component:t(63743)}]}]}}},56026:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(25963),o=t(63743),l=t(82723),d=t(55199),r=t(21079);const i={name:"Drawer",summary:"<p>\u5c4f\u5e55\u8fb9\u7f18\u6ed1\u51fa\u7684\u6d6e\u5c42\u9762\u677f</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>\u5f39\u7a97\u7684footer\uff0c\u5f53\u5176\u88ab\u663e\u5f0f\u8bbe\u7f6e\u6210null\u4e14footerButtons\u6ca1\u6709\u8bbe\u7f6e\u8fc7\u65f6\u5f39\u7a97\u4e0d\u663e\u793afooter\u3002\u5f53\u5b83\u7c7b\u578b\u4e3afunction\u65f6\u53ef\u4ee5\u5f97\u5230close\u65b9\u6cd5\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>\u5f39\u7a97footer\u7684\u6309\u94ae\u533a\uff0c\u9ed8\u8ba4\u4e3a\u786e\u8ba4\u548c\u53d6\u6d88\u6309\u94ae\uff0c\u9ed8\u8ba4\u6309\u94ae\u5206\u522b\u54cd\u5e94onConfirm\u548conCancel\u65b9\u6cd5\uff0c\u5982\u679c\u81ea\u5b9a\u4e49\u8bbe\u7f6efooterButtons\u5219\u9700\u8981\u81ea\u884c\u4f20\u5165onClick\u53c2\u6570\uff0conConfirm\u548conCancel\u65b9\u6cd5\u5c06\u4e0d\u751f\u6548</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>\u5f39\u7a97\u5173\u95ed\u65f6\u8c03\u7528\uff0c\u5f39\u7a97\u53d7\u63a7\u65f6\u7531\u8be5\u65b9\u6cd5\u5c06\u5916\u90e8open\u72b6\u6001\u4fee\u6539</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>\u5f53footerButtons\u672a\u81ea\u5b9a\u4e49\u8bbe\u7f6e\u65f6\u70b9\u51fb\u786e\u8ba4\u6309\u94ae\u89e6\u53d1\u6267\u884c\u8be5\u65b9\u6cd5\uff0c\u5f53\u5176\u8fd4\u56dePromise\u70b9\u51fb\u540ePromise\uff0cresolve\u4e4b\u524d\u786e\u8ba4\u6309\u94ae\u663e\u793a\u4e3aloading\u72b6\u6001\uff0c\u8fd4\u56de\u503c\u4e3afalse\u6216\u8005Promise\u7684resolve\u503c\u4e3afalse\u65f6\u5f39\u7a97\u4e0d\u4f1a\u88ab\u5173\u95ed\uff0c\u5176\u4ed6\u60c5\u51b5\u5f39\u7a97\u9ed8\u8ba4\u5173\u95ed</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u548conConfirm\u7c7b\u4f3c\uff0c\u5176\u4e3a\u70b9\u51fb\u53d6\u6d88\u6309\u94ae\u89e6\u53d1</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5f39\u7a97\u5185\u5bb9\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230close\u548cwithDecorator\u8bbe\u7f6e\u7684props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>\u5f39\u7a97\u4fee\u9970\u5668\uff0c\u4f1a\u63a5\u6536\u5230\u5f39\u7a97children\u7684render\u65b9\u6cd5\uff0c\u53ef\u4ee5\u5728\u5176\u5916\u90e8\u6dfb\u52a0\u4fee\u9970\u5185\u5bb9\u540e\u6267\u884crender\u65b9\u6cd5\uff0c\u7ed9render\u65b9\u6cd5\u4f20\u5165\u7684\u503c\u53ef\u4ee5\u5728children,footer,rightOptions\u7c7b\u578b\u4e3afunction\u65f6\u63a5\u6536\u5230\u5bf9\u5e94\u7684\u53c2\u6570</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>\u70b9\u51fb\u8499\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd Drawer\u7ec4\u4ef6</p>\n<h3>AppDrawer</h3>\n<p>\u5168\u5c40\u62bd\u5c49\u5305\u88f9\u7ec4\u4ef6\uff0c\u63d0\u4f9b\u6d88\u8d39\u4e0a\u4e0b\u6587\u7684\u9ed8\u8ba4\u73af\u5883\uff0c\u63d0\u4f9b\u53ef\u6d88\u8d39 React context \u7684 drawer \u7684\u9759\u6001\u65b9\u6cd5\uff0c\u53ef\u4ee5\u7b80\u5316 useDrawer \u7b49\u65b9\u6cd5\u9700\u8981\u624b\u52a8\u690d\u5165 contextHolder \u7684\u95ee\u9898\u3002</p>\n<h3>useDrawer</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aDrawer\u7ec4\u4ef6\u7684\u65b9\u6cd5,\u524d\u7f6e\u6761\u4ef6\u662f\u9700\u8981\u518d\u5168\u5c40\u6ce8\u5165AppDrawer\u5305\u88f9\u7ec4\u4ef6</p>\n<h4>return:drawer</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>drawer</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aDrawer\u5f39\u7a97\uff0c\u53c2\u6570\u540cDrawer\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>DrawerButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faDrawer\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>drawerProps</td>\n<td>\u540cDrawer\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3adrawerProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!1,className:"Drawer_9b1ed",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Drawer, useDrawer, DrawerButton } = _Drawer;\nconst { Button, Space } = antd;\nconst { range } = lodash;\nconst { useRef, useState } = React;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst api = {\n  loader: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve([\n          {\n            label: "\u5185\u5bb91",\n            content:\n              "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91",\n          },\n          {\n            label: "\u5185\u5bb92",\n            content:\n              "\u5185\u5bb92\u5185\u5bb92\u5185\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n          { label: "\u5185\u5bb91", content: "\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91\u5185\u5bb91" },\n          {\n            label: "\u5185\u5bb92",\n            content: "\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92\u5185\u5bb92",\n          },\n        ]);\n      }, 1000);\n    });\n  },\n};\n\nconst BaseExample = () => {\n  const drawer = useDrawer();\n  const [open, setOpen] = useState(false);\n  return (\n    <Space>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        open \u7ec4\u4ef6\u6253\u5f00\n      </Button>\n      <Button\n        onClick={() => {\n          drawer({\n            title: "\u6807\u9898",\n            children: "\u6253\u5f00\u4e86\u4e00\u4e2a\u62bd\u5c49",\n          });\n        }}\n      >\n        hook \u6253\u5f00\n      </Button>\n      <DrawerButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684\u5f39\u7a97",\n            children: <Content list={data} col={1} />,\n          };\n        }}\n      >\n        \u6309\u94ae\u70b9\u51fb\u52a0\u8f7d\u6570\u636e\n      </DrawerButton>\n      <Drawer title="Basic Drawer" onClose={() => setOpen(false)} open={open}>\n        <p>Some contents...</p>\n        <p>Some contents...</p>\n        <p>Some contents...</p>\n      </Drawer>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_Drawer",packageName:"@components/Drawer",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:l},{name:"antd",packageName:"antd",component:d},{name:"lodash",packageName:"lodash",component:r}]}]}}},58419:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(81014),o=t(55199);const l={name:"LoadingButton",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5f53\u70b9\u51fb\u6309\u94ae\u65f6\uff0c\u9700\u8981\u663e\u793aloading\u72b6\u6001\uff0c\u5f53\u7136\u4f60\u53ef\u4ee5\u4f7f\u7528antd Button\u7684loading\u5c5e\u6027\uff0c\u4f46\u662f\u8fd9\u6837\u4f60\u9700\u8981\u81ea\u5df1\u58f0\u660e\u4e00\u4e2astate\u6765\u63a7\u5236\uff0cLoadingButton\u7ec4\u4ef6\u53ef\u4ee5\u5e2e\u4f60\u505a\u597d\u8fd9\u4ef6\u4e8b\u60c5</p>\n<h3>\u7279\u70b9</h3>\n<p>\u901a\u8fc7onClick\u8fd4\u56de\u7684Promise\u6765\u63a7\u5236Button\u7684loading\u72b6\u6001</p>\n<p>children\u9664\u4e86\u53ef\u4ee5\u4f20\u6b63\u5e38\u7684jsx\u4ee5\u5916\u8fd8\u63a5\u53d7function\u53c2\u6570\uff0c\u53ef\u4ee5\u63a5\u6536\u5230loading\u72b6\u6001\u4ee5\u4fbf\u6839\u636eloading\u72b6\u6001\u663e\u793a\u4e0d\u540c\u6587\u6848</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>onClick</td>\n<td>\u70b9\u51fb\u6309\u94ae\u89e6\u53d1\u51fd\u6570\uff0c\u53ef\u4ee5\u8fd4\u56de\u4e00\u4e2aPromise\uff0c\u5f53Promise\u518dpending\u72b6\u6001\u65f6Button\u5c06\u81ea\u52a8\u5904\u4e8eloading\u72b6\u6001\uff0c\u5f53Promise\u8fd4\u56de\u7ed3\u679c\u4f1a\u81ea\u52a8\u4eceloading\u5207\u6362\u56de\u666e\u901a\u72b6\u6001</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>Button\u7684\u5b50\u5143\u7d20\uff0c\u53ef\u4ee5\u4e3ajsx\u6216\u8005function\uff0c\u4e3afunction\u65f6\u53ef\u4ee5\u63a5\u6536\u5230loading\u72b6\u6001\u7528\u6765\u5207\u6362\u663e\u793a\u5185\u5bb9</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"LoadingButton_cd4ed",style:"",list:[{title:"\u5e26\u6709\u52a0\u8f7d\u72b6\u6001\u6309\u94ae",description:"\u70b9\u51fb\u6309\u94ae\u5207\u6362\u5230\u52a0\u8f7d\u72b6\u6001\uff0c\u52a0\u8f7d\u65b9\u6cd5\u5b8c\u6210\u540e\u81ea\u52a8\u5207\u6362\u4e3a\u666e\u901a\u72b6\u6001",code:'const { default: LoadingButton } = _LoadingButton;\nconst { Space, message } = antd;\n\nconst clickHandler = () => {\n  message.success("\u70b9\u51fb\u6309\u94ae1s\u540e\u5b8c\u6210\u52a0\u8f7d");\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      message.success("\u5b8c\u6210");\n      resolve();\n    }, 1000);\n  });\n};\nconst BaseExample = () => {\n  return (\n    <Space wrap>\n      <LoadingButton onClick={clickHandler}>\u6309\u94ae</LoadingButton>\n      <LoadingButton onClick={clickHandler}>\n        {(isLoading) => (isLoading ? "\u6b63\u5728\u52a0\u8f7d\u4e2d..." : "\u5207\u6362\u52a0\u8f7d\u6587\u6848")}\n      </LoadingButton>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_LoadingButton",packageName:"@components/LoadingButton",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},62902:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(43856),o=t(55199),l=t(87558),d=t(21079);const r={name:"Common",summary:"<p>\u4e3a\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u901a\u7528\u7684\u7ec4\u4ef6\u3001\u65b9\u6cd5\u3001hooks</p>\n<h3>\u7ec4\u4ef6</h3>\n<ol>\n<li>FetchButton Button\u89e6\u53d1\u52a0\u8f7d\u6570\u636e</li>\n<li>ScrollLoader \u4e0b\u62c9\u6eda\u52a8\u52a0\u8f7d\u7ec4\u4ef6</li>\n<li>SearchInput \u63d0\u4f9b\u9632\u6296\u7684\u67e5\u8be2\u8f93\u5165\u6846</li>\n<li>SimpleBarBox</li>\n</ol>\n<h3>\u65b9\u6cd5</h3>\n<ol>\n<li>changeMoneyToChinese \u5c06\u91d1\u989d\u8f6c\u5316\u4e3a\u5927\u5199\u7684\u4eba\u6c11\u5e01\u91d1\u989d</li>\n<li>getPopupContainer</li>\n<li>getScrollEl</li>\n<li>getContainerBody</li>\n</ol>\n<h3>hooks</h3>\n<ol>\n<li>withOSSFile</li>\n</ol>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"Common_d13bc",style:".Common_d13bc .scroll-list {\n  max-height: 300px;\n}",list:[{title:"FetchButton",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const Common = _Common;\n\nconst { FetchButton } = Common;\n\nconst BaseExample = () => {\n  return (\n    <FetchButton\n      api={{\n        loader: () => {\n          return [\n            { label: "1", content: "11" },\n            { label: "2", content: "22" },\n          ];\n        },\n      }}\n      modalProps={({ data }) => {\n        console.log(data);\n        alert(JSON.stringify(data));\n        return {\n          children: (\n            <div>\n              <div>\u6211\u662f\u4e00\u4e2a\u5f39\u7a97</div>\n              <div>{data[0].label}</div>\n              <div>{data[0].content}</div>\n              <div>{data[1].label}</div>\n              <div>{data[1].content}</div>\n            </div>\n          ),\n        };\n      }}\n      modalFunc={() => {}}\n    >\n      FetchButton\n    </FetchButton>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a}]},{title:"Enum",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const Common = _Common;\nconst { Space } = _antd;\n\nconst { AddressEnum, FunctionEnum, IndustryEnum } = Common;\n\nconst BaseExample = () => {\n  return (\n    <Space direction={"vertical"}>\n      <AddressEnum name={"010"} />\n      <FunctionEnum name={"010"} />\n      <IndustryEnum name={"010"} />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"_antd",packageName:"antd",component:o}]},{title:"ScrollLoader",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { get, merge, range } = lodash;\nconst Common = _Common;\nconst { default: Fetch } = _reactFetch;\n\nconst { ScrollLoader } = Common;\n\nconst BaseExample = () => {\n  console.log(Fetch, _reactFetch);\n  return (\n    <Fetch\n      loader={({ data }) => {\n        const params = Object.assign(\n          {\n            perPage: 20,\n            currentPage: 1,\n          },\n          data\n        );\n        return new Promise((resolve) => {\n          const start = (params.currentPage - 1) * params.perPage;\n          setTimeout(() => {\n            resolve({\n              totalCount: 100,\n              pageData: range(start, start + params.perPage).map((key) => {\n                return {\n                  label: `\u7b2c${key + 1}\u9879`,\n                  value: key + 1,\n                };\n              }),\n            });\n          }, 500);\n        });\n      }}\n      render={(fetchApi) => {\n        const pagination = {\n          paramsType: "data",\n          current: "currentPage",\n          pageSize: "perPage",\n          defaultPageSize: 20,\n        };\n        const current = get(\n            fetchApi.requestParams,\n            [pagination.paramsType, pagination.current],\n            1\n          ),\n          pageSize =\n            get(fetchApi.requestParams, [\n              pagination.paramsType,\n              pagination.pageSize,\n            ]) || pagination.defaultPageSize;\n\n        const formatData = {\n          list: fetchApi.data.pageData,\n          total: fetchApi.data.totalCount,\n        };\n        return (\n          <ScrollLoader\n            completeTips=""\n            className="scroll-list"\n            isLoading={!fetchApi.isComplete}\n            noMore={!formatData.total || current * pageSize >= formatData.total}\n            onLoader={async () => {\n              await fetchApi.loadMore(\n                merge({\n                  data: {\n                    [pagination.pageSize]: pageSize,\n                    [pagination.current]: current + 1,\n                  },\n                }),\n                (data, newData) => {\n                  return Object.assign({}, newData, {\n                    pageData: data.pageData.concat(newData.pageData),\n                  });\n                }\n              );\n            }}\n          >\n            {formatData.list.map((item) => {\n              return <div>{item.label}</div>;\n            })}\n          </ScrollLoader>\n        );\n      }}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"_reactFetch",packageName:"@kne/react-fetch",component:l},{name:"lodash",packageName:"lodash",component:d}]},{title:"SearchInput",description:"\u641c\u7d22\u6846",code:'const Common = _Common;\n\nconst { SearchInput } = Common;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [value, setValue] = useState("");\n  return (\n    <SearchInput\n      value={value}\n      onSearch={(value) => {\n        setValue(value);\n        console.log(value);\n      }}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a}]},{title:"AdvancedSelect",description:"\u9ad8\u7ea7\u9009\u62e9",code:'const { UserField } = _Common;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <UserField\n        defaultValue={[1]}\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectAll\n        showSelectedCount\n        countUnit="\u4eba"\n        allLabel="\u6240\u6709\u4eba"\n        showSelectedTag={false}\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"SuperSelect",description:"\u65b0\u7248\u9ad8\u7ea7\u9009\u62e9",code:'const { SuperSelectField, SuperSelectTableListField, SuperSelectUserField } =\n  _Common;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <SuperSelectUserField\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectedAll\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n      <SuperSelectField\n        isPopup={false}\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        allowSelectedAll\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: "\u7528\u6237\u4e00",\n                  value: 1,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e8c",\n                  value: 2,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n                {\n                  label: "\u7528\u6237\u4e09",\n                  value: 3,\n                  description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n      <SuperSelectTableListField\n        isPopup={false}\n        labelKey="name"\n        valueKey="id"\n        getSearchCallback={(searchProps, item, contextProps) => {\n          const { props } = contextProps;\n          const { labelKey } = props;\n          if (!searchProps.searchText) {\n            return true;\n          }\n          return item[labelKey].indexOf(searchProps.searchText) > -1;\n        }}\n        options={Array.from({ length: 20 }).map((item, key) => {\n          return {\n            id: key + 1,\n            name: `\u540d\u79f0${key + 1}`,\n            count: key + 1,\n            description: `\u63cf\u8ff0${key + 1}`,\n            disabled: key === 1,\n          };\n        })}\n        columns={[\n          {\n            name: "name",\n            title: "\u540d\u79f0",\n            span: 8,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            span: 8,\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            span: 8,\n          },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Common",packageName:"@components/Common",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},68223:(n,e,t)=>{t.d(e,{A:()=>p});var a=t(96252),o=t(63743),l=t(3382),d=t(21079),r=t(55199),i=t(87558),s=t(82723),c=t(64671),m=t(57469);const p={name:"FormInfo",summary:'<p>\u8868\u5355\u63a7\u4ef6\uff0c\u81ea\u5e26\u6570\u636e\u57df\u7ba1\u7406\u3002\u5305\u542b\u6570\u636e\u5f55\u5165\u3001\u6821\u9a8c\u4ee5\u53ca\u5bf9\u5e94\u6837\u5f0f</p>\n<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<ul>\n<li>\u7528\u4e8e\u521b\u5efa\u6216\u7f16\u8f91\u4e00\u4e2a\u5b9e\u4f53\u6216\u6536\u96c6\u4fe1\u606f</li>\n<li>\u9700\u8981\u5bf9\u8f93\u5165\u7684\u6570\u636e\u7c7b\u578b\u8fdb\u884c\u6821\u9a8c\u65f6</li>\n</ul>\n<h3>\u6982\u5ff5</h3>\n<ul>\n<li>Form Data\uff1a\nForm\u63d0\u4ea4\u65f6\u83b7\u53d6\u5230\u7684\u8f93\u51fa\u503c\u901a\u5e38\u7528\u6765\u63d0\u4ea4\u7ed9\u540e\u7aef\uff0c\u4e0d\u5305\u542bForm\u7684\u6821\u9a8c\u4fe1\u606f\uff0c\u53ea\u5305\u542bForm\u7ec4\u4ef6\u53ef\u4ee5\u5411\u5916\u90e8\u63d0\u4f9b\u7684\u6570\u636e\u8f93\u51fa\u4fe1\u606f\u3002</li>\n<li>Form State\uff1a\nForm\u4e2d\u7528\u6765\u5b58\u50a8\u4e00\u5207\u72b6\u6001\u7684\u503c\uff0c\u5305\u542bField\u4fe1\u606f\uff0c\u6821\u9a8c\u4fe1\u606f\uff0cForm\u7684\u503c\uff08\u9700\u8981\u4e00\u5b9a\u7684\u8f6c\u6362\u4ece\u624d\u80fd\u53d8\u6210Form Data\uff09\uff0c\u8868\u5355\u662f\u5426\u9a8c\u8bc1\u901a\u8fc7\uff0c\u8868\u5355\u9519\u8bef\u4fe1\u606f\u7b49\u503c\u3002</li>\n<li>\u5b57\u6bb5\u6216\u79f0Field\uff1a\nForm\u4e2d\u7684\u4e00\u4e2a\u9879\uff0c\u5fc5\u987b\u62e5\u6709\u53c2\u6570name,label,\u53ef\u9009\u53c2\u6570rule\u3002name\u4f5c\u4e3aForm\u63d0\u4ea4\u65f6\u83b7\u53d6\u5230data\u7684key\u503c\u3002\nlabel\u4e3a\u5b57\u6bb5\u5c55\u793a\u7ed9\u7528\u6237\u7684\u540d\u5b57\u4ee5\u53ca\u5b57\u6bb5\u62a5\u9519\u65f6\u63d0\u793a\u7528\u6237\u9519\u8bef\u7684\u8bed\u53e5\u4e2d\u6307\u4ee3\u8be5\u5b57\u6bb5\u7684\u540d\u5b57\u3002\nrule\u4e3a\u4e0b\u65b9\u4ecb\u7ecd\u7684RULE\u3002\n\u4e00\u4e2aField\u7684\u53d6\u503c\u53ef\u4ee5\u662f\u7b80\u5355\u7684Number\uff0cBoolean\uff0cString\u4e5f\u53ef\u4ee5\u662f\u590d\u6742\u7684Array\uff0cObject\u7b49\uff0c\u6240\u4ee5\u5728\u8003\u8651\u4e00\u4e9b\u503c\u9700\u8981\u5206\u6210\u591a\u4e2aField\u8fd8\u662f\u96c6\u4e2d\u5728\u4e00\u4e2aField\u65f6\u975e\u5e38\u91cd\u8981\u7684\u3002\n\u4e00\u4e2a\u901a\u7528\u7684\u89c4\u5219\u662f\uff1a<em><strong>\u5bf9\u4e8eForm\u6765\u8bf4\uff0c\u5b83\u7684\u6700\u5c0f\u6821\u9a8c\u5355\u5143\u662f\u4e00\u4e2aField</strong></em>\u3002</li>\n<li>Field\u7ec4\u4ef6\uff1a\nField\u7ec4\u4ef6\u662fField\u7684\u4e00\u90e8\u5206\uff0c\u53ef\u4ee5\u7531\u7528\u6237\u81ea\u5df1\u5b9e\u73b0\u4e5f\u53ef\u4ee5\u7531\u7ec4\u4ef6\u5e93\u63d0\u4f9b\uff0c\u901a\u8fc7Form\u63d0\u4f9b\u7684Field hooks\u5c06\u5176\u53d8\u6210Field\u3002\nfield hooks\u4e3b\u8981\u63a5\u7ba1Field\u7ec4\u4ef6\u7684value\uff0conChange\u53c2\u6570\uff0c\u7528\u6765\u628aField\u7ec4\u4ef6\u7684\u503c\u83b7\u53d6\u5230Form\u7ba1\u7406\u3002Field\u7ec4\u4ef6\u5fc5\u987b\u4e3a<em><strong>\u53d7\u63a7\u7ec4\u4ef6</strong></em>\u3002\nfield hooks\u8fd8\u4f1a\u63a5\u7ba1triggerValidate\uff0c\u7528\u6765\u83b7\u53d6Field\u7684\u6821\u9a8c\u65f6\u673a\u3002field hooks\u4f1a\u5411Field\u7ec4\u4ef6\u63d0\u4f9bField\u7684\u6821\u9a8c\u72b6\u6001\u548c\u6821\u9a8c\u9519\u8bef\u4fe1\u606f\u3002</li>\n<li>RULE\uff1a\n\u7528\u4e8e\u5b57\u6bb5\u7684\u6821\u9a8c\u3002RULE\u53ef\u4ee5\u4e3a\u4e00\u4e2afunction\u6216\u8005\u6b63\u5219\u8868\u8fbe\u5f0f\uff0c\u4e0d\u8fc7\u63a8\u8350\u4ee5\u5927\u5199\u5b57\u7b26\u4e32\u8c03\u7528\u3002\n\u5b57\u7b26\u4e32\u5f62\u5f0f\u7684RULE\u4ee5\u7a7a\u683c\u4e3a\u95f4\u9694\u53ef\u4ee5\u4f20\u5165\u591a\u6761\u89c4\u5219\uff0c\u5982\uff1a"REQ TEL"\uff0c\n\u6267\u884c\u6821\u9a8c\u65f6\u4f1a\u4ece\u5de6\u81f3\u53f3\u4f9d\u6b21\u6821\u9a8c\uff0c\u5982\u679c\u5de6\u4fa7\u7684\u89c4\u5219\u6821\u9a8c\u5931\u8d25\u5219\u4e0d\u518d\u6267\u884c\u5176\u53f3\u4fa7\u89c4\u5219\uff0c\u8fd4\u56de\u6821\u9a8c\u5931\u8d25\u72b6\u6001\u53ca\u8be5\u89c4\u5219\u5931\u8d25\u539f\u56e0\u63d0\u793a\u4f5c\u4e3a\u5b57\u6bb5\u6821\u9a8c\u5931\u8d25\u539f\u56e0\u3002\n\u5b57\u7b26\u4e32RULE\u5141\u8bb8\u4f20\u5165\u53c2\u6570\uff0c\u53c2\u6570\u4ee5\u4e2d\u5212\u7ebf\u9694\u5f00\uff0c\u53ef\u4f20\u5165\u591a\u4e2a\u53c2\u6570\uff0c\u5982\uff1a"LEN-3-10"\u3002\n\u5b57\u7b26\u4e32RULE\u4f7f\u7528\u524d\u5fc5\u987b\u5728Form\u7ec4\u4ef6\u4e2d\u6709\u6240\u58f0\u660e\uff0cForm\u7684RULE\u58f0\u660e\u67093\u4e2a\u7ea7\u522b\uff1a\n\u9ed8\u8ba4\u7ea7\uff0c\u5305\u542b\u4e8eForm\u5185\u90e8\uff0c\u63d0\u4f9b\u4e86\u4e00\u4e9b\u57fa\u672c\u7684\u6821\u9a8c\u89c4\u5219\u3002preset\u7ea7\uff1a\u5728\u9879\u76ee\u7684preset\u4e2d\u58f0\u660e\uff0c\u5e94\u8be5\u628a\u9879\u76ee\u4e2d\u5e38\u7528\u7684\u6216\u8005\u662f\u6bd4\u8f83\u590d\u6742\u7684RULE\u58f0\u660e\u96c6\u4e2d\u7ef4\u62a4\u4e8e\u6b64\u3002\nForm\u7ea7\uff1a\u4ee5rules\u53c2\u6570\u4f20\u5165Form\u7ec4\u4ef6\uff0c\u4e3b\u8981\u662f\u67d0Form\u5355\u72ec\u4f7f\u7528\u7684RULE\u3002\n\u5982\u679c\u58f0\u660e\u5b57\u7b26\u76f8\u540c\uff0c\u4f1a\u4ee5 Form\u7ea7&gt;preset\u7ea7&gt;\u9ed8\u8ba4\u7ea7 \u8fdb\u884c\u8986\u76d6\u3002\nRULE\u58f0\u660e\u4e3a\u4e00\u4e2a\u5bf9\u8c61\uff0ckey\u548c\u53bb\u6389\u53c2\u6570\u7684\u5b57\u7b26\u4e32RULE\u76f8\u540c\uff0cvalue\u4e3a\u4e00\u4e2afunction\u79f0\u4e3a\u6821\u9a8c\u51fd\u6570\u3002\u6b64function\u63a5\u6536\u5230\u7684\u53c2\u6570\u6709\u4e09\u90e8\u5206(\nvalue,[...args]\n,{data,{field}}),\u7b2c\u4e00\u4e2a\u53c2\u6570value\u4e3a\u5f53\u524d\u5b57\u6bb5\u7684\u503c\uff0c\u6700\u540e\u4e00\u4e2a\u53c2\u6570\u4e3aform\u7684\u72b6\u6001\uff0cdata\u662fform\u7684\u5f53\u524d\u503c\uff0cfield\u662fform\u91cc\u9762\u5f53\u524d\u5b57\u6bb5\u7684\u4fe1\u606f\uff0c\n\u4e2d\u95f4\u53c2\u6570args\u4e3a\u5b57\u7b26\u4e32\u53c2\u6570\u5982\uff1a"LEN-3-10"\u4f1a\u63a5\u6536\u52303\u548c20\u4e24\u4e2a\u53c2\u6570\u3002\u6821\u9a8c\u51fd\u6570\u8fd4\u56de{result,errMsg}\uff0c\n\u6216\u8005\u4e00\u4e2aPromise.resolve({result,errMsg})\u7684Promise\u5bf9\u8c61\u3002result\u4e3a\u6821\u9a8c\u662f\u5426\u901a\u8fc7\uff0cerrMsg\u4e3a\u5931\u8d25\u63d0\u793a\uff0c\u5931\u8d25\u63d0\u793a\u53ef\u4ee5\u7528%s\u5360\u4f4d\uff0c\u5c55\u793a\u65f6\u4f1a\u66ff\u6362\u6210\u5b57\u6bb5\u7684label\u3002</li>\n<li>\u6821\u9a8c\u6216\u79f0Validate\uff1a\nForm\u4f1a\u5728Field\u7ec4\u4ef6\u6267\u884ctriggerValidate\u65f6\u6267\u884c\u5f53\u524dField\u7684Validate\uff0c\u8868\u5355\u63d0\u4ea4\u65f6\u6267\u884c\u6240\u6709Field\u7684Validate\u3002\nValidate\u4f1a\u4e32\u884c\u6267\u884cRULE\u91cc\u9762\u7684\u6240\u6709\u89c4\u5219\u7684\u6821\u9a8c\u51fd\u6570\uff0c\u6821\u9a8c\u51fd\u6570\u8fd4\u56dePromise\u65f6\u4e5f\u4f1a\u7b49\u5f85\u5de6\u8fb9\u7684\u6821\u9a8c\u51fd\u6570\u7684Promise\u5b8c\u6210\u518d\u6267\u884c\u53f3\u8fb9\u7684\u89c4\u5219\u6821\u9a8c\u51fd\u6570\u3002\n\u8868\u5355\u63d0\u4ea4\u65f6\uff0c\u6b63\u5728\u6267\u884c\u5f02\u6b65\u7684\u6821\u9a8c\u51fd\u6570\u7684Field\u5c06\u4e0d\u4f1a\u91cd\u590d\u6267\u884cValidate\u3002\u8868\u5355\u63d0\u4ea4\u65f6\u6240\u6709Field\u7684\u6821\u9a8c\u72b6\u6001\u4e3a\u901a\u8fc7\u65f6\u624d\u4f1a\u6267\u884conSubmit\u65b9\u6cd5\uff0c\u5426\u5219\u4f1a\u6267\u884conError\u65b9\u6cd5\uff0c\nonPrevSubmit\u65b9\u6cd5\u5728\u7528\u6237\u70b9\u51fb\u63d0\u4ea4\u6309\u94ae\u65f6\u5c31\u4f1a\u89e6\u53d1\uff0c\u4e0d\u7ba1Validate\u7ed3\u679c\u662f\u5426\u4e3a\u901a\u8fc7\u3002</li>\n<li>Event\uff1a\nForm\u91c7\u7528\u4e86\u4e8b\u4ef6\u9a71\u52a8\u7684\u65b9\u5f0f\u6765\u8bbe\u8ba1\uff0c\u7528\u4ee5\u6ee1\u8db3\u591a\u79cd\u5f02\u6b65\u6821\u9a8c\uff0c\u548c\u7ed9Form\u63d0\u4f9b\u5f3a\u5927\u7684\u53ef\u6269\u5c55\u6027\u3002\nForm\u7684API\u91cc\u9762\u53ef\u4ee5\u83b7\u53d6\u5230\u7684emitter\u5c31\u662fForm\u5185\u90e8\u7684\u4e8b\u4ef6\u53d1\u5c04\u5668\uff0c\u53ef\u4ee5\u89e6\u53d1Form\u5185\u90e8\u5b9a\u4e49\u7684\u4e8b\u4ef6\uff0c\u4e5f\u53ef\u4ee5\u81ea\u5b9a\u4e49\u4e00\u4e9b\u4e8b\u4ef6\u3002\u540c\u65f6\u53ef\u4ee5\u901a\u8fc7emitter.addListener\u76d1\u542c\u4e8b\u4ef6\u3002\nForm\u5185\u90e8\u5b9a\u4e49\u7684\u4e8b\u4ef6\u6709\uff1a\nform-field-add\uff1aField\u88ab\u6dfb\u52a0\u8fdbForm\u65f6\u89e6\u53d1\uff0c\nform-field-edit\uff1aField\u7684\u53c2\u6570\u53d1\u751f\u6539\u53d8\u65f6\u89e6\u53d1\uff0c\norm-field-remove\uff1aField\u88ab\u5378\u8f7d\u65f6\u89e6\u53d1\uff0c\nform-field-validate\uff1aField\u6267\u884cValidate\u65f6\u89e6\u53d1\uff0c\nform-field-data-change\uff1aField\u7684\u503c\u53d1\u751f\u4fee\u6539\u65f6\u89e6\u53d1\uff0c\nform-data-reset\uff1aForm\u7ec4\u4ef6\u91cd\u7f6edata\u65f6\u89e6\u53d1\uff0c\nform-data-set-field\uff1aForm\u7ec4\u4ef6\u7ed9data\u8d4b\u503c\u65f6\u89e6\u53d1\uff0c\nform-data-set-field-validate\uff1aField\u88ab\u8d4b\u503c\u65f6\u89e6\u53d1\uff0c\nform-validate-all\uff1aForm\u6267\u884c\u5168\u90e8Field\u7684Validate\u65f6\u89e6\u53d1\uff0c\u4e00\u822c\u4e3a\u8868\u5355\u63d0\u4ea4\u65f6\uff0c\nform-submit\uff1a\u8868\u5355\u63d0\u4ea4\u65f6\u89e6\u53d1\u3002</li>\n<li>\u62e6\u622a\u5668\u6216\u79f0Interceptor\uff1a\n\u6ca1\u6709Field\u53ef\u4ee5\u63a5\u6536\u4e00\u4e2ainterceptor\u53c2\u6570\uff0c\u5b57\u7b26\u4e32\u7c7b\u578b\uff0c\u548cRULE\u7c7b\u4f3c\u53ef\u4ee5\u518dpreset\u6216\u8005Form\u7684interceptors props\u4e2d\u58f0\u660e\u4ee5\u540e\u4f7f\u7528\uff0c\u53ef\u4ee5\u914d\u7f6e\u591a\u4e2a\u7528\u7a7a\u683c\u8fde\u63a5\u3002\n\u62e6\u622a\u5668\u7684\u4f5c\u7528\u662f\uff0c\u5728Field\u63a5\u6536\u5230\u4e00\u4e2a\u65b0\u7684\u503c\u65f6\uff0c\u4f1a\u4e32\u884c\u6267\u884c\u62e6\u622a\u5668\u7684output\u90e8\u5206\uff0c\u628a\u5176\u8fd4\u56de\u503c\u8f93\u51fa\u5230Form Data\u3002\n\u5728\u6267\u884cForm Data\u7684\u8d4b\u503c\u64cd\u4f5c\u65f6\u628a\u8d4b\u503c\u4f5c\u4e3a\u8f93\u5165\u4e32\u884c\u6267\u884c\u62e6\u622a\u5668\u7684input\u90e8\u5206\uff0c\u628a\u5176\u7ed3\u679c\u4f5c\u4e3aForm Data\u7684\u8f93\u5165\u3002\n\u73b0\u5728\u6709\u4e2aField\u662f\u65e5\u671f\u9009\u62e9\uff0c\u8f93\u51faDate\u7c7b\u578b\u503c\uff0c\u4f46\u662fForm Data\u8f93\u51fa\u5e0c\u671b\u5c06\u5176\u683c\u5f0f\u5316\u4e3a\u65e5\u671f\u5b57\u7b26\u4e32\uff0c\u5728\u8868\u5355\u7f16\u8f91\u65f6Form\nData\u8f93\u5165\u683c\u5f0f\u5316\u540e\u7684\u65e5\u671f\u5b57\u7b26\u4e32\uff0c\u4f46\u662fField\u53ea\u63a5\u6536Date\u7c7b\u578b\u7684\u503c\uff0c\n\u4ee5\u4e0b\u4f8b\u5b50\u53ef\u4ee5\u6765\u89e3\u51b3\u6b64\u95ee\u9898\uff1a<pre><code class="language-jsx">interceptors.input.use("date-string", (value) =&gt; {\n  return value ? new Date(value) : null;\n});\n\ninterceptors.output.use("date-string", (value) =&gt; {\n  return value ? dayjs(value).format("YYYY-MM-DD") : "";\n});\n\n&lt;Field name="date" label="\u65e5\u671f" interceptor="date-string"/&gt;\n</code></pre>\n</li>\n<li>Group\uff1a\n\u5f53Form\u7684data\u9700\u8981\u63a5\u6536\u5230\u4e00\u4e2a\u590d\u6742\u503c\u7684\u65f6\u5019\uff0c\u53ef\u4ee5\u4f7f\u7528Group\u6765\u5b9e\u73b0\uff0c\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="baseInfo"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{name:"xxx",des:"xxx"}}\uff0cGroup\u7684name\u548cField\u7684name\u4e00\u81f4\u65f6\u4e5f\u53ef\u4ee5\u7528\u6765\u8868\u793a\u6570\u7ec4\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="name"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n&lt;/Group&gt;\n&lt;Group name="des"&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {name:["name1","name2"],des:["des1","des2"]}\u3002\nGroup\u53ef\u4ee5\u5d4c\u5957\uff0c\u5982<pre><code class="language-jsx">&lt;Group name="baseInfo"&gt;\n  &lt;Group name="info"&gt;\n    &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;/Group&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{info:{name:\'xxx\'},des:\'xxx\'}}\u3002\n\u652f\u6301\u70b9\u64cd\u4f5c\uff0c\u5982\uff1a<pre><code class="language-jsx">&lt;Group name="baseInfo.info"&gt;\n  &lt;Field name="name" label="\u540d\u79f0"/&gt;\n  &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230 {baseInfo:{info:{name:\'xxx\',des:\'xxx\'}}}\u3002</li>\n<li>GroupList\uff1a\n\u4f7f\u7528Group\u5b9e\u73b0\u7684\u4e00\u4e2a\u7279\u6b8a\u7684\u533a\u57df\u7528\u6765\u66f4\u65b9\u4fbf\u7684\u5b9e\u73b0\u591a\u6bb5\u5f0f\u7684\u8868\u5355\u5982\uff1a<pre><code class="language-jsx">&lt;Button onClick={()=&gt;ref.current.onAdd()}&gt;\u6dfb\u52a0&lt;/Button&gt;\n&lt;GroupList name="edu" ref={ref}&gt;\n  {(key,{index,length,onAdd,onRemore})=&gt;&lt;&gt;\n    &lt;Button onClick={onRemore}&gt;\u5220\u9664&lt;/Button&gt;\n    &lt;Field name="schoolName" label="\u5b66\u6821\u540d\u79f0"/&gt;\n    &lt;Field name="degree" label="\u5b66\u5386"/&gt;\n    &lt;Field name="des" label="\u8bf4\u660e"/&gt;\n  &lt;/&gt;}\n&lt;/GroupList&gt;\n</code></pre>\n\u4ee5\u4e0a\u662f\u4e00\u4e2a\u7b80\u5386\u7684\u5b66\u5386\u5217\u8868\u7684\u5b9e\u73b0\uff0c\u53ef\u4ee5\u70b9\u51fb\u6dfb\u52a0\u6309\u94ae\u6dfb\u52a0\u591a\u6bb5\u5b66\u5386Field\uff0c\u53ef\u4ee5\u70b9\u51fb\u5220\u9664\u6309\u94ae\u5220\u9664\u5f53\u524d\u4e00\u6bb5\u5b66\u5386Field\uff0c\nForm\u7684data\u53ef\u4ee5\u63a5\u6536\u5230\u7684 {edu:[{schoolName:\'xxx\',degree:\'xxx\',des:\'xxx\'}]}\u3002\n\u5f53\u7136\u4f60\u53ef\u4ee5\u4e0d\u7528\u4f7f\u7528\u8fd9\u6837\u5e95\u5c42\u7684API\uff0cFormInfo.List \u5df2\u7ecf\u5e2e\u4f60\u5904\u7406\u597d\u4e00\u5207\u3002</li>\n</ul>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u96c6\u4e2d\u5316\u6821\u9a8c\u89c4\u5219\u7ba1\u7406\uff0c\u5206\u5c42\u62bd\u8c61\uff0c\u8c03\u7528\u7b80\u4fbf</li>\n<li>\u652f\u6301\u5f02\u6b65\u6821\u9a8c\u89c4\u5219</li>\n<li>\u4e8b\u4ef6\u9a71\u52a8\u5f0f\u67b6\u6784\u8bbe\u8ba1\uff0c\u4fbf\u4e8e\u6269\u5c55</li>\n<li>\u652f\u6301Group\u53caGroupList\uff0c\u53ef\u8f7b\u677e\u5b9e\u73b0\u590d\u6742\u8868\u5355</li>\n<li>UI\uff0c\u6821\u9a8c\u903b\u8f91\u5206\u5c42\u62bd\u8c61\uff0c\u4e00\u6b21\u5c01\u88c5\u4f7f\u7528\u7b80\u5355</li>\n<li>context\u548cref\u53cc\u91cdAPI\u66b4\u9732\uff0c\u5728Form\u5185\u8fd8\u662fForm\u5916\u90fd\u80fd\u8f7b\u677e\u83b7\u53d6</li>\n<li>form-helper\u63d0\u4f9b\u57fa\u672c\u7684\u8868\u5355\u5c01\u88c5\uff0c\u7075\u6d3b\u7ec4\u5408</li>\n<li>\u652f\u6301\u62e6\u622a\u5668\uff0c\u4fbf\u6377\u5b9e\u73b0FormData\u548cField\u7684\u503c\u4e4b\u95f4\u7684\u8f6c\u6362</li>\n</ul>\n<h3>Field\u5b9e\u73b0\u89c4\u8303</h3>\n<ul>\n<li>FormInfo\u91cc\u9762\u7684Field\u90fd\u4f1a\u653e\u7f6e\u5728fields\u6587\u4ef6\u5939\uff0c\u5176\u4e2d\u6bcf\u4e2a\u6587\u4ef6\u5939\u4ee3\u8868\u4e00\u4e2aField</li>\n<li>\u4e00\u4e2aField\u53ea\u80fd\u9ed8\u8ba4\u5bfc\u51fa\u4f1a\u88ab\u5f15\u7528\uff0c\u5176\u4ed6\u7684\u65b9\u6cd5\u679a\u4e3e\u7b49\u9700\u8981\u653e\u7f6e\u5728\u9ed8\u8ba4\u5bfc\u51fa\u7684\u7ec4\u4ef6\u7684function\u7684\u9759\u6001\u5c5e\u6027\u4e0a</li>\n<li>\u4e00\u4e2aField\u7684\u9ed8\u8ba4\u5bfc\u51fa\u7ec4\u4ef6\u53ea\u80fd\u88ab\u653e\u7f6e\u5728Form\u4e2d\u4f5c\u4e3aField\u88ab\u4f7f\u7528\uff0c\u5b83\u7684Field\u7ec4\u4ef6\u4f1a\u88ab\u6302\u8f7d\u5728\u9ed8\u8ba4\u5bfc\u51fa\u7684\u7ec4\u4ef6\u7684function\u7684Field\u9759\u6001\u5c5e\u6027\u4e0a</li>\n<li>\u4e00\u4e2aField\u7684Field\u7ec4\u4ef6\u5fc5\u987b\u652f\u6301\u53d7\u63a7\u548c\u975e\u53d7\u63a7\u4e24\u79cd\u5f62\u5f0f</li>\n<li>\u4e00\u4e2aField\u7684\u5bfc\u51fa\u5fc5\u987b\u88ab\u5305\u542b\u5728FormInfo\u5bfc\u51fa\u7684formModule\u4e2d\u548cFormInfo\u4e2d\uff0c\u5373\uff1a\u4ee5\u4e0b\u4e24\u79cd\u65b9\u6cd5\u90fd\u53ef\u4ee5\u83b7\u53d6\u5230\u8be5Field<pre><code class="language-jsx">import {SomeField} from "@component/FormInfo";\n</code></pre>\n<pre><code class="language-jsx">import {formModule} from "@component/FormInfo";\nconst {SomeField} = formModule;\n</code></pre>\n</li>\n</ul>\n<h3>\u9009\u62e9\u5668\u7c7b\u578bField\u7ec4\u4ef6\u5b9e\u73b0\u89c4\u8303</h3>\n<ul>\n<li>\u5fc5\u987b\u4f7f\u7528SelectInnerInput\u4f5c\u4e3a\u9009\u62e9\u5668\u7684\u503c\u663e\u793a\u548c\u89e6\u53d1\u7684\u8f93\u5165\u6846</li>\n<li>SelectInnerInput\u53ef\u4ee5\u901a\u8fc7isPopup\u63d0\u4f9bpopup\u548cmodal\u4e24\u79cd\u5c55\u793a\u5f62\u6001\u548c\u4ea4\u4e92\u903b\u8f91\uff0cField\u7ec4\u4ef6\u53ef\u4ee5\u901a\u8fc7\u81ea\u8eab\u7684\u9ed8\u8ba4\u503c\u6216\u8005\u8c03\u7528SelectInnerInput\u65f6\u663e\u5f0f\u6307\u5b9a\u6765\u8bbe\u7f6e\u6700\u4f73\u63a8\u8350\u7684\u9ed8\u8ba4\u5f62\u5f0f\uff0c\u4e00\u822c\u60c5\u51b5\u4e00\u79cd\u9009\u62e9\u5668\u9700\u8981\u826f\u597d\u652f\u6301\u4e24\u79cd\u5f62\u5f0f</li>\n<li>SelectInnerInput\u53ef\u4ee5\u901a\u8fc7single\u51b3\u5b9a\u8f93\u51fa\u503c\u662f\u5355\u9879\u8fd8\u662f\u591a\u9879\uff0c\u5355\u9879\u548c\u591a\u9879\u7684\u4ea4\u4e92\u903b\u8f91\u4e5f\u53ef\u80fd\u4e0d\u540c\uff0cSelectInnerInput\u7684\u5185\u90e8value state\u90fd\u662f\u4f7f\u7528\u591a\u9879\u503c\u6765\u5904\u7406\u7684\uff0c\u5728\u8f93\u5165\u503c\u548c\u5728onChange\u8f93\u51fa\u65f6\u6839\u636e\u53c2\u6570\u8f6c\u5316\u6210\u6570\u7ec4\uff0c\u4e00\u822c\u60c5\u51b5\u4e00\u79cd\u9009\u62e9\u5668\u9700\u8981\u652f\u6301\u4e24\u79cd\u60c5\u51b5</li>\n<li>\u9009\u62e9\u5668\u53ef\u80fd\u4f1a\u5728\u9876\u90e8\u6709\u4e00\u4e2a\u641c\u7d22\u6846\uff0c\u901a\u8fc7\u4f7f\u7528\u65f6\u662f\u5426\u4f20\u5165getSearchProps\u6765\u51b3\u5b9a\u641c\u7d22\u6846\u662f\u5426\u663e\u793a\uff0c\u5728FormInfo/common\u4e2d\u63d0\u4f9b\u4e86\u9ed8\u8ba4\u7684SearchInput\u5b9e\u73b0\uff0cSelectInnerInput\u4e2d\u7ba1\u7406\u4e86\u5176searchText\u548csetSearchText\u72b6\u6001</li>\n<li>FormInfo/fields/AdvancedSelect/createList.js \u5b9e\u73b0\u4e86\u4e00\u4e2a\u5217\u8868\u5f0f\u9009\u62e9\u5668\uff0c\u5b9e\u73b0\u4e86\u5305\u62ec\u641c\u7d22\uff0c\u4e0b\u62c9\u52a0\u8f7d\u7b49\u903b\u8f91\uff0c\u53ea\u9700\u8981\u5b9e\u73b0\u5217\u8868\u6e32\u67d3\u903b\u8f91\u5c31\u53ef\u4ee5\u65b9\u4fbf\u7684\u6269\u5c55\u51fa\u65b0\u7684List\u7c7b\u578b\u9009\u62e9\u5668</li>\n<li>\u901a\u8fc7SelectInnerInput.useContext \u53ef\u4ee5\u62ff\u5230\u9009\u62e9\u5668\u7684\u7528\u6237\u4f20\u5165\u5c5e\u6027\uff08props\uff09\uff0c\u503c\u5230\u9009\u9879\u7684\u6620\u5c04\uff08mapping\uff09\uff0c\u641c\u7d22\u6846\u7684state\uff08searchText,setSearchText\uff09\uff0c\u6570\u636e\u52a0\u8f7d\u5668\u7684API\uff08fetchApi\uff09\u539f\u59cbvalue\u503c\uff08valueState\uff09\uff0c\u6dfb\u52a0\u6620\u5c04\u65b9\u6cd5\uff08appendItems\uff09</li>\n</ul>',api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>data</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>debug</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>rules</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>interceptors</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>noFilter</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onError</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onSubmit</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>onPrevSubmit</td>\n<td></td>\n<td></td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3>SelectInnerInput</h3>\n<h3>formModule</h3>\n<h3>FormInfo</h3>\n<h3>preset</h3>\n<h3>List</h3>\n<h3>Form</h3>\n<p>\u540cdefault\u5bfc\u51fa\u7ec4\u4ef6</p>\n<h3>useField</h3>\n<h3>useReset</h3>\n<h3>useSubmit</h3>\n<h3>Group</h3>\n<h3>GroupList</h3>\n<h3>useFormContext</h3>\n<h3>RULES</h3>\n<h3>interceptors</h3>\n<h3>SubmitButton</h3>\n<h3>CancelButton</h3>\n<h3>ResetButton</h3>\n<h3>Field\u7c7b\u578b:antd\u7ec4\u4ef6</h3>\n<p>\u4ee5\u4e0b\u7ec4\u4ef6\u8bf7\u53c2\u8003antd\u5177\u4f53\u7684\u7ec4\u4ef6\u6587\u6863\u6b64\u5904\u4e0d\u518d\u8d58\u8ff0</p>\n<p>Checkbox,CheckboxGroup,DatePicker,Input,InputNumber,RadioGroup,Select,Switch,TextArea,TimePicker,TreeSelect</p>\n<h3>Field\u7c7b\u578b:@kne/react-form-antd\u5b9e\u73b0\u7ec4\u4ef6</h3>\n<p>DatePickerToday</p>\n<h3>Field\u7c7b\u578b:components-core\u5b9e\u73b0\u7ec4\u4ef6</h3>\n<p>AddressSelect</p>\n<p>AdvancedSelect</p>\n<p>Avatar</p>\n<p>Cascader</p>\n<p>FunctionSelect</p>\n<p>IndustrySelect</p>\n<p>Money</p>\n<p>PartSelect</p>\n<p>PhoneNumber</p>\n<p>TableDataSelect</p>\n<p>Upload</p>\n<h3>FormModal</h3>\n<p>\u4e00\u4e2aForm\u548cModal\u7ec4\u5408\u8d77\u6765\u7684\u7ec4\u4ef6\uff0c\u5b83\u9884\u7f6e\u4e86Form\u7ec4\u4ef6\uff0cchildren\u4f20\u5165\u7684\u5185\u5bb9\u548cfooter\u533a\u57df\u5747\u5728Form\u7684context\u5185</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formProps</td>\n<td>\u540cForm\u7ec4\u4ef6\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>useFormModal</h3>\n<p>\u83b7\u53d6\u4e00\u4e2a\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aFormModal\u7ec4\u4ef6\u7684\u65b9\u6cd5</p>\n<h4>return:formModal</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formModal</td>\n<td>\u6267\u884c\u540e\u53ef\u4ee5\u5f39\u51fa\u4e00\u4e2aFormModal\u5f39\u7a97\uff0c\u53c2\u6570\u540cFormModal\u7ec4\u4ef6\u53c2\u6570</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>FormModalButton</h3>\n<p>\u70b9\u51fb\u4ee5\u540e\u53ef\u4ee5\u6267\u884c\u83b7\u53d6\u6570\u636e\uff0c\u5728\u6570\u636e\u672a\u8fd4\u56de\u65f6\u6309\u94ae\u5c55\u793a\u4e3aloading\u72b6\u6001\uff0c\u6570\u636e\u8fd4\u56de\u540e\u5f39\u51faFormModal\u5f39\u7a97</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch \u6240\u9700\u53c2\u6570</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>\u540cFormModal\u53c2\u6570,\u5f53\u5b83\u4e3afunction\u65f6\uff0c\u6267\u884cfunction\u540e\u8fd4\u56de\u7684\u503c\u4f5c\u4e3amodalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>\u5176\u4ed6\u53c2\u6570\u540cantd Button \u7ec4\u4ef6</p>",example:{isFull:!0,className:"FormInfo_f344c",style:".FormInfo_f344c .input > .ant-row > .ant-col {\n  padding: 10px 0;\n}\n.FormInfo_f344c .input .ant-space-item:last-child {\n  width: 100%;\n}",list:[{title:"\u4e00\u4e2a\u7b80\u5355\u8868\u5355\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u7b80\u5355\u8868\u5355\u793a\u4f8b",code:'const {default: FormInfo, Form, SubmitButton, ErrorTip, fields} = _FormInfo;\nconst {PureGlobal} = global;\nconst {useModal} = _Modal;\nconst {uniqueId} = lodash;\n\nconst {\n    Input,\n    TextArea,\n    Upload,\n    Avatar,\n    PhoneNumber,\n    TypeDateRangePicker,\n    Rate,\n    Switch,\n    Slider,\n    MoneyInput,\n    ColorPicker,\n    SuperSelectTree\n} = fields;\n\nconst BaseExample = () => {\n    const modal = useModal();\n    return (<Form\n        helperGuideName="test-from"\n        lang={["cn", {\n            name: "EnUS", label: "\u82f1\u6587", options: {\n                //labelTransform: (label) => label + "(en)",\n                ignore: [{name: "avatar"}, {name: "photo"}], disabled: [{name: "file"}], //fields:[{name:\'name\'}]\n            },\n        },]}\n        rules={{\n            REP: (value) => {\n                return new Promise((resolve) => {\n                    setTimeout(() => {\n                        resolve({\n                            result: false, errMsg: "%s\u91cd\u590d", data: {\n                                user: "\u6211\u662f\u4e00\u4e2a\u91cd\u590d\u7684\u4e1c\u897f",\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        }}\n        onSubmit={(data) => {\n            modal({\n                title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e", children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n            });\n        }}\n    >\n        <FormInfo\n            title="\u57fa\u672c\u4fe1\u606f"\n            list={[<Avatar name="avatar" label="\u5934\u50cf" labelHidden block/>, <Avatar\n                name="photo"\n                label="\u8bc1\u4ef6\u7167"\n                dropModalSize="default"\n                border={50}\n                width={960}\n                height={540}\n                block\n            />, <ErrorTip\n                name="name"\n                errorRender={({validateData}) => {\n                    console.log(validateData);\n                    if (!validateData.REP) {\n                        return null;\n                    }\n                    return <div>\u54c8\u54c8\u54c8{validateData.REP.user}</div>;\n                }}\n            >\n                <Input\n                    name="name"\n                    label="\u59d3\u540d"\n                    rule="REQ LEN-3-10 REP"\n                    tips="\u59d3\u540d"\n                />\n            </ErrorTip>, <ColorPicker name="color" label="\u4e3b\u9898\u8272"/>,\n                <MoneyInput name="money" label="\u91d1\u989d" rule="REQ" tips={"money"}/>,\n                <PhoneNumber name="phone" label="\u624b\u673a" rule="REQ" disabled/>,\n                <Input name="email" label="\u90ae\u7bb1" rule="EMAIL"/>, <Upload name="file" label="\u6587\u4ef6" tips="\u6587\u4ef6" block/>,\n                <Rate name="rate" label="\u8bc4\u5206" tips="\u8bc4\u5206"/>, <Switch name="switch" label="\u5f00\u5173" tips="\u5f00\u5173">\n                    {({checked}) => (checked ? "\u5f00" : "\u5173")}\n                </Switch>, <Slider name="slider" label="\u6ed1\u52a8\u6761" tips="\u6ed1\u52a8\u6761"/>, <TypeDateRangePicker\n                    name="type_date"\n                    label="\u65e5\u671f\u65f6\u95f4\u6bb5"\n                    tips="\u65e5\u671f\u65f6\u95f4\u6bb5"\n                    rule="REQ"\n                />, <SuperSelectTree name="tree" label="\u6811\u9009\u62e9" options={[{\n                    value: \'1\', label: \'\u7236\u8282\u70b9\',\n                }]}/>, <TextArea name="des" label="\u5907\u6ce8" tips="\u5907\u6ce8" block/>, <SubmitButton>\u63d0\u4ea4</SubmitButton>,]}\n        />\n    </Form>);\n};\n\nrender(<PureGlobal\n    preset={{\n        locale: "en-US", enums: {\n            helperGuide: () => [{\n                value: "test-from-name", content: "\u6d4b\u8bd5\u5e2e\u52a9\u6587\u6863", url: "/",\n            },],\n        }, apis: {\n            oss: {\n                loader: () => {\n                    return window.PUBLIC_URL + "/avatar.png";\n                },\n            }, ossUpload: async ({file}) => {\n                console.log(file);\n                return new Promise((resolve) => {\n                    setTimeout(() => {\n                        const id = uniqueId("file-");\n                        resolve({\n                            data: {\n                                code: 0, data: {\n                                    id, originalName: id + "\u7b80\u5386.pdf",\n                                },\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        },\n    }}\n>\n    <BaseExample/>\n</PureGlobal>);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Modal",packageName:"@components/Modal",component:l},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u591a\u884c",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u591a\u884c\u5b57\u6bb5\u793a\u4f8b",code:'const { default: FormInfo, Form, MultiField, SubmitButton, fields } = _FormInfo;\nconst { useModal } = _Modal;\n\nconst { Input, TextArea } = fields;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  return (\n    <Form\n      onSubmit={(data) => {\n        modal({\n          title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <FormInfo\n        list={[\n          <MultiField\n            name="no"\n            label="\u5355\u53f7"\n            rule="REQ"\n            field={Input}\n            maxLength={5}\n            tips={"\u5355\u53f7"}\n          />,\n          <Input name="name" label="\u540d\u79f0" />,\n          <MultiField name="description" label="\u8bf4\u660e" field={TextArea} />,\n        ]}\n      />\n      <SubmitButton>\u63d0\u4ea4</SubmitButton>\n    </Form>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"_Modal",packageName:"@components/Modal",component:l}]},{title:"\u4e00\u4e2a\u542b\u6709\u591a\u6bb5\u5217\u8868\u7684\u8868\u5355\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u542b\u6709\u591a\u6bb5\u5217\u8868\u7684\u8868\u5355\u793a\u4f8b\uff0c\u5217\u8868\u7684\u6700\u5927\u957f\u5ea6\u4e3a5\uff0c\u5728\u6dfb\u52a05\u6bb5\u4e4b\u540e\u6dfb\u52a0\u6309\u94ae\u81ea\u52a8\u9690\u85cf",code:'const {\n  default: FormInfo,\n  Form,\n  List,\n  AdvancedSelect,\n  TableList,\n  Input,\n  TextArea,\n  SubmitButton,\n  FormApiButton,\n} = _FormInfo;\nconst { PureGlobal } = global;\nconst { useModal } = _Modal;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  const modal = useModal();\n  return (\n    <Form\n      onSubmit={(data) => {\n        modal({\n          title: "\u8868\u5355\u63d0\u4ea4\u6570\u636e",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <Space direction="vertical" size={16}>\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="name" label="\u57fa\u672c\u540d\u79f0" rule="REQ" block />,\n            <TextArea name="des" label="\u57fa\u672c\u63cf\u8ff0" block />,\n          ]}\n        />\n        <List\n          name="list"\n          title="\u5217\u8868"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n          ]}\n        />\n        <TableList\n          name="tableList"\n          title="\u8868\u683c\u5217\u8868"\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <AdvancedSelect\n              name="select"\n              label="\u9009\u9879"\n              rule="REQ"\n              value={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7b2c\u4e00\u9879",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7b2c\u4e8c\u9879",\n                        value: 2,\n                        disabled: true,\n                      },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n          ]}\n        />\n        <List\n          name="mult-list"\n          important\n          title="\u590d\u6742\u5217\u8868"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n            <TableList\n              block\n              isUnshift={false}\n              name="tableList"\n              title="\u8868\u683c\u5217\u8868"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n                <Input name="title" label="\u6807\u9898" rule="REQ" />,\n                <AdvancedSelect\n                  name="select"\n                  label="\u9009\u9879"\n                  rule="REQ"\n                  value={[1]}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: "\u7b2c\u4e00\u9879",\n                            value: 1,\n                          },\n                          {\n                            label: "\u7b2c\u4e8c\u9879",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n              ]}\n            />,\n          ]}\n        />\n\n        <List\n          name="mult-list-2"\n          important\n          title="\u590d\u6742\u5217\u88682"\n          itemTitle={({ index }) => `\u7ecf\u5386${index + 1}`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name="name" label="\u540d\u79f0" rule="REQ" />,\n            <Input name="title" label="\u6807\u9898" rule="REQ" />,\n            <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n            <List\n              block\n              name="tableList"\n              title="\u5217\u8868"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name="name" label="\u540d\u79f0" rule="REQ" value="xxxxx" />,\n                <Input name="title" label="\u6807\u9898" rule="REQ" />,\n                <TextArea name="des" label="\u63cf\u8ff0" block rule="REQ" />,\n              ]}\n            />,\n          ]}\n        />\n        <FormInfo\n          list={[\n            <SubmitButton>\u63d0\u4ea4</SubmitButton>,\n            <FormApiButton\n              onClick={({ openApi }) => {\n                openApi.setFields(\n                  [\n                    {\n                      groupName: "tableList",\n                      name: "name",\n                      value: "",\n                    },\n                    {\n                      groupName: "tableList",\n                      name: "title",\n                      value: "ssssssss",\n                    },\n                  ],\n                  { runValidate: false }\n                );\n              }}\n            >\n              \u8bbe\u7f6e\u8868\u5355\u503c\n            </FormApiButton>,\n          ]}\n        />\n      </Space>\n    </Form>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Modal",packageName:"@components/Modal",component:l},{name:"antd",packageName:"antd",component:r}]},{title:"Modal Form\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2aform\u5f39\u7a97",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormModal,\n  useFormModal,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormModalButton,\n} = _FormInfo;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formModal = useFormModal();\n  return (\n    <Space wrap>\n      <FormModal\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        formProps={{\n          data: {\n            field1: "field1field1field1field1",\n          },\n          onSubmit: async (data) => {\n            console.log(data);\n            await new Promise((resolve) => {\n              setTimeout(() => {\n                resolve();\n              }, 1000);\n            });\n            setOpen(false);\n          },\n        }}\n      >\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n        <List\n          title="\u5217\u8868"\n          name="list"\n          maxLength={3}\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n      </FormModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: ({ data }) => {\n              return {\n                data: data,\n                onSubmit: async (data) => {\n                  console.log(data);\n                  await new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                  api.close();\n                },\n              };\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve({\n                        field1: "\u6211\u63a5\u53e3\u83b7\u53d6\u7684\u6570\u636e",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u52a0\u8f7dform\u6570\u636e\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: "\u8868\u5355\u5f39\u7a97",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: "\u53d6\u6d88" },\n              {\n                ButtonComponent: FormApiButton,\n                autoClose: false,\n                onClick: (context) => {\n                  console.log(context);\n                },\n                children: "FormApiButton",\n              },\n              {\n                ButtonComponent: SubmitButton,\n                autoClose: false,\n                children: "\u63d0\u4ea4",\n              },\n            ],\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        \u81ea\u5b9a\u4e49footerButtons\n      </Button>\n      <FormModalButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: "Lucy",\n                  desc: "\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684form\u5f39\u7a97",\n            formProps: {\n              data,\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                close();\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                column={1}\n                list={[\n                  <Input name="name" label="\u59d3\u540d" rule="REQ" />,\n                  <TextArea name="desc" label="\u4ecb\u7ecd" rule="REQ" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        \u52a0\u8f7dform\u6570\u636e\u6309\u94ae\n      </FormModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"fetch",packageName:"@kne/react-fetch",component:i}]},{title:"FormStepModal\u8868\u5355\u5f39\u7a97\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u4e00\u4e2aFormStepModal\u8868\u5355\u5f39\u7a97\u793a\u4f8b",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormModal,\n  FormStepModal,\n  useFormModal,\n  useFormStepModal,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormModalButton,\n} = _FormInfo;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formModal = useFormStepModal();\n  return (\n    <Space wrap>\n      <FormStepModal\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        autoClose\n        items={[\n          {\n            title: "\u57fa\u672c\u4fe1\u606f",\n            formProps: {\n              data: {\n                field1: "\u57fa\u672c\u4fe1\u606ffield1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                list={[\n                  <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                  <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                  <TextArea name="field3" label="\u5b57\u6bb53" />,\n                ]}\n              />\n            ),\n          },\n          {\n            title: "\u5217\u8868\u4fe1\u606f",\n            formProps: {\n              data: {\n                list: [{ field1: "\u5217\u8868\u4fe1\u606ffield1field1field1field1" }],\n              },\n              onSubmit: async (data, { stepCacheRef }) => {\n                console.log(stepCacheRef);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n              },\n            },\n            children: (\n              <List\n                title="\u5217\u8868"\n                name="list"\n                maxLength={3}\n                list={[\n                  <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                  <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                  <TextArea name="field3" label="\u5b57\u6bb53" />,\n                ]}\n              />\n            ),\n          },\n        ]}\n      ></FormStepModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r}]},{title:"Drawer Form \u62bd\u5c49\u5f39\u7a97",description:"\u5c55\u793a\u4e00\u4e2aform\u62bd\u5c49\u5f39\u7a97",code:'const { Space, Button } = antd;\nconst { PureGlobal } = global;\nconst {\n  default: FormInfo,\n  List,\n  Input,\n  TextArea,\n  FormDrawer,\n  useFormDrawer,\n  CancelButton,\n  FormApiButton,\n  SubmitButton,\n  FormDrawerButton,\n} = _FormInfo;\nconst { useState } = React;\nconst { default: Fetch } = fetch;\n\nconst BaseExample = () => {\n  const [open, setOpen] = useState(false);\n  const formDrawer = useFormDrawer();\n  return (\n    <Space wrap>\n      <FormDrawer\n        open={open}\n        title="\u8868\u5355\u5f39\u7a97"\n        onClose={() => {\n          setOpen(false);\n        }}\n        formProps={{\n          data: {\n            field1: "field1field1field1field1",\n          },\n          onSubmit: async (data) => {\n            console.log(data);\n            await new Promise((resolve) => {\n              setTimeout(() => {\n                resolve();\n              }, 1000);\n            });\n            setOpen(false);\n          },\n        }}\n      >\n        <FormInfo\n          title="\u57fa\u672c\u4fe1\u606f"\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n        <List\n          title="\u5217\u8868"\n          name="list"\n          maxLength={3}\n          list={[\n            <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n            <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n            <TextArea name="field3" label="\u5b57\u6bb53" />,\n          ]}\n        />\n      </FormDrawer>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        \u7ec4\u4ef6\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            formProps: ({ data }) => {\n              return {\n                data: data,\n                onSubmit: async (data) => {\n                  console.log(data);\n                  await new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                  api.close();\n                },\n              };\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve({\n                        field1: "\u6211\u63a5\u53e3\u83b7\u53d6\u7684\u6570\u636e",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks\u52a0\u8f7dform\u6570\u636e\u8c03\u7528\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: "\u8868\u5355\u5f39\u7a97",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: "\u53d6\u6d88" },\n              {\n                ButtonComponent: FormApiButton,\n                autoClose: false,\n                onClick: (context) => {\n                  console.log(context);\n                },\n                children: "FormApiButton",\n              },\n              {\n                ButtonComponent: SubmitButton,\n                autoClose: false,\n                children: "\u63d0\u4ea4",\n              },\n            ],\n            formProps: {\n              data: {\n                field1: "field1field1field1field1",\n              },\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                api.close();\n              },\n            },\n            children: (\n              <div>\n                <FormInfo\n                  title="\u57fa\u672c\u4fe1\u606f"\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n                <List\n                  title="\u5217\u8868"\n                  name="list"\n                  maxLength={3}\n                  list={[\n                    <Input name="field1" label="\u5b57\u6bb51" rule="REQ LEN-0-10" />,\n                    <Input name="field2" label="\u5b57\u6bb52" rule="REQ LEN-0-10" />,\n                    <TextArea name="field3" label="\u5b57\u6bb53" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        \u81ea\u5b9a\u4e49footerButtons\n      </Button>\n      <FormDrawerButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: "Lucy",\n                  desc: "\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd\u4e2a\u4eba\u4ecb\u7ecd",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: "\u52a0\u8f7d\u6570\u636e\u7684form\u5f39\u7a97",\n            formProps: {\n              data,\n              onSubmit: async (data) => {\n                console.log(data);\n                await new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve();\n                  }, 1000);\n                });\n                close();\n              },\n            },\n            children: (\n              <FormInfo\n                title="\u57fa\u672c\u4fe1\u606f"\n                column={1}\n                list={[\n                  <Input name="name" label="\u59d3\u540d" rule="REQ" />,\n                  <TextArea name="desc" label="\u4ecb\u7ecd" rule="REQ" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        \u52a0\u8f7dform\u6570\u636e\u6309\u94ae\n      </FormDrawerButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:r},{name:"fetch",packageName:"@kne/react-fetch",component:i}]},{title:"\u9009\u62e9\u63a7\u4ef6\u7684\u6570\u636e\u5c55\u793a\u6846",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u9009\u62e9\u63a7\u4ef6\u7684\u6570\u636e\u5c55\u793a\u6846\uff0c\u5b83\u662f\u5176\u4ed6\u9009\u62e9\u5668\u7684\u5b50\u7ec4\u4ef6\u4e00\u822c\u4e0d\u72ec\u7acb\u4f7f\u7528\uff0c\u5f00\u653e\u8be5\u7ec4\u4ef6\u662f\u4e3a\u4e86\u65b9\u9762\u81ea\u5b9a\u4e49\u65b0\u7684\u9009\u62e9\u63a7\u4ef6\uff0c\u4f46\u662f\u8bf7\u8c28\u614e\u4f7f\u7528",code:'const { SelectInnerInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button, List } = antd;\nconst { default: Content } = _Content;\nconst { useState } = React;\n\nconst ControlledSelectInnerInput = (props) => {\n  const [value, setValue] = useState([1, 2, 3]);\n\n  return <SelectInnerInput {...props} value={value} onChange={setValue} />;\n};\n\nconst useSelectInnerContext = SelectInnerInput.useContext;\n\nconst ResetMapping = () => {\n  const { mapping, appendMapping } = useSelectInnerContext();\n  return (\n    <span>\n      <Button\n        onClick={() => {\n          appendMapping([\n            { label: "\u4fee\u6539\u7684\u9879", value: 1 },\n            { label: "\u65b0\u589e\u7684\u9879", value: 4 },\n          ]);\n        }}\n      >\n        \u70b9\u51fb\u8bbe\u7f6emapping\u503c\n      </Button>\n      <List\n        dataSource={mapping.values()}\n        renderItem={(item) => <div>{item.label}</div>}\n      />\n    </span>\n  );\n};\n\nconst BaseExample = () => {\n  const children = "\u9009\u533a\u5185\u5bb9";\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u975e\u53d7\u63a7\u72b6\u6001",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u53d7\u63a7\u72b6\u6001",\n          content: (\n            <ControlledSelectInnerInput>{children}</ControlledSelectInnerInput>\n          ),\n        },\n        {\n          label: "mapping\u503c\u663e\u793a",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u5355\u9879\u503c\u663e\u793a",\n          content: (\n            <SelectInnerInput\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u591a\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3, 4, 5, 6, 7, 8, 9]}\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e94\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u516d\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e03\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 7,\n                    },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                    { label: "\u7b2c\u4e5d\u9879", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u5355\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              defaultValue={1}\n              single\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e94\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u516d\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e03\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 7,\n                    },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                    { label: "\u7b2c\u4e5d\u9879", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u591a\u9879\u8d85\u51fa\u60c5\u51b5",\n          content: (\n            <SelectInnerInput\n              isPopup\n              defaultValue={[1, 2, 3, 4, 5, 6, 7, 8]}\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        "\u7b2c\u4e00\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u4e8c\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 2,\n                    },\n                    {\n                      label: "\u7b2c\u4e09\u9879",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        "\u7b2c\u56db\u9879\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f\u8d85\u7ea7\u957f",\n                      value: 4,\n                    },\n                    {\n                      label: "\u7b2c\u4e94\u9879",\n                      value: 5,\n                    },\n                    {\n                      label: "\u7b2c\u516d\u9879",\n                      value: 6,\n                    },\n                    { label: "\u7b2c\u4e03\u9879", value: 7 },\n                    { label: "\u7b2c\u516b\u9879", value: 8 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u9009\u533a",\n          content: (\n            <SelectInnerInput\n              single\n              isPopup\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u66f4\u65b0mapping",\n          content: (\n            <SelectInnerInput\n              single\n              isPopup\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              <ResetMapping />\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "\u9690\u85cf\u5df2\u9009\u6807\u7b7e",\n          content: (\n            <SelectInnerInput\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u9690\u85cf\u5df2\u9009\u6807\u7b7e",\n          content: (\n            <SelectInnerInput\n              isPopup\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "extra",\n          content: (\n            <SelectInnerInput\n              extra={<Button>\u6dfb\u52a0</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "popup\u7684extra",\n          content: (\n            <SelectInnerInput\n              isPopup\n              extra={({ close }) => <Button onClick={close}>\u6dfb\u52a0</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: "valueType\u4e3aall",\n          content: (\n            <SelectInnerInput\n              isPopup\n              valueType="all"\n              defaultValue={[\n                { label: "\u989d\u5916\u7684\u4e00\u9879", value: 100 },\n                { label: "\u989d\u5916\u7684\u4e8c\u9879", value: 200 },\n              ]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: "\u7b2c\u4e00\u9879", value: 1 },\n                    { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                    { label: "\u7b2c\u4e09\u9879", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r}]},{title:"\u9ad8\u7ea7\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u4e86\u9ad8\u7ea7\u9009\u62e9\u7ec4\u4ef6\u7684List\u5f62\u6001",code:'const { AdvancedSelect: _AdvancedSelect, SelectInnerInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst AdvancedSelect = _AdvancedSelect.Field;\n\nconst useSelectInnerContext = SelectInnerInput.useContext;\n\nconst AddExtraButton = () => {\n  const { appendItems, fetchApi } = useSelectInnerContext();\n\n  return (\n    <Button\n      type="link"\n      onClick={() => {\n        const id = uniqueId("new_item_");\n        appendItems({\n          pageData: [\n            {\n              label: "\u6dfb\u52a0\u7684\u65b0\u9879\u76ee_" + id,\n              value: id,\n            },\n            ...fetchApi.data.pageData,\n          ],\n          totalCount: fetchApi.data.totalCount,\n        });\n      }}\n    >\n      \u6dfb\u52a0\n    </Button>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: range(0, 100).map((key) => {\n                      return {\n                        label: `\u7b2c${key + 1}\u9879`,\n                        value: key + 1,\n                        disabled: key === 2,\n                      };\n                    }),\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2 },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u63cf\u8ff0\u4fe1\u606f",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1, description: "\u63cf\u8ff0\u4fe1\u606f" },\n                      {\n                        label: "\u7b2c\u4e8c\u9879",\n                        value: 2,\n                        description: "\u63cf\u8ff0\u4fe1\u606f",\n                      },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                        description: "\u63cf\u8ff0\u4fe1\u606f",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5206\u9875\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={90}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n              extra={<AddExtraButton />}\n              api={{\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + 20)\n                          .map((key) => {\n                            return {\n                              label: `\u7b2c${key + 1}\u9879`,\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5206\u9875\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <AdvancedSelect\n              defaultValue={[90]}\n              isPopup={false}\n              extra={<AddExtraButton />}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u7b2c${key + 1}\u9879`,\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u7528\u6237\u9009\u62e9\u7ec4\u4ef6",description:"\u5728List\u7684\u4ea4\u4e92\u903b\u8f91\u57fa\u7840\u4e0a\u6269\u5c55\u51fa\u7684\u4e0d\u540c\u5217\u8868\u6837\u5f0f",code:'const { AdvancedSelect: _AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst UserSelect = _AdvancedSelect.User.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <UserSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: range(0, 30).map((key) => {\n                      return {\n                        label: `\u7528\u6237${key + 1}`,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                        value: key + 1,\n                      };\n                    }),\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <UserSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u8868\u683c\u9009\u62e9\u7ec4\u4ef6",description:"\u5728List\u7684\u4ea4\u4e92\u903b\u8f91\u57fa\u7840\u4e0a\u6269\u5c55\u51fa\u7684\u4e0d\u540c\u5217\u8868\u6837\u5f0f",code:'const { AdvancedSelect: _AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst TableSelect = _AdvancedSelect.Table.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <TableSelect\n              defaultValue={[1]}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u5458\u5de5${key + 1}`,\n                              company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                              department: "\u6280\u672f\u90e8",\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <TableSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u8d22\u52a1\u90e8",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u6280\u672f\u90e8",\n                        value: 2,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u5546\u52a1\u90e8",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u591a\u9009modal",\n          content: (\n            <TableSelect\n              defaultValue={[1]}\n              isPopup={false}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              api={{\n                data: {\n                  perPage: 10,\n                },\n                loader: ({ data }) => {\n                  const params = Object.assign(\n                    {\n                      perPage: 20,\n                      currentPage: 1,\n                    },\n                    data\n                  );\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      const start = (params.currentPage - 1) * params.perPage;\n                      resolve({\n                        totalCount: 100,\n                        pageData: range(start, start + params.perPage)\n                          .map((key) => {\n                            return {\n                              label: `\u5458\u5de5${key + 1}`,\n                              company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                              department: "\u6280\u672f\u90e8",\n                              value: key + 1,\n                            };\n                          })\n                          .filter(({ label }) => {\n                            return params.keyword\n                              ? label.indexOf(params.keyword) > -1\n                              : true;\n                          }),\n                      });\n                    }, 1000);\n                  });\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009modal",\n          content: (\n            <TableSelect\n              single\n              isPopup={false}\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u8d22\u52a1\u90e8",\n                        value: 1,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u6280\u672f\u90e8",\n                        value: 2,\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        company: "\u5317\u4eac\u79d1\u6280\u6709\u9650\u516c\u53f8",\n                        department: "\u5546\u52a1\u90e8",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: "\u59d3\u540d",\n                  dataIndex: "label",\n                },\n                {\n                  title: "\u6240\u5c5e\u516c\u53f8",\n                  dataIndex: "company",\n                },\n                {\n                  title: "\u6240\u5c5e\u90e8\u95e8",\n                  dataIndex: "department",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u5730\u5740\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u5730\u5740\u9009\u62e9\u7ec4\u4ef6",code:'const { AddressSelect: _AddressSelect, AddressInput: _AddressInput } =\n  _FormInfo;\nconst { PureGlobal } = global;\nconst { Space, Button } = antd;\nconst { default: Content } = _Content;\nconst { range, uniqueId } = lodash;\n\nconst AddressSelect = _AddressSelect.Field;\nconst AddressEnum = _AddressSelect.AddressEnum;\nconst AddressInput = _AddressInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u591a\u9009",\n          content: (\n            <AddressSelect\n              maxLength={3}\n              defaultValue={["110"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5355\u9009",\n          content: (\n            <AddressSelect\n              single\n              defaultValue={"110"}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u591a\u9009",\n          content: (\n            <AddressSelect\n              maxLength={3}\n              isPopup={false}\n              defaultValue={["110"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5355\u9009",\n          content: (\n            <AddressSelect\n              isPopup={false}\n              single\n              defaultValue={"110"}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "valueType\u4e3aall",\n          content: (\n            <AddressSelect\n              valueType="all"\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5730\u5740\u663e\u793a",\n          content: <AddressEnum name="270070" />,\n        },\n        {\n          label: "\u663e\u793a\u7236\u7ea7",\n          content: <AddressEnum name="270070" displayParent />,\n        },\n        {\n          label: "\u5730\u5740\u8f93\u5165",\n          content: (\n            <AddressInput\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"antd",packageName:"antd",component:r},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u7ea7\u8054\u9009\u62e9\u7ec4\u4ef6",description:"\u5c55\u793a\u7ea7\u8054\u9009\u62e9\u7ec4\u4ef6",code:'const { Cascader: _Cascader } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst Cascader = _Cascader.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u4e00\u6b21\u6027\u83b7\u53d6\u6570\u636e",\n          content: (\n            <Cascader\n              onlyAllowLastLevel\n              single\n              api={{\n                loader: async () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          id: "client",\n                          value: "client",\n                          type: "module",\n                          name: "\u5ba2\u6237",\n                          label: "\u5ba2\u6237",\n                          children: [\n                            {\n                              id: "client-list",\n                              value: "client-list",\n                              type: "feature",\n                              name: "\u5ba2\u6237\u5217\u8868\u9875",\n                              label: "\u5ba2\u6237\u5217\u8868\u9875",\n                            },\n                            {\n                              id: "client-detail",\n                              value: "client-detail",\n                              type: "module",\n                              name: "\u5ba2\u6237\u8be6\u60c5\u9875",\n                              label: "\u5ba2\u6237\u8be6\u60c5\u9875",\n                              children: [\n                                {\n                                  id: "contract",\n                                  value: "contract",\n                                  type: "module",\n                                  name: "\u5408\u540c\u4fe1\u606f",\n                                  label: "\u5408\u540c\u4fe1\u606f",\n                                },\n                              ],\n                            },\n                            {\n                              id: "client-form",\n                              value: "client-form",\n                              type: "feature",\n                              name: "\u5ba2\u6237\u8868\u5355",\n                              label: "\u5ba2\u6237\u8868\u5355",\n                              children: [\n                                {\n                                  id: "taxpayerIdNumber",\n                                  value: "taxpayerIdNumber",\n                                  type: "feature",\n                                  name: "\u7a0e\u53f7",\n                                  label: "\u7a0e\u53f7",\n                                },\n                              ],\n                            },\n                          ],\n                        },\n                        {\n                          id: "position",\n                          value: "position",\n                          type: "module",\n                          name: "\u804c\u4f4d",\n                          label: "\u804c\u4f4d",\n                          children: [\n                            {\n                              id: "position-list",\n                              value: "position-list",\n                              type: "feature",\n                              name: "\u804c\u4f4d\u5217\u8868\u9875",\n                              label: "\u804c\u4f4d\u5217\u8868\u9875",\n                            },\n                            {\n                              id: "position-detail",\n                              value: "position-detail",\n                              type: "module",\n                              name: "\u804c\u4f4d\u8be6\u60c5\u9875",\n                              label: "\u804c\u4f4d\u8be6\u60c5\u9875",\n                            },\n                            {\n                              id: "position-form",\n                              value: "position-form",\n                              type: "feature",\n                              name: "\u804c\u4f4d\u8868\u5355",\n                              label: "\u804c\u4f4d\u8868\u5355",\n                              children: [\n                                {\n                                  id: "industry",\n                                  value: "industry",\n                                  type: "feature",\n                                  name: "\u884c\u4e1a",\n                                  label: "\u884c\u4e1a",\n                                },\n                              ],\n                            },\n                          ],\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u5206\u5c42\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <Cascader\n              openLoadData\n              onSearch={async (searchText) => {\n                return range(0, 20).map((key) => {\n                  const parentId = "2";\n                  return {\n                    id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                    label: `\u8282\u70b9-${searchText}-${\n                      parentId ? `${parentId}-` : ""\n                    }${key + 1}`,\n                    parentId,\n                  };\n                });\n              }}\n              api={{\n                loader: async ({ data }) => {\n                  const parentId = get(data, "id", "");\n                  const level = parentId.split("-").length;\n                  console.log("loadData", parentId, level);\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve(\n                        range(0, 20).map((key) => {\n                          return Object.assign(\n                            {\n                              id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                              label: `\u8282\u70b9-${parentId ? `${parentId}-` : ""}${\n                                key + 1\n                              }`,\n                              parentId,\n                            },\n                            level >= 3 ? { children: null } : {}\n                          );\n                        })\n                      );\n                    }, 1000);\n                  });\n                },\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u5206\u5c42\u52a0\u8f7d\u6570\u636e",\n          content: (\n            <Cascader\n              openLoadData\n              isPopup={false}\n              api={{\n                loader: async ({ data }) => {\n                  const parentId = get(data, "id", "");\n                  const level = parentId.split("-").length;\n                  console.log("loadData", parentId, level);\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve(\n                        range(0, 20).map((key) => {\n                          return Object.assign(\n                            {\n                              id: `${parentId ? `${parentId}-` : ""}${key + 1}`,\n                              label: `\u8282\u70b9-${parentId ? `${parentId}-` : ""}${\n                                key + 1\n                              }`,\n                              parentId,\n                            },\n                            level >= 3 ? { children: null } : {}\n                          );\n                        })\n                      );\n                    }, 1000);\n                  });\n                },\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u804c\u80fd\u9009\u62e9",description:"\u5c55\u793a\u884c\u4e1a\u804c\u80fd\u9009\u62e9",code:'const { FunctionSelect: _FunctionSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst FunctionSelect = _FunctionSelect.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u804c\u80fd\u9009\u62e9",\n          content: (\n            <FunctionSelect\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u804c\u80fd\u9009\u62e9",\n          content: (\n            <FunctionSelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u9009\u62e9\u65e0\u641c\u7d22",\n          content: (\n            <FunctionSelect\n              search={null}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u679a\u4e3e\u663e\u793a",\n          content: <FunctionSelect.Enum name="001" />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u884c\u4e1a\u9009\u62e9",description:"\u5c55\u793a\u884c\u4e1a\u9009\u62e9\u7ec4\u4ef6",code:'const { IndustrySelect: _IndustrySelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst { range, get } = lodash;\n\nconst IndustrySelect = _IndustrySelect.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u884c\u4e1a\u9009\u62e9",\n          content: (\n            <IndustrySelect\n              defaultValue={["001"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "modal\u884c\u4e1a\u9009\u62e9",\n          content: (\n            <IndustrySelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: "\u804c\u80fd\u679a\u4e3e\u663e\u793a",\n          content: <IndustrySelect.Enum name="004" />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal preset={{ locale: "en-US" }}>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s},{name:"lodash",packageName:"lodash",component:d}]},{title:"\u91d1\u989d\u8f93\u5165",description:"\u5c55\u793a\u91d1\u989d\u8f93\u5165\u7ec4\u4ef6",code:'const { MoneyInput: _MoneyInput } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst MoneyInput = _MoneyInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u91d1\u989d\u8f93\u5165",\n          content: <MoneyInput />,\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u7535\u8bdd\u53f7\u7801\u8f93\u5165",description:"\u5c55\u793a\u7535\u8bdd\u53f7\u7801\u8f93\u5165\u7ec4\u4ef6",code:'const { PhoneNumber: _PhoneNumber } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst PhoneNumber = _PhoneNumber.Field;\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: "\u7535\u8bdd\u8f93\u5165",\n          content: (\n            <PhoneNumber\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n      ]}\n    />\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u85aa\u8d44\u7ec4\u4ef6",description:"\u5c55\u793a\u586b\u5199\u85aa\u8d44\u8303\u56f4\u8f93\u5165\u7ec4\u4ef6",code:'const { SalaryInput, Form } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Content } = _Content;\n\nconst SalaryInputField = SalaryInput.Field;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <Content\n        col={1}\n        list={[\n          {\n            label: "\u85aa\u8d44\u8303\u56f4",\n            content: (\n              <SalaryInputField\n                onChange={(value) => {\n                  console.log(value);\n                }}\n              />\n            ),\n          },\n        ]}\n      />\n      <Form\n        rules={{\n          SALARYRANGE: ({ min, max, type }) => {\n            if (type !== 1) {\n              if (!min || !max) {\n                return {\n                  result: false,\n                  errMsg: `${!min ? "\u6700\u4f4e\u85aa\u8d44" : "\u6700\u9ad8\u85aa\u8d44"}\u4e0d\u80fd\u4e3a\u7a7a`,\n                };\n              }\n              if (min > max) {\n                return {\n                  result: false,\n                  errMsg: "\u6700\u9ad8\u85aa\u8d44\u5e94\u5927\u4e8e\u6700\u4f4e\u85aa\u8d44",\n                };\n              }\n            }\n            return {\n              result: true,\n              errMsg: "",\n            };\n          },\n        }}\n        data={{ salaryRange: { type: 5, month: 12 } }}\n      >\n        <SalaryInput\n          name="salaryRange"\n          label="\u85aa\u8d44\u8303\u56f4"\n          rule="REQ SALARYRANGE"\n          showMonth\n          remindUnit\n        />\n      </Form>\n    </div>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <div className="input">\n      <BaseExample />\n    </div>\n  </PureGlobal>\n);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"_Content",packageName:"@components/Content",component:s}]},{title:"\u53ef\u6269\u5c55\u7684AdvanceSelect",description:"AdvanceSelect\u652f\u6301\u5de6\u53f3\u5e03\u5c40",code:'const { AdvancedSelect } = _FormInfo;\nconst { PureGlobal } = global;\nconst { default: Icon } = icon;\nconst { useState } = React;\nconst { range, merge, get } = _lodash;\nconst dayjs = _dayjs;\nconst { Col } = _antd;\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax: () => {\n          return Promise.resolve({ data: { code: 0, data: [] } });\n        },\n      }}\n    >\n      <AdvancedSelect.Field\n        getSearchProps={(text) => {\n          return {\n            data: { keyword: text },\n          };\n        }}\n        displayItems={[{ label: "\u7b2c\u4e5d\u5341\u9879", value: 90 }]}\n        api={{\n          loader: ({ data }) => {\n            const params = Object.assign(\n              {\n                perPage: 20,\n                currentPage: 1,\n              },\n              data\n            );\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                const start = (params.currentPage - 1) * params.perPage;\n                resolve({\n                  totalCount: 100,\n                  pageData: range(start, start + 20)\n                    .map((key) => {\n                      return {\n                        label: `\u7b2c${key + 1}\u9879`,\n                        value: key + 1,\n                      };\n                    })\n                    .filter(({ label }) => {\n                      return params.keyword\n                        ? label.indexOf(params.keyword) > -1\n                        : true;\n                    }),\n                });\n              }, 1000);\n            });\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n        single\n        isPopup={false}\n        label={"\u9762\u8bd5\u5b98"}\n        placeholder={"\u9009\u62e9\u9762\u8bd5\u5b98"}\n        modalSize={"large"}\n        wrapClassName={"calendar-modal"}\n        selectIcon={\n          <div>\n            <Icon type={"icon-gouxuan"} />\n          </div>\n        }\n        leftSpan={6}\n        right={() => (\n          <Col flex={1}>\n            <div>\u6211\u662fheader</div>\n            <div>\u6211\u662fbody</div>\n          </Col>\n        )}\n        leftBottom={() => <div>\u6211\u662fleftBottom</div>}\n      />\n    </PureGlobal>\n  );\n};\nrender(<BaseExample />);\n\n',scope:[{name:"_FormInfo",packageName:"@components/FormInfo",component:a},{name:"icon",packageName:"@components/Icon",component:c},{name:"_antd",packageName:"antd",component:r},{name:"global",packageName:"@components/Global",component:o},{name:"_lodash",packageName:"lodash",component:d},{name:"_dayjs",packageName:"dayjs",component:m}]}]}}},70467:(n,e,t)=>{t.d(e,{A:()=>i});var a=t(10935),o=t(63743),l=t(87558),d=t(21079),r=t(55199);const i={name:"Table",summary:"<p>\u53ef\u4ee5\u4ece\u540e\u7aef\u83b7\u53d6\u6570\u636e\uff0c\u7136\u540e\u5c55\u793a\u4e3a\u4e00\u4e2a\u8868\u683c</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Table_51c45",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Table } = _Table;\nconst { PureGlobal } = _Global;\nconst { preset } = reactFetch;\n\nconst ajax = (config) => {\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      if (config.url === "/api/v1/user/user/user_key_get") {\n        resolve({\n          data: {\n            code: 0,\n            data: `{"date":{"visible":false},"serialNumber":{"width":400}}`,\n          },\n        });\n      } else if (config.url === "/api/v1/user/user/user_key_set") {\n        console.log(config.data);\n        resolve({\n          data: {\n            code: 0,\n            data: "",\n          },\n        });\n      }\n    }, 100);\n  });\n};\n\npreset({\n  ajax,\n});\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax /*tableServerApis: {\n                  getDataApi: (name) => {\n                    return {\n                      url: "/api/v1/user/user/user_key_get",\n                      method: "GET",\n                      params: {\n                        key: `table_config_v2_${name}`,\n                      },\n                      transformResponse: (response) => {\n                        const { data } = response;\n                        response.data = Object.assign({}, data, {\n                          data: (() => {\n                            try {\n                              return JSON.parse(data.data);\n                            } catch (e) {\n                              return [];\n                            }\n                          })(),\n                        });\n\n                        response.data = {\n                          code: response.data.code === 0 ? 200 : data.code,\n                          msg: response.data.msg,\n                          results: response.data.data,\n                        };\n\n                        return response;\n                      },\n                      cache: "TABLE_PAGE_CONFIG",\n                    };\n                  },\n                  setDataFunc: (name, data) => {\n                    return ajax({\n                      url: "/api/v1/user/user/user_key_set",\n                      data: {\n                        map: {\n                          [`table_config_v2_${name}`]: JSON.stringify(data),\n                        },\n                      },\n                    });\n                  },\n                },*/,\n      }}\n    >\n      <Table\n        name="test-table"\n        onTablePropsReady={({ columns, dataSource }) => {\n          console.log({ columns, dataSource });\n        }}\n        dataSource={[\n          {\n            id: 0,\n            date: "2021-07-21",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: null,\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 4,\n            description:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n          {\n            id: 1,\n            date: "",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca1",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: null,\n            email: "a@a.com",\n            count: 5,\n            description: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n        ]}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            type: "datetime",\n            hideSecond: true,\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            type: "serialNumber",\n            primary: true,\n            onClick: async (item) => {\n              console.log(item);\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve(true);\n                }, 10000);\n              });\n            },\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "tagEnum",\n            title: "\u6807\u7b7e\u679a\u4e3e",\n            type: "tag",\n            valueOf: (item) =>\n              item.tagEnum && {\n                type: "success",\n                isEnum: true,\n                moduleName: "marital",\n                name: item.tagEnum,\n              },\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "hideInfo",\n            title: "\u9690\u85cf\u5b57\u6bb5",\n            type: "hideInfo",\n            valueOf: (item) =>\n              item["phoneNumber"] && {\n                loader: () => {\n                  return item["phoneNumber"] + "-" + item["id"];\n                },\n              },\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            type: "description",\n          },\n          {\n            name: "description2",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u5206\u914d",\n                message: "\u786e\u5b9a\u8981\u5206\u914d\u5417",\n                isDelete: false,\n              },\n              {\n                children: "\u5ba1\u6838",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n                confirm: true,\n                onClick: () => {\n                  console.log("\u5220\u9664");\n                },\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"_Global",packageName:"@components/Global",component:o},{name:"reactFetch",packageName:"@kne/react-fetch",component:l}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { PureGlobal } = _Global;\nconst { TablePage } = _Table;\nconst { range } = lodash;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        features: {\n          debug: true,\n          profile: {\n            id: "erc",\n            type: "system",\n            name: "\u4e1a\u52a1\u7cfb\u7edf",\n            children: [\n              {\n                id: "test",\n                type: "feature",\n                name: "\u6d4b\u8bd5\u529f\u80fd",\n                options: {\n                  hiddenColumns: ["date", "datetime"],\n                },\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <TablePage\n        featureId="test"\n        name="test-2"\n        sticky={false}\n        rowSelection={{\n          type: "checkbox",\n        }}\n        loader={() => {\n          return {\n            addUserName: "\u6211\u662f\u5927\u9b54\u738b",\n            pageData: range(0, 50).map((index) => ({\n              id: index,\n              date: "2021-07-21",\n              datetime: "2023-07-22 09:00:00",\n              serialNumber: "SX00192932323434",\n              serialNumberShort: "SH0023",\n              userName: "\u6797\u73ca\u73ca" + index,\n              title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n              enUserName: "Lin Shanshan",\n              phoneNumber: "+86 18792877372",\n              email: "a@a.com",\n              count: 5,\n              description:\n                "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n              other: "\u5176\u4ed6\u4fe1\u606f",\n            })),\n            totalCount: 50,\n          };\n        }}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            type: "datetime",\n          },\n          {\n            name: "dateRange",\n            title: "\u65e5\u671f\u8303\u56f4",\n            type: "dateRange",\n            valueOf: ({ date, datetime }) => [date, datetime],\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            type: "serialNumber",\n            primary: true,\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n          },\n          {\n            name: "phone",\n            title: "\u624b\u673a\u53f7",\n            type: "hideInfo",\n            primary: true,\n            valueOf: (item) => ({\n              loader: () => {\n                return item["phoneNumber"] + "-" + item["id"];\n              },\n            }),\n          },\n          {\n            name: "email",\n            title: "\u90ae\u7bb1",\n            type: "hideInfo",\n            valueOf: (item) => ({\n              loader: () => {\n                return item["email"] + "-" + item["id"];\n              },\n              children: (data) => {\n                return `${data},${item["userName"]}`;\n              },\n            }),\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n          },\n          {\n            name: "addUser",\n            title: "\u6dfb\u52a0\u4eba",\n            type: "user",\n            render: ({ data }) => ({ valueOf: () => data.addUserName }),\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            fixed: "right",\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u7f16\u8f91",\n                disabled: true,\n                tooltipProps: {\n                  title: "\u4e0d\u80fd\u7f16\u8f91\u8fd9\u6761\u4fe1\u606f",\n                },\n              },\n              {\n                children: "\u5ba1\u6838",\n                tooltipProps: {\n                  title: (\n                    <div\n                      style={{ padding: "10px", backgroundColor: "skyblue" }}\n                    >\n                      \u5ba1\u6838\u64cd\u4f5c\u7684tooltip\n                    </div>\n                  ),\n                },\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"lodash",packageName:"lodash",component:d},{name:"_Global",packageName:"@components/Global",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Table } = _Table;\nconst { PureGlobal } = _Global;\nconst { preset } = reactFetch;\nconst { useState } = React;\nconst { Input } = antd;\nconst ajax = (config) => {\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      if (config.url === "/api/v1/user/user/user_key_get") {\n        resolve({\n          data: {\n            code: 0,\n            data: `{"date":{},"serialNumber":{"width":400}}`,\n          },\n        });\n      } else if (config.url === "/api/v1/user/user/user_key_set") {\n        console.log(config.data);\n        resolve({\n          data: {\n            code: 0,\n            data: "",\n          },\n        });\n      }\n    }, 100);\n  });\n};\n\npreset({\n  ajax,\n});\n\nconst ValueEdit = ({ value, targetRender }) => {\n  const [isEdit, setIsEdit] = useState(false);\n  return (\n    <span\n      onClick={() => {\n        setIsEdit(true);\n      }}\n    >\n      {isEdit ? (\n        <Input\n          type="text"\n          size="small"\n          defaultValue={value}\n          onBlur={() => {\n            setIsEdit(false);\n          }}\n        />\n      ) : (\n        targetRender(value)\n      )}\n    </span>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        ajax,\n        tableServerApis: {\n          getDataApi: (name) => {\n            return {\n              url: "/api/v1/user/user/user_key_get",\n              method: "GET",\n              params: {\n                key: `table_config_v2_${name}`,\n              },\n              transformResponse: (response) => {\n                const { data } = response;\n                response.data = Object.assign({}, data, {\n                  data: (() => {\n                    try {\n                      return JSON.parse(data.data);\n                    } catch (e) {\n                      return [];\n                    }\n                  })(),\n                });\n\n                response.data = {\n                  code: response.data.code === 0 ? 200 : data.code,\n                  msg: response.data.msg,\n                  results: response.data.data,\n                };\n\n                return response;\n              },\n              cache: "TABLE_PAGE_CONFIG",\n            };\n          },\n          setDataFunc: (name, data) => {\n            return ajax({\n              url: "/api/v1/user/user/user_key_set",\n              data: {\n                map: {\n                  [`table_config_v2_${name}`]: JSON.stringify(data),\n                },\n              },\n            });\n          },\n        },\n      }}\n    >\n      <Table\n        name="test-table"\n        dataSource={[\n          {\n            id: 0,\n            date: "2021-07-21",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 4,\n            description:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2:\n              "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n          {\n            id: 1,\n            date: "",\n            datetime: "2023-07-22 09:00:00",\n            serialNumber: "SX00192932323434",\n            serialNumberShort: "SH0023",\n            userName: "\u6797\u73ca\u73ca1",\n            title: "\u6211\u662f\u4e3b\u8981\u5b57\u6bb5",\n            tagEnum: "Y",\n            enUserName: "Lin Shanshan",\n            phoneNumber: "+86 18792877372",\n            email: "a@a.com",\n            count: 5,\n            description: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            description2: "\u6211\u662f\u4e00\u6bb5\u63cf\u8ff0",\n            other: "\u5176\u4ed6\u4fe1\u606f",\n          },\n        ]}\n        columns={[\n          {\n            name: "date",\n            title: "\u65e5\u671f",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-1",\n                title: "\u5206\u7ec41-1",\n              },\n            ],\n            type: "date",\n            hover: true,\n          },\n          {\n            name: "datetime",\n            title: "\u65e5\u671f\u65f6\u95f4",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-2",\n                title: "\u5206\u7ec41-2",\n              },\n            ],\n            type: "datetime",\n          },\n          {\n            name: "serialNumber",\n            title: "\u7f16\u53f7",\n            sort: true,\n            groupHeader: [\n              {\n                name: "group1",\n                title: "\u5206\u7ec41",\n              },\n              {\n                name: "group1-1",\n                title: "\u5206\u7ec41-1",\n              },\n            ],\n            type: "serialNumber",\n            primary: true,\n          },\n          {\n            name: "serialNumberShort",\n            title: "\u77ed\u7f16\u53f7",\n            type: "serialNumberShort",\n          },\n          {\n            name: "title",\n            title: "\u4e3b\u8981\u4fe1\u606f",\n            type: "mainInfo",\n            disableColItem: true,\n            valueOf: (item, { targetRender }) => (\n              <ValueEdit value={item["title"]} targetRender={targetRender} />\n            ),\n          },\n          {\n            name: "tag",\n            title: "\u72b6\u6001\u6807\u7b7e",\n            type: "tag",\n            valueOf: () => ({ type: "success", text: "\u5ba1\u6838\u901a\u8fc7" }),\n          },\n          {\n            name: "tagEnum",\n            title: "\u6807\u7b7e\u679a\u4e3e",\n            type: "tag",\n            valueOf: (item) => ({\n              type: "success",\n              isEnum: true,\n              moduleName: "marital",\n              name: item.tagEnum,\n            }),\n          },\n          {\n            name: "avatar",\n            title: "\u5934\u50cf",\n            type: "avatar",\n            valueOf: () => ({ gender: "F" }),\n          },\n          {\n            name: "user",\n            title: "\u7528\u6237",\n            type: "user",\n            valueOf: (item) => `${item.enUserName} ${item.userName}`,\n          },\n          {\n            name: "hideInfo",\n            title: "\u9690\u85cf\u5b57\u6bb5",\n            type: "hideInfo",\n            valueOf: (item) => ({\n              loader: () => {\n                return item["phoneNumber"] + "-" + item["id"];\n              },\n            }),\n          },\n          {\n            name: "userName",\n            title: "\u7528\u6237\u540d",\n            type: "userName",\n          },\n          {\n            name: "contacts",\n            title: "\u8054\u7cfb\u4eba",\n            type: "contacts",\n            valueOf: (item) => `${item.userName} ${item.phoneNumber}`,\n          },\n          {\n            name: "count",\n            title: "\u6570\u91cf",\n            type: "singleRow",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: "description",\n            title: "\u63cf\u8ff0",\n            type: "description",\n          },\n          {\n            name: "description2",\n            title: "\u63cf\u8ff0(\u7701\u7565)",\n            type: "description",\n            ellipsis: true,\n          },\n          {\n            name: "other",\n            title: "\u5176\u4ed6",\n            type: "other",\n            hover: true,\n            sort: true,\n          },\n          {\n            name: "options",\n            title: "\u64cd\u4f5c",\n            type: "options",\n            fixed: "right",\n            sort: true,\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: "\u5206\u914dProgram\u53ca\u6559\u7ec3",\n              },\n              {\n                children: "\u5ba1\u6838",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u6dd8\u6c70",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: "\u4e00\u952e\u7ea6\u9762",\n              },\n              {\n                children: "\u5220\u9664",\n              },\n            ],\n          },\n        ]}\n        onSortChange={(sort) => {\n          console.log(">>>>>>", sort);\n        }}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Table",packageName:"@components/Table",component:a},{name:"_Global",packageName:"@components/Global",component:o},{name:"reactFetch",packageName:"@kne/react-fetch",component:l},{name:"antd",packageName:"antd",component:r}]}]}}},71384:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(41381),o=t(55199);const l={name:"InfoPage",summary:"<h3><em><code>InfoPage</code></em> \u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u4e00\u822c\u7528\u5728\u590d\u6742\u7684\u8be6\u60c5\u5c55\u793a\u9875\u9762\uff0c<code>InfoPage</code> \u63d0\u4f9b\u4e86\u4e00\u4e2a\u6807\u51c6\u7684\u5c55\u793a\u4fe1\u606f\u7684\u683c\u5f0f</p>\n<h3>\u7279\u70b9</h3>\n<ul>\n<li>\u652f\u6301 <code>Content</code> \u7ec4\u4ef6 <code>Descriptions</code> \u7ec4\u4ef6\u7684\u7ec4\u5408</li>\n<li>\u652f\u6301 <code>Collapse</code> \u7ec4\u4ef6\u7ec4\u5408</li>\n<li><code>InfoPage.Part</code>\u3001<code>InfoPage.Collapse</code> \u9700\u8981\u653e\u5728 <code>InfoPage</code> \u4e4b\u4e0b\uff0c<code>Content</code>\u3001<code>Descriptions</code> \u53ef\u4ee5\u4efb\u610f\u7ec4\u5408</li>\n</ul>\n<h3><em><code>Content</code></em> \u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6210\u7ec4\u5c55\u793a\u591a\u4e2a\u5b57\u6bb5\uff0c\u5e38\u89c1\u4e8e\u8be6\u60c5\u9875\u7684\u4fe1\u606f\u5c55\u793a</p>\n<h3>\u7279\u70b9</h3>\n<p>labelAlign \u4e0d\u4e3a auto \u65f6\u4f1a\u81ea\u52a8\u8ba1\u7b97 label \u7684\u6700\u5c0f\u5bbd\u5ea6\u4f7f\u6240\u6709 label \u7684\u5bbd\u5ea6\u7b49\u4e8e\u6700\u957f\u7684 label \u5bbd\u5ea6\uff0c\u4f7f\u89c6\u89c9\u4e0a\u66f4\u52a0\u6574\u9f50\u6709\u79e9\u5e8f\u611f</p>",api:'<h3>InfoPage</h3>\n<p>\u540c <a href="https://ant.design/components/Card#api"><code>Ant Design Card</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>InfoPage</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Part</h4>\n<p>\u540c <a href="https://ant.design/components/Card#api"><code>Ant Design Card</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Part</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Collapse</h4>\n<p>\u540c <a href="https://ant.design/components/Collapse#collapse"><code>Ant Design Collapse</code></a></p>\n<p>\u65b0\u589e\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>className</td>\n<td><code>Part</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Content</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td><code>Content</code> \u7684\u5185\u5bb9\u5217\u8868</td>\n<td><code>listItemProps[]</code></td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td><code>label</code> \u7684\u5bf9\u9f50\u65b9\u5f0f\u53ef\u4ee5\u4f20\u5165\u7684\u503c <code>left,right,center,auto</code>,\u4e3a <code>auto</code> \u65f6 <code>label</code> \u4e0d\u8ba1\u7b97\u6700\u5c0f\u5bbd\u5ea6</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>\u5217\u6570</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>size</td>\n<td>\u9ed8\u8ba4\u4e3a <code>14px</code>\uff0c\u53ef\u4ee5\u4f20\u503c\u4e3a <code>small</code>\uff0c<code>size</code> \u4e3a <code>small</code> \u65f6\u5b57\u53f7\u4e3a <code>12px</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\u6216\u652f\u6301\u54cd\u5e94\u5f0f\u7684\u5bf9\u8c61\u5199\u6cd5\u6765\u8bbe\u7f6e\u6c34\u5e73\u95f4\u9694 <code>{ xs: 8, sm: 16, md: 24}</code>\u3002\u6216\u8005\u4f7f\u7528\u6570\u7ec4\u5f62\u5f0f\u540c\u65f6\u8bbe\u7f6e [\u6c34\u5e73\u95f4\u8ddd, \u5782\u76f4\u95f4\u8ddd]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Content</code> \u7684 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>\u63a5\u6536 <code>Content Inner</code> \u548c <code>Inner</code> \u7684 <code>label, content, index</code>\uff0c\u53ef\u4ee5\u6839\u636e\u6570\u636e\u4fe1\u606f\u8fd4\u56de\u60f3\u8981\u6e32\u67d3\u7684\u5185\u5bb9</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>listItemProps</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a\uff0c\u5f53\u4e3a <code>function</code> \u65f6\u53ef\u4ee5\u63a5\u6536\u5230 <code>item, list</code> \u53c2\u6570\uff0c<code>item</code> \u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0c<code>dataSource</code> \u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684 <code>dataSource</code> \u914d\u7f6e</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>block</td>\n<td>\u662f\u5426\u5355\u884c\u663e\u793a\u8be5\u6761\u4fe1\u606f</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>label</td>\n<td>\u6807\u9898</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u5185\u5bb9</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Descriptions</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>\u8be6\u60c5\u6570\u636e\u6e90\uff0c\u5185\u90e8\u6bcf\u4e2a\u6570\u7ec4\u4e3a\u4e00\u884c\u6570\u636e\uff0c\u6bcf\u884c\u6570\u636e\u4e2d\u6bcf\u4e2a\u5bf9\u8c61\u4e3a\u4e00\u5217\u6570\u636e\uff0c\u6bcf\u884c\u6700\u591a\u5305\u542b <code>2</code> \u5217\u5185\u5bb9\uff0c\u591a\u4f59\u7684\u4f1a\u88ab\u4e22\u5f03</td>\n<td><code>dataSourceItemProps[]</code></td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>\u63a5\u6536 <code>Descriptions Inner</code> \u548c <code>Inner</code> \u7684 <code>label, content, displaty, index</code>\uff0c\u53ef\u4ee5\u6839\u636e\u6570\u636e\u4fe1\u606f\u8fd4\u56de\u60f3\u8981\u6e32\u67d3\u7684\u5185\u5bb9</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>dataSourceItemProps</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>\u6570\u636e\u662f\u5426\u5c55\u793a\uff0c\u5f53\u4e3a <code>function</code> \u65f6\u53ef\u4ee5\u63a5\u6536\u5230 <code>item, dataSource</code> \u53c2\u6570\uff0c<code>item</code> \u4e3a\u5f53\u524d\u9879\u914d\u7f6e\uff0c<code>dataSource</code> \u4e3a\u6574\u4e2a\u7ec4\u4ef6\u7684 <code>dataSource</code> \u914d\u7f6e</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>label</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u6807\u9898</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u6570\u636e\u5c55\u793a\u7684\u5185\u5bb9</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>',example:{isFull:!1,className:"InfoPage_fb7ea",style:"",list:[{title:"InfoPage",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: InfoPage } = _InfoPage;\nconst { Button } = antd;\n\nconst BaseExample = () => {\n  return (\n    <InfoPage>\n      InfoPage\n      <InfoPage.Part\n        title="Part Title"\n        subtitle="\u6211\u662f\u4e00\u4e2asubtitle"\n        extra={<Button>\u64cd\u4f5c</Button>}\n      >\n        InfoPage.Part\n        <InfoPage.Part\n          title="Part Title"\n          subtitle="\u6211\u662f\u4e00\u4e2asubtitle"\n          extra={<Button>\u64cd\u4f5c</Button>}\n        >\n          InfoPage.InfoPage.Part\n        </InfoPage.Part>\n      </InfoPage.Part>\n      <InfoPage.Collapse\n        items={[\n          {\n            key: "1",\n            label: "This is default size panel header",\n            children: <p>InfoPage.Collapse</p>,\n          },\n          {\n            key: "2",\n            label: "This is default size panel header2",\n            children: <p>InfoPage.Collapse2</p>,\n          },\n        ]}\n      />\n    </InfoPage>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Content",description:"\u5c55\u793a\u4e86\u4e00\u4e2a\u57fa\u672c\u5185\u5bb9",code:'const { Content } = _InfoPage;\nconst { Space, Radio } = antd;\nconst { useState } = React;\n\nconst BaseExample = () => {\n  const [listProps, setListProps] = useState({\n    col: 1,\n    size: "default",\n    labelAlign: "left",\n  });\n  const onChange = (e, name) => {\n    const val = e?.target.value;\n    setListProps((prevState) => Object.assign({}, prevState, { [name]: val }));\n  };\n\n  return (\n    <Space direction="vertical" size={12}>\n      <Radio.Group onChange={(e) => onChange(e, "col")} value={listProps.col}>\n        <Radio.Button value={1}>1\u5217</Radio.Button>\n        <Radio.Button value={2}>2\u5217</Radio.Button>\n        <Radio.Button value={3}>3\u5217</Radio.Button>\n      </Radio.Group>\n      <Radio.Group\n        onChange={(e) => onChange(e, "labelAlign")}\n        value={listProps.labelAlign}\n      >\n        <Radio.Button value="left">\u5de6\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="center">\u4e2d\u5fc3\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="right">\u53f3\u5bf9\u9f50</Radio.Button>\n        <Radio.Button value="auto">\u81ea\u9002\u5e94</Radio.Button>\n      </Radio.Group>\n      <Radio.Group onChange={(e) => onChange(e, "size")} value={listProps.size}>\n        <Radio.Button value="default">\u9ed8\u8ba4</Radio.Button>\n        <Radio.Button value="small">small</Radio.Button>\n      </Radio.Group>\n      <Content\n        {...listProps}\n        list={[\n          { label: "\u6807\u9898", content: "\u5185\u5bb9" },\n          { label: "\u6807\u9898\u6807\u9898", content: "\u5185\u5bb9\u5185\u5bb9" },\n          {\n            label: "\u6807\u9898\u6807",\n            content: "\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9",\n          },\n          {\n            label: "\u6807\u9898\u6807\u9898\u6807\u9898",\n            content:\n              "\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9\u5185\u5bb9",\n          },\n        ]}\n        itemRender={(inner, other) => {\n          return other?.index === 2 ? "\u6b64\u5904\u5185\u5bb9\u989d\u5916\u81ea\u5b9a\u4e49" : inner;\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Descriptions",description:"\u5c55\u793a\u4e00\u4e2a\u4fe1\u606f\u8be6\u60c5",code:'const { Descriptions } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: "\u5ba2\u6237\u540d\u79f0", content: "\u817e\u8baf" },\n          {\n            label: "\u53d1\u7968\u62ac\u5934",\n            content: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n          },\n        ],\n        [\n          { label: "\u53d1\u7968\u7c7b\u578b", content: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968" },\n          {\n            label: "\u53d1\u7968\u5f00\u5177\u65e5\u671f",\n            content: "2022-08-15",\n          },\n        ],\n        [{ label: "\u9000\u7968\u91d1\u989d", content: "22000.00\u5143" }],\n        [\n          {\n            label: "\u53d1\u7968\u53f7",\n            content: (\n              <div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n                <div>00384895992774</div>\n              </div>\n            ),\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9700\u8981\u91cd\u5f00\u53d1\u7968", content: "\u5426" },\n          {\n            label: "\u662f\u5426\u6d89\u53ca\u91d1\u878d\u53d8\u52a8",\n            content: "\u5426",\n          },\n        ],\n        [\n          { label: "\u662f\u5426\u9020\u6210\u5b9e\u8d28\u635f\u5931", content: "\u5426" },\n          { label: "\u8d23\u4efb\u5f52\u5c5e", content: "\u5ba2\u6237\u539f\u56e0" },\n        ],\n        [\n          {\n            label: "\u9000\u7968\u539f\u56e0",\n            content: "\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf\u8ff0\u9000\u7968\u539f\u56e0\u7684\u63cf",\n          },\n        ],\n        [{ label: "\u9644\u4ef6", content: "\u9644\u4ef6\u540d\u79f0" }],\n        [\n          { label: "\u64cd\u4f5c\u65f6\u95f4", content: "2022-08-01 16:32" },\n          { label: "\u64cd\u4f5c\u4eba", content: "\u897f\u897f\u6b6a", display: false },\n        ],\n        [\n          {\n            label: "\u8d85\u957f\u5185\u5bb9",\n            content:\n              "\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9\u8d85\u957f\u5185\u5bb9",\n          },\n          {\n            label: "\u8d85\u957f\u82f1\u6587",\n            content:\n              "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"CentralContent",description:"\u8bf7\u5c3d\u91cf\u4f7f\u7528\u8be5\u7ec4\u4ef6\u4ee3\u66ffDescriptions\u7ec4\u4ef6\u3002\u8be5\u7ec4\u4ef6\u6bd4Descriptions\u7ec4\u4ef6\u6dfb\u52a0\u4e86\u6570\u636e\u683c\u5f0f\u5316\u548c\u7075\u6d3b\u7684\u7a7a\u5224\u65ad\u548c\u81ea\u5b9a\u4e49\u7a7a\u5c55\u793a\uff0c\u5e76\u4e14\u4f18\u5316\u4e86\u6392\u5217\uff0c\u53ef\u4ee5\u5b9e\u73b0\u4efb\u4f55\u6805\u683c\u5927\u5c0f\u7684\u6570\u636e\u9879\u590d\u6742\u7ec4\u5408\u3002\u5b9e\u73b0\u4e86\u5c3e\u884c\u4f18\u5316\uff0c\u4f7f\u4f60\u4e0d\u5fc5\u62c5\u5fc3\u672b\u5c3e\u9879\u7684\u5bbd\u5ea6\u95ee\u9898\uff0c\u7a0b\u5e8f\u4f1a\u81ea\u52a8\u8ba1\u7b97\u5e76\u5360\u6ee1\u8be5\u884c\u3002",code:'const { CentralContent } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <CentralContent\n      dataSource={{\n        id: "RC00101",\n        name: "\u5f20\u4e09",\n        birthday: "2020-03-03",\n        addTime: new Date(),\n        count: 2000.1322,\n        count2: 0.01234565,\n        count3: 1234523,\n        description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\n\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\n\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n        description2: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n      }}\n      col={3}\n      columns={[\n        {\n          name: "id",\n          title: "ID",\n          block: true,\n        },\n        {\n          name: "name",\n          title: "\u59d3\u540d",\n          span: 10,\n        },\n        {\n          name: "birthday",\n          title: "\u51fa\u751f\u65e5\u671f",\n          format: "date",\n        },\n        {\n          name: "addTime",\n          title: "\u6dfb\u52a0\u65f6\u95f4",\n          format: "datetime",\n        },\n        {\n          name: "count",\n          title: "\u6570\u91cf",\n          format: "number",\n        },\n        {\n          name: "count2",\n          title: "\u767e\u5206\u6bd4",\n          format: "number-percent money-\u767e\u5206\u6bd4",\n        },\n        {\n          name: "count3",\n          title: "\u4e07\u5143",\n          format: "number--10000",\n          render: (value) => `${value}\u4e07\u5143`,\n        },\n        {\n          name: "empty",\n          title: "\u7a7a\u503c\u663e\u793a",\n        },\n        {\n          name: "empty2",\n          title: "\u7a7a\u503c\u663e\u793a2",\n          placeholder: "\u7a7a",\n        },\n        {\n          name: "empty3",\n          title: "\u7a7a\u503c\u663e\u793a3",\n          emptyIsPlaceholder: false,\n        },\n        {\n          name: "description",\n          title: "\u63cf\u8ff0",\n        },\n        {\n          name: "description2",\n          title: "\u63cf\u8ff0",\n        },\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"TableView",description:"",code:'const { TableView } = _InfoPage;\nconst { Flex } = antd;\nconst { useState } = React;\n\nconst dataSource = [\n  {\n    id: "RC00101",\n    name: "\u5f20\u4e09",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00102",\n    name: "\u674e\u56db",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00103",\n    name: "\u738b\u4e94",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n  {\n    id: "RC00104",\n    name: "\u9a6c\u4e03",\n    birthday: "2020-03-03",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: `\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0\u63cf\u8ff0`,\n  },\n];\n\nconst columns = [\n  {\n    name: "id",\n    title: "ID",\n  },\n  {\n    name: "name",\n    title: "\u59d3\u540d",\n  },\n  {\n    name: "birthday",\n    title: "\u51fa\u751f\u65e5\u671f",\n    format: "date",\n  },\n  {\n    name: "addTime",\n    title: "\u6dfb\u52a0\u65f6\u95f4",\n    format: "datetime",\n  },\n  {\n    name: "count",\n    title: "\u6570\u91cf",\n    format: "number",\n  },\n  {\n    name: "description",\n    title: "\u63cf\u8ff0",\n    span: 10,\n  },\n];\n\nconst WithCheckbox = () => {\n  const [selectKeys, setSelectKeys] = useState([]);\n  return (\n    <TableView\n      dataSource={dataSource}\n      columns={columns}\n      rowSelection={{\n        type: "checkbox",\n        allowSelectedAll: true,\n        selectedRowKeys: selectKeys,\n        onChange: setSelectKeys,\n      }}\n    />\n  );\n};\n\nconst WithSelected = () => {\n  const [selectKeys, setSelectKeys] = useState([]);\n  return (\n    <TableView\n      dataSource={dataSource}\n      columns={columns}\n      rowSelection={{\n        selectedRowKeys: selectKeys,\n        onChange: setSelectKeys,\n      }}\n    />\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Flex vertical gap={10}>\n      <TableView dataSource={dataSource} columns={columns} />\n      <WithCheckbox />\n      <WithSelected />\n      <TableView dataSource={[]} columns={columns} />\n      <div\n        style={{\n          height: "200px",\n          overflowY: "scroll",\n        }}\n      >\n        <TableView dataSource={dataSource} columns={columns} sticky />\n      </div>\n    </Flex>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"Flow",description:"",code:'const { Space, Flex, Divider } = antd;\nconst { Flow } = _InfoPage;\nconst BaseExample = () => {\n  return (\n    <Flex vertical gap={8}>\n      <Flow\n        current={2}\n        dataSource={[\n          {\n            title: "title1",\n            description: "This is a description.",\n            createTime: "2022-08-15 10:29",\n            descriptionContent: [\n              {\n                name: "\u738b\u5efa\u56fd1",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "2023-08-15 10:30",\n                content: "test",\n              },\n              {\n                name: "\u738b\u5efa\u56fd2",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "2023-08-15 10:31",\n                content: "test",\n              },\n            ],\n          },\n          {\n            title: "\u81ea\u5b9a\u4e49DescriptionContentItem\u6e32\u67d3\u6837\u5f0f",\n            description: "This is a description.",\n            descriptionContent: [\n              {\n                name: "\u738b\u5efa\u56fd3",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "08-15 10:30",\n                content: "test",\n              },\n              {\n                name: "\u738b\u5efa\u56fd4",\n                action: "\u6dfb\u52a0\u4e86\u5907\u6ce8",\n                time: "08-15 10:31",\n                content: "test",\n              },\n            ],\n          },\n          { title: "title3", description: "This is a description." },\n          {\n            title: "title4",\n            description: "This is a description.",\n          },\n        ]}\n        columns={[\n          {\n            name: "title",\n          },\n          {\n            name: "description",\n          },\n          {\n            type: "subTitle",\n            name: "createTime",\n            format: "datetime",\n          },\n          {\n            name: "status",\n          },\n          {\n            type: "actionList",\n            name: "descriptionContent",\n            children: [\n              {\n                name: "name",\n              },\n              {\n                name: "action",\n              },\n              {\n                type: "options",\n                name: "time",\n                format: "datetime",\n              },\n              {\n                name: "content",\n                render: (item, { target }) => {\n                  return `@@@@@${target.name}-${target.action}-${target.content}`;\n                },\n              },\n            ],\n          },\n        ]}\n      />\n      <Flow\n        direction="horizontal"\n        progressDot\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n      />\n\n      <Flow\n        direction="vertical"\n        progressDot\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n      />\n      <Flow\n        dataSource={[\n          {\n            title: "finish",\n            description: "This is a description.",\n            subTitle: "2023-08-15 10:29",\n            status: "finish",\n          },\n          {\n            title: "process",\n            description: "This is a description.",\n            status: "process",\n          },\n          {\n            title: "error",\n            description: "This is a description.",\n            status: "error",\n          },\n          {\n            title: "wait",\n            description: "This is a description.",\n            status: "wait",\n          },\n        ]}\n        columns={[{ name: "subTitle", format: "datetime" }]}\n      />\n    </Flex>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_InfoPage",packageName:"@components/InfoPage",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},73650:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(48731),o=t(55199),l=t(63743);const d={name:"Enum",summary:"<p>\u679a\u4e3e\u503c\u7ba1\u7406\u548c\u5c55\u793a\u7ec4\u4ef6\uff0c\u7528\u4e8e\u7edf\u4e00\u7ba1\u7406\u5e94\u7528\u4e2d\u7684\u679a\u4e3e\u6570\u636e\uff0c\u5982\u6027\u522b\u3001\u72b6\u6001\u3001\u7c7b\u578b\u7b49\u9009\u9879\u5217\u8868\u3002</p>\n<h2>\u4f55\u65f6\u4f7f\u7528</h2>\n<ul>\n<li>\u9700\u8981\u5c55\u793a\u679a\u4e3e\u503c\u7684\u63cf\u8ff0\u6587\u672c\u65f6</li>\n<li>\u9700\u8981\u5c06\u679a\u4e3e\u5217\u8868\u6e32\u67d3\u4e3a\u4e0b\u62c9\u6846\u3001\u5355\u9009\u6846\u7b49\u8868\u5355\u7ec4\u4ef6\u65f6</li>\n<li>\u9700\u8981\u7edf\u4e00\u7ba1\u7406\u5e94\u7528\u4e2d\u7684\u679a\u4e3e\u6570\u636e\u65f6</li>\n<li>\u9700\u8981\u652f\u6301\u591a\u8bed\u8a00\u7684\u679a\u4e3e\u63cf\u8ff0\u65f6</li>\n</ul>\n<h2>\u7279\u6027</h2>\n<ul>\n<li>\ud83d\udce6 \u7edf\u4e00\u7684\u679a\u4e3e\u6570\u636e\u7ba1\u7406</li>\n<li>\ud83d\udd04 \u652f\u6301\u540c\u6b65/\u5f02\u6b65\u52a0\u8f7d</li>\n<li>\ud83d\udce1 \u5185\u7f6eLRU\u7f13\u5b58\u673a\u5236</li>\n<li>\ud83c\udf0d \u652f\u6301\u591a\u8bed\u8a00</li>\n<li>\ud83c\udfa8 \u591a\u79cd\u683c\u5f0f\u5316\u65b9\u5f0f</li>\n<li>\ud83d\udd27 \u7075\u6d3b\u7684\u6e32\u67d3\u51fd\u6570</li>\n</ul>",api:"<h2>Enum \u7ec4\u4ef6 API</h2>\n<h3>Enum\uff08\u9ed8\u8ba4\u5bfc\u51fa\uff09</h3>\n<p>\u7528\u4e8e\u83b7\u53d6\u5355\u4e2a\u6216\u591a\u4e2a\u679a\u4e3e\u503c\u7684\u5c55\u793a\u5185\u5bb9\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>\u679a\u4e3e\u6a21\u5757\u540d\u79f0\uff0c\u5bf9\u5e94\u9884\u8bbe\u4e2d\u914d\u7f6e\u7684\u679a\u4e3e\u540d\u79f0</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>\u679a\u4e3e\u503c\uff0c\u5f53\u63d0\u4f9b\u65f6\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u9879\uff1b\u4e0d\u63d0\u4f9b\u65f6\u83b7\u53d6\u6574\u4e2a\u679a\u4e3e\u5217\u8868</td>\n<td>string | number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>\u683c\u5f0f\u5316\u65b9\u5f0f\uff1a'default'\u8fd4\u56de\u63cf\u8ff0\u6587\u672c\uff0c'origin'\u8fd4\u56de\u539f\u59cb\u5bf9\u8c61\uff0c'option'\u8fd4\u56de{label, value}\u683c\u5f0f</td>\n<td>'default' | 'origin' | 'option'</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>force</td>\n<td>\u662f\u5426\u5f3a\u5236\u5237\u65b0\u7f13\u5b58\uff0c\u8df3\u8fc7\u7f13\u5b58\u76f4\u63a5\u8bf7\u6c42</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u5b50\u5143\u7d20\u6216\u6e32\u67d3\u51fd\u6570\u3002\u51fd\u6570\u63a5\u6536(data, fetchApi)\u53c2\u6570</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>\u6570\u636e\u52a0\u8f7d\u4e2d\u65f6\u7684\u5360\u4f4d\u5185\u5bb9</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u5931\u8d25\u65f6\u7684\u5c55\u793a\u5185\u5bb9</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u81ea\u5b9a\u4e49\u52a0\u8f7d\u4e2d\u72b6\u6001\u7684\u5c55\u793a</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>EnumResource</h3>\n<p>\u7528\u4e8e\u83b7\u53d6\u5b8c\u6574\u7684\u679a\u4e3e\u5217\u8868\u8d44\u6e90\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>\u679a\u4e3e\u6a21\u5757\u540d\u79f0\uff0c\u652f\u6301\u6570\u7ec4\u4ee5\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>\u683c\u5f0f\u5316\u65b9\u5f0f</td>\n<td>'origin' | 'option' | 'default'</td>\n<td>'origin'</td>\n</tr>\n<tr>\n<td>children</td>\n<td>\u6e32\u67d3\u51fd\u6570\uff0c\u63a5\u6536\u679a\u4e3e\u5217\u8868\u4f5c\u4e3a\u53c2\u6570</td>\n<td>Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>\u6570\u636e\u52a0\u8f7d\u4e2d\u65f6\u7684\u5360\u4f4d\u5185\u5bb9</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u5931\u8d25\u65f6\u7684\u5c55\u793a\u5185\u5bb9</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u81ea\u5b9a\u4e49\u52a0\u8f7d\u4e2d\u72b6\u6001\u7684\u5c55\u793a</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>\u679a\u4e3e\u914d\u7f6e</h3>\n<p>\u679a\u4e3e\u6570\u636e\u901a\u8fc7 <code>preset</code> \u51fd\u6570\u6216 <code>PureGlobal/Global</code> \u7ec4\u4ef6\u7684 <code>preset.enums</code> \u914d\u7f6e\uff1a</p>\n<pre><code class=\"language-javascript\">// \u5168\u5c40\u914d\u7f6e\npreset({\n  base: {\n    gender: () =&gt; [\n      { value: 'M', description: '\u7537' },\n      { value: 'F', description: '\u5973' }\n    ]\n  }\n});\n\n// \u6216\u901a\u8fc7 Global \u7ec4\u4ef6\u914d\u7f6e\n&lt;PureGlobal preset={{\n  enums: {\n    status: async ({ language }) =&gt; {\n      // \u652f\u6301\u5f02\u6b65\u52a0\u8f7d\n      return [\n        { value: '1', description: '\u542f\u7528' },\n        { value: '0', description: '\u7981\u7528' }\n      ];\n    }\n  }\n}}&gt;\n</code></pre>\n<h3>\u679a\u4e3e\u9879\u6570\u636e\u7ed3\u6784</h3>\n<table>\n<thead>\n<tr>\n<th>\u5b57\u6bb5\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u5fc5\u586b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>value</td>\n<td>\u679a\u4e3e\u503c</td>\n<td>string | number</td>\n<td>\u662f</td>\n</tr>\n<tr>\n<td>description</td>\n<td>\u679a\u4e3e\u63cf\u8ff0\u6587\u672c</td>\n<td>string</td>\n<td>\u662f</td>\n</tr>\n<tr>\n<td>translation</td>\n<td>\u591a\u8bed\u8a00\u7ffb\u8bd1\u5bf9\u8c61</td>\n<td>object</td>\n<td>\u5426</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Enum_cf204",style:"",list:[{title:"\u57fa\u7840\u7528\u6cd5",description:"\u5c55\u793a\u679a\u4e3e\u7684\u57fa\u672c\u4f7f\u7528\uff0c\u5305\u62ec\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u503c\u548c\u679a\u4e3e\u5217\u8868",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Select, Divider } = antd;\nconst BaseExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          // \u540c\u6b65\u52a0\u8f7d\u7684\u679a\u4e3e\n          gender: [\n            { value: "M", description: "\u7537" },\n            { value: "F", description: "\u5973" },\n          ],\n          // \u5f02\u6b65\u52a0\u8f7d\u7684\u679a\u4e3e\n          status: async ({ locale }) => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "1", description: "\u542f\u7528" },\n                  { value: "0", description: "\u7981\u7528" },\n                ]);\n              }, 500);\n            });\n          },\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u83b7\u53d6\u5355\u4e2a\u679a\u4e3e\u503c</h4>\n          <Space>\n            <span>\u6027\u522b\uff1a</span>\n            <Enum moduleName="gender" name="M" />\n            <Divider type="vertical" />\n            <span>\u81ea\u5b9a\u4e49\u6e32\u67d3\uff1a</span>\n            <Enum moduleName="gender" name="F">\n              {(data) => <strong style={{ color: "#f5222d" }}>{data.description}</strong>}\n            </Enum>\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u83b7\u53d6\u679a\u4e3e\u5217\u8868</h4>\n          <Enum moduleName="gender">\n            {(list) => {\n              return (\n                <Space>\n                  <span>\u53ef\u9009\u9879\uff1a</span>\n                  {list.map((item, index) => (\n                    <span key={item.value}>\n                      {item.description}\n                      {index < list.length - 1 && "\u3001"}\n                    </span>\n                  ))}\n                </Space>\n              );\n            }}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a\u4e0b\u62c9\u6846</h4>\n          <Enum moduleName="status">\n            {(list) => {\n              return (\n                <Select\n                  style={{ width: 150 }}\n                  placeholder="\u8bf7\u9009\u62e9\u72b6\u6001"\n                  options={list.map((item) => ({\n                    value: item.value,\n                    label: item.description,\n                  }))}\n                />\n              );\n            }}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u5360\u4f4d\u7b26\u548c\u52a0\u8f7d\u72b6\u6001</h4>\n          <Space>\n            <span>\u72b6\u6001\uff1a</span>\n            <Enum \n              moduleName="status" \n              name="1"\n              placeholder="\u52a0\u8f7d\u4e2d..."\n            />\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u4f7f\u7528format="option"\u76f4\u63a5\u83b7\u53d6\u9009\u9879\u683c\u5f0f</h4>\n          <Enum moduleName="gender" format="option">\n            {(list) => (\n              <Select\n                style={{ width: 150 }}\n                placeholder="\u8bf7\u9009\u62e9\u6027\u522b"\n                options={list}\n              />\n            )}\n          </Enum>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u5f02\u6b65\u52a0\u8f7d\u4e0e\u7f13\u5b58",description:"\u5c55\u793a\u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\u6570\u636e\u3001Loading\u72b6\u6001\u548c\u5f3a\u5236\u5237\u65b0\u7f13\u5b58",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Button, message } = antd;\nconst { useState } = React;\n\nconst AsyncEnumExample = () => {\n  const [refreshKey, setRefreshKey] = useState(0);\n  \n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          // \u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\u6570\u636e\n          userStatus: async ({ language }) => {\n            // \u6a21\u62df\u4ece\u670d\u52a1\u5668\u83b7\u53d6\u6570\u636e\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: "active", description: "\u6d3b\u8dc3" },\n                  { value: "inactive", description: "\u975e\u6d3b\u8dc3" },\n                  { value: "pending", description: "\u5f85\u5ba1\u6838" },\n                  { value: "banned", description: "\u5df2\u7981\u7528" },\n                ]);\n              }, 1500);\n            });\n          },\n          // \u540c\u6b65\u679a\u4e3e\u6570\u636e\n          priority: [\n            { value: "low", description: "\u4f4e\u4f18\u5148\u7ea7" },\n            { value: "medium", description: "\u4e2d\u4f18\u5148\u7ea7" },\n            { value: "high", description: "\u9ad8\u4f18\u5148\u7ea7" },\n            { value: "urgent", description: "\u7d27\u6025" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u5f02\u6b65\u52a0\u8f7d\u679a\u4e3e\uff08\u5e26Loading\u72b6\u6001\uff09</h4>\n          <Enum \n            key={refreshKey}\n            moduleName="userStatus" \n            name="active"\n            loading={<span>\u6b63\u5728\u52a0\u8f7d\u7528\u6237\u72b6\u6001...</span>}\n            placeholder="--"\n          >\n            {(data) => <div>\u5f53\u524d\u72b6\u6001\uff1a{data.description}</div>}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u5f3a\u5236\u5237\u65b0\u7f13\u5b58</h4>\n          <Space>\n            <Enum \n              moduleName="userStatus" \n              name="banned"\n              force={refreshKey > 0}\n            >\n              {(data) => data.description}\n            </Enum>\n            <Button \n              onClick={() => {\n                setRefreshKey(prev => prev + 1);\n                message.info("\u5df2\u5237\u65b0\u7f13\u5b58");\n              }}\n            >\n              \u5237\u65b0\u7f13\u5b58\n            </Button>\n          </Space>\n        </div>\n        \n        <div>\n          <h4>\u540c\u6b65\u679a\u4e3e\u6570\u636e\uff08\u7acb\u5373\u663e\u793a\uff09</h4>\n          <Space>\n            <Enum moduleName="priority" name="high" />\n            <Enum moduleName="priority" name="urgent">\n              {(data) => <span style={{ color: "red" }}>{data.description}</span>}\n            </Enum>\n          </Space>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<AsyncEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u683c\u5f0f\u5316\u65b9\u5f0f",description:"\u5c55\u793a\u4e0d\u540c\u7684\u683c\u5f0f\u5316\u65b9\u5f0f\u548c\u81ea\u5b9a\u4e49\u6e32\u67d3",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Divider, Card } = antd;\n\nconst FormatEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          orderStatus: [\n            { value: "created", description: "\u5df2\u521b\u5efa", color: "#666" },\n            { value: "paid", description: "\u5df2\u652f\u4ed8", color: "#1890ff" },\n            { value: "shipped", description: "\u5df2\u53d1\u8d27", color: "#52c41a" },\n            { value: "completed", description: "\u5df2\u5b8c\u6210", color: "#52c41a" },\n            { value: "cancelled", description: "\u5df2\u53d6\u6d88", color: "#f5222d" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <Card title="\u4e0d\u540c\u683c\u5f0f\u5316\u65b9\u5f0f" size="small">\n          <Space direction="vertical">\n            <div>\n              <strong>\u9ed8\u8ba4\u683c\u5f0f\uff08format="default"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="default" />\n            </div>\n            \n            <Divider />\n            \n            <div>\n              <strong>\u539f\u59cb\u5bf9\u8c61\uff08format="origin"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="origin">\n                {(data) => (\n                  <pre>{JSON.stringify(data, null, 2)}</pre>\n                )}\n              </Enum>\n            </div>\n            \n            <Divider />\n            \n            <div>\n              <strong>\u9009\u9879\u683c\u5f0f\uff08format="option"\uff09\uff1a</strong>\n              <Enum moduleName="orderStatus" name="paid" format="option">\n                {(data) => (\n                  <span>label: {data.label}, value: {data.value}</span>\n                )}\n              </Enum>\n            </div>\n          </Space>\n        </Card>\n        \n        <Card title="\u81ea\u5b9a\u4e49\u6e32\u67d3" size="small">\n          <Space>\n            <Enum moduleName="orderStatus" name="shipped" format="origin">\n              {(data) => (\n                <span style={{ color: data.color }}>\n                  \u25cf {data.description}\n                </span>\n              )}\n            </Enum>\n            \n            <Enum moduleName="orderStatus" name="cancelled" format="origin">\n              {(data) => (\n                <span style={{ \n                  padding: "2px 8px",\n                  backgroundColor: data.color,\n                  color: "#fff",\n                  borderRadius: "4px"\n                }}>\n                  {data.description}\n                </span>\n              )}\n            </Enum>\n          </Space>\n        </Card>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<FormatEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u6e32\u67d3\u679a\u4e3e\u5217\u8868",description:"\u5c06\u679a\u4e3e\u5217\u8868\u6e32\u67d3\u4e3a\u5404\u79cd\u8868\u5355\u7ec4\u4ef6",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Select, Radio, Checkbox, Table } = antd;\n\nconst ListEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          department: [\n            { value: "tech", description: "\u6280\u672f\u90e8" },\n            { value: "product", description: "\u4ea7\u54c1\u90e8" },\n            { value: "design", description: "\u8bbe\u8ba1\u90e8" },\n            { value: "marketing", description: "\u5e02\u573a\u90e8" },\n            { value: "hr", description: "\u4eba\u529b\u8d44\u6e90\u90e8" },\n            { value: "finance", description: "\u8d22\u52a1\u90e8" },\n          ],\n          role: [\n            { value: "admin", description: "\u7ba1\u7406\u5458", level: 1 },\n            { value: "manager", description: "\u7ecf\u7406", level: 2 },\n            { value: "employee", description: "\u5458\u5de5", level: 3 },\n            { value: "intern", description: "\u5b9e\u4e60\u751f", level: 4 },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <div>\n          <h4>\u6e32\u67d3\u4e3a Select \u4e0b\u62c9\u6846</h4>\n          <Enum moduleName="department">\n            {(list) => (\n              <Select\n                style={{ width: 200 }}\n                placeholder="\u8bf7\u9009\u62e9\u90e8\u95e8"\n                options={list.map((item) => ({\n                  value: item.value,\n                  label: item.description,\n                }))}\n              />\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Radio \u5355\u9009\u7ec4</h4>\n          <Enum moduleName="role">\n            {(list) => (\n              <Radio.Group>\n                {list.map((item) => (\n                  <Radio key={item.value} value={item.value}>\n                    {item.description}\n                  </Radio>\n                ))}\n              </Radio.Group>\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Checkbox \u591a\u9009\u7ec4</h4>\n          <Enum moduleName="department">\n            {(list) => (\n              <Checkbox.Group>\n                {list.slice(0, 4).map((item) => (\n                  <Checkbox key={item.value} value={item.value}>\n                    {item.description}\n                  </Checkbox>\n                ))}\n              </Checkbox.Group>\n            )}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>\u6e32\u67d3\u4e3a Table \u8868\u683c</h4>\n          <Enum moduleName="role" format="origin">\n            {(list) => (\n              <Table\n                size="small"\n                pagination={false}\n                columns={[\n                  { title: "\u7f16\u7801", dataIndex: "value", key: "value" },\n                  { title: "\u540d\u79f0", dataIndex: "description", key: "description" },\n                  { title: "\u7ea7\u522b", dataIndex: "level", key: "level" },\n                ]}\n                dataSource={list.map(item => ({ ...item, key: item.value }))}\n              />\n            )}\n          </Enum>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<ListEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]},{title:"\u591a\u679a\u4e3e\u6a21\u5757",description:"\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e\u6a21\u5757\u548c\u9519\u8bef\u5904\u7406",code:'const { default: Enum } = _Enum;\nconst { PureGlobal } = global;\nconst { Space, Card, Tag } = antd;\n\nconst MultiEnumExample = () => {\n  return (\n    <PureGlobal\n      preset={{\n        locale: "zh-CN",\n        enums: {\n          country: [\n            { value: "CN", description: "\u4e2d\u56fd" },\n            { value: "US", description: "\u7f8e\u56fd" },\n            { value: "UK", description: "\u82f1\u56fd" },\n            { value: "JP", description: "\u65e5\u672c" },\n          ],\n          language: [\n            { value: "zh-CN", description: "\u7b80\u4f53\u4e2d\u6587" },\n            { value: "en-US", description: "\u82f1\u8bed" },\n            { value: "ja-JP", description: "\u65e5\u8bed" },\n            { value: "ko-KR", description: "\u97e9\u8bed" },\n          ],\n          timezone: [\n            { value: "UTC+8", description: "\u5317\u4eac\u65f6\u95f4" },\n            { value: "UTC+0", description: "\u683c\u6797\u5a01\u6cbb\u65f6\u95f4" },\n            { value: "UTC-5", description: "\u7ebd\u7ea6\u65f6\u95f4" },\n            { value: "UTC+9", description: "\u4e1c\u4eac\u65f6\u95f4" },\n          ],\n        },\n      }}\n    >\n      <Space direction="vertical" size="large" style={{ width: "100%" }}>\n        <Card title="\u540c\u65f6\u83b7\u53d6\u591a\u4e2a\u679a\u4e3e\u6a21\u5757" size="small">\n          <Enum moduleName={["country", "language", "timezone"]}>\n            {([countries, languages, timezones]) => (\n              <Space direction="vertical">\n                <div>\n                  <strong>\u56fd\u5bb6\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {countries.map(item => (\n                      <Tag key={item.value}>{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n                <div>\n                  <strong>\u8bed\u8a00\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {languages.map(item => (\n                      <Tag key={item.value} color="blue">{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n                <div>\n                  <strong>\u65f6\u533a\u5217\u8868\uff1a</strong>\n                  <Space>\n                    {timezones.map(item => (\n                      <Tag key={item.value} color="green">{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n              </Space>\n            )}\n          </Enum>\n        </Card>\n        \n        <Card title="\u7ec4\u5408\u4f7f\u7528\u591a\u4e2a\u679a\u4e3e" size="small">\n          <Space>\n            <span>\u7528\u6237\u6765\u81ea</span>\n            <Enum moduleName="country" name="CN">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>\uff0c\u4f7f\u7528</span>\n            <Enum moduleName="language" name="zh-CN">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>\uff0c\u65f6\u533a\u4e3a</span>\n            <Enum moduleName="timezone" name="UTC+8">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n          </Space>\n        </Card>\n        \n        <Card title="\u9519\u8bef\u5904\u7406" size="small">\n          <Space direction="vertical">\n            <div>\n              <strong>\u4e0d\u5b58\u5728\u7684\u679a\u4e3e\u6a21\u5757\uff1a</strong>\n              <Enum \n                moduleName="notExist" \n                name="test"\n                error={<span style={{ color: "red" }}>\u679a\u4e3e\u52a0\u8f7d\u5931\u8d25</span>}\n              />\n            </div>\n            <div>\n              <strong>\u4e0d\u5b58\u5728\u7684\u679a\u4e3e\u503c\uff08\u663e\u793a\u5360\u4f4d\u7b26\uff09\uff1a</strong>\n              <Enum \n                moduleName="country" \n                name="XX"\n                placeholder="\u672a\u77e5\u56fd\u5bb6"\n              />\n            </div>\n          </Space>\n        </Card>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<MultiEnumExample />);\n\n',scope:[{name:"_Enum",packageName:"@components/Enum",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:l}]}]}}},74199:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(73604),o=t(55199);const l=JSON.parse('{"id":1,"coId":1,"name":"\u6d88\u606f\u7b80\u4f53","parentId":0,"enName":"xiaoxijianti","leaf":false,"children":[{"id":428,"coId":1,"name":"a\u6d4b\u8bd5\u90e8\u95e801","parentId":1,"enName":"Test BU1","leaf":false,"children":[{"id":430,"coId":1,"name":"01\u5f00\u53d1\u90e8","parentId":428,"enName":null,"leaf":true,"children":[]},{"id":431,"coId":1,"name":"01\u6d4b\u8bd5\u90e8","parentId":428,"enName":"Test bu-01","leaf":false,"children":[{"id":432,"coId":1,"name":"01\u81ea\u52a8\u5316\u90e8","parentId":431,"enName":null,"leaf":false,"children":[{"id":434,"coId":1,"name":"02UI\u81ea\u52a8\u5316","parentId":432,"enName":null,"leaf":false,"children":[{"id":485,"coId":1,"name":"\u4ee3\u7801\u7f16\u5199\u5458","parentId":434,"enName":null,"leaf":true,"children":[]},{"id":484,"coId":1,"name":"\u81ea\u52a8\u5316\u6846\u67b6\u642d\u5efa\u5458","parentId":434,"enName":null,"leaf":true,"children":[]}]}]}]}]},{"id":429,"coId":1,"name":"a\u6d4b\u8bd5\u90e8\u95e802","parentId":1,"enName":"YYY","leaf":false,"children":[{"id":483,"coId":1,"name":"\u5f00\u53d1\u7ec4","parentId":429,"enName":null,"leaf":true,"children":[]},{"id":482,"coId":1,"name":"\u6d4b\u8bd5\u90e8","parentId":429,"enName":null,"leaf":true,"children":[]}]},{"id":184,"coId":1,"name":"\u4e0a\u6d77a","parentId":1,"enName":"shanghai","leaf":true,"children":[]},{"id":78,"coId":1,"name":"\u4e8b\u4e1a\u4e00\u90e8","parentId":1,"enName":"shiyeyibu","leaf":false,"children":[{"id":89,"coId":1,"name":"RPO-\u5e7f\u5dde","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":90,"coId":1,"name":"RPO-\u82cf\u5dde","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":83,"coId":1,"name":"\u4e0a\u6d77-\u5de5\u4e1a\u5236\u9020","parentId":78,"enName":null,"leaf":true,"children":[]},{"id":82,"coId":1,"name":"\u4e0a\u6d77-\u6570\u5b57\u79d1\u6280","parentId":78,"enName":null,"leaf":true,"children":[]}]},{"id":80,"coId":1,"name":"\u4e8b\u4e1a\u4e09\u90e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":93,"coId":1,"name":"RPO-\u5317\u4eac-\u56e2\u961f2","parentId":80,"enName":null,"leaf":true,"children":[]},{"id":92,"coId":1,"name":"\u5317\u4eac-\u9ad8\u79d1\u6280\u53ca\u4e92\u8054\u7f51","parentId":80,"enName":null,"leaf":true,"children":[]}]},{"id":79,"coId":1,"name":"\u4e8b\u4e1a\u4e8c\u90e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":88,"coId":1,"name":"PRO-\u5de5\u4e1a\u5236\u9020","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":87,"coId":1,"name":"PRO-\u751f\u547d\u79d1\u5b66-\u56e2\u961f2","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":91,"coId":1,"name":"RPO-\u5feb\u6d88\u96f6\u552e","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":86,"coId":1,"name":"RPO-\u751f\u547d\u79d1\u5b66","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":85,"coId":1,"name":"\u4e0a\u6d77-\u91d1\u878d","parentId":79,"enName":null,"leaf":true,"children":[]},{"id":84,"coId":1,"name":"\u4e0a\u6d77-\u96f6\u552e","parentId":79,"enName":null,"leaf":true,"children":[]}]},{"id":173,"coId":1,"name":"\u5ba1\u6279\u6d41\u90e8\u95e8","parentId":1,"enName":null,"leaf":false,"children":[{"id":176,"coId":1,"name":"GM","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":175,"coId":1,"name":"VP","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":174,"coId":1,"name":"\u51fa\u7eb3","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":180,"coId":1,"name":"\u6284\u9001\u4eba","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":178,"coId":1,"name":"\u6cd5\u52a1","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":177,"coId":1,"name":"\u8d22\u52a1\u5206\u6790","parentId":173,"enName":null,"leaf":true,"children":[]},{"id":179,"coId":1,"name":"\u9ed8\u8ba4\u5ba1\u6279\u4eba","parentId":173,"enName":null,"leaf":true,"children":[]}]},{"id":81,"coId":1,"name":"\u6570\u5b57\u5316\u56e2\u961f","parentId":1,"enName":"Shu Zi-Hua","leaf":false,"children":[{"id":201,"coId":1,"name":"\u6d4b\u8bd5\u56e2\u961f","parentId":81,"enName":"ceshi---","leaf":true,"children":[]}]},{"id":103,"coId":1,"name":"\u661f\u8fb0\u6c34","parentId":1,"enName":null,"leaf":false,"children":[{"id":106,"coId":1,"name":"\u661f\u8fb0\u4e00\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":111,"coId":1,"name":"\u661f\u8fb0\u4e09\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":107,"coId":1,"name":"\u661f\u8fb0\u4e8c\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]},{"id":151,"coId":1,"name":"\u661f\u8fb0\u56db\u90e8","parentId":103,"enName":null,"leaf":true,"children":[]}]},{"id":101,"coId":1,"name":"\u667a\u6167\u661f","parentId":1,"enName":null,"leaf":false,"children":[{"id":104,"coId":1,"name":"\u667a\u6167\u4e00\u90e8","parentId":101,"enName":null,"leaf":false,"children":[{"id":150,"coId":1,"name":"\u667a\u6167\u4e00\u90e8-\u6708\u4eae\u661f","parentId":104,"enName":null,"leaf":true,"children":[]}]},{"id":109,"coId":1,"name":"\u667a\u6167\u4e09\u90e8","parentId":101,"enName":null,"leaf":true,"children":[]},{"id":105,"coId":1,"name":"\u667a\u6167\u4e8c\u90e8","parentId":101,"enName":null,"leaf":true,"children":[]}]},{"id":182,"coId":1,"name":"\u667a\u80fd\u540e\u53f0\uff08\u4e0a\u6d77\uff09","parentId":1,"enName":null,"leaf":true,"children":[]},{"id":181,"coId":1,"name":"\u7ba1\u7406\u4e2d\u5fc3","parentId":1,"enName":null,"leaf":true,"children":[]},{"id":194,"coId":1,"name":"\u81ea\u52a8\u5316\u90e8\u95e8","parentId":1,"enName":null,"leaf":true,"children":[]}]}');const d={name:"Filter",summary:"",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"Filter_d7778",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {\n  default: Filter,\n  InputFilterItem,\n  DatePickerFilterItem,\n  DateRangePickerFilterItem,\n  TypeDateRangePickerFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  SuperSelectFilterItem,\n  SuperSelectUserFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  getFilterValue,\n  FilterItemContainer,\n} = _Filter;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, onChange] = useState([]);\n  return (\n    <Filter\n      value={value}\n      onChange={(value) => {\n        console.log(getFilterValue(value));\n        onChange(value);\n      }}\n      extra={<Filter.SearchInput name="name" label="\u59d3\u540d" />}\n      list={[\n        [\n          <InputFilterItem label="\u6587\u5b57" name="text" />,\n          <CityFilterItem label="\u57ce\u5e02" name="city" />,\n          <FilterItemContainer name="select" label="\u9ad8\u7ea7\u9009\u62e9">\n            {(props) => (\n              <div>\n                <AdvancedSelectFilterItem\n                  {...props}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: "\u7b2c\u4e00\u9879", value: 1 },\n                          {\n                            label: "\u7b2c\u4e8c\u9879",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: "\u7b2c\u4e09\u9879",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />\n              </div>\n            )}\n          </FilterItemContainer>,\n          <DatePickerFilterItem label="\u65e5\u671f" name="date" picker="week" />,\n          <TypeDateRangePickerFilterItem\n            label="\u590d\u6742\u65e5\u671f\u8303\u56f4"\n            name="type-data-range"\n            allowEmpty={[true, true]}\n          />,\n          <DateRangePickerFilterItem label="\u65e5\u671f\u8303\u56f4" name="date-range" />,\n          <SuperSelectFilterItem\n            label="\u9009\u62e9\u4fe1\u606f"\n            name="select-value"\n            options={[\n              {\n                label: "\u7528\u6237\u4e00",\n                value: 1,\n                description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n              },\n              {\n                label: "\u7528\u6237\u4e8c",\n                value: 2,\n                description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n              },\n            ]}\n          />,\n          <SuperSelectUserFilterItem\n            label="\u7528\u6237\u9009\u62e9"\n            name="user"\n            api={{\n              loader: () => {\n                return {\n                  pageData: [\n                    {\n                      label: "\u7528\u6237\u4e00",\n                      value: 1,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                    {\n                      label: "\u7528\u6237\u4e8c",\n                      value: 2,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                    {\n                      label: "\u7528\u6237\u4e09",\n                      value: 3,\n                      description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                    },\n                  ],\n                };\n              },\n            }}\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="functionLast"\n            onlyAllowLastLevel\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="function"\n            selectLevel={3}\n            maxLength={3}\n          />,\n          <FunctionSelectFilterItem\n            label="\u804c\u80fd\u9009\u62e9"\n            name="functionSingle"\n            single\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industryLast"\n            onlyAllowLastLevel\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industry"\n            selectLevel={2}\n            maxLength={3}\n          />,\n          <IndustrySelectFilterItem\n            label="\u884c\u4e1a\u9009\u62e9"\n            name="industrySingle"\n            single\n          />,\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a}]},{title:"\u9ad8\u7ea7\u7b5b\u9009",description:"\u9ad8\u7ea7\u7b5b\u9009",code:'const {\n  default: Filter,\n  AdvancedFilter,\n  InputFilterItem,\n  DatePickerFilterItem,\n  DateRangePickerFilterItem,\n  TypeDateRangePickerFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n  NumberRangeFilterItem,\n  getFilterValue,\n  FilterItemContainer,\n} = _Filter;\nconst { useState } = React;\n\nconst {\n  CityFilterItem: CityAdvancedFilterItem,\n  ListFilterItem,\n  InputFilterItem: InputAdvancedFilterItem,\n} = AdvancedFilter.fields;\nconst BaseExample = () => {\n  const [value, onChange] = useState([]);\n  return (\n    <AdvancedFilter\n      value={value}\n      onChange={(value) => {\n        console.log(getFilterValue(value));\n        onChange(value);\n      }}\n      list={[\n        [<CityAdvancedFilterItem name="currentCity" label="\u5f53\u524d\u57ce\u5e02" single />],\n        [<CityAdvancedFilterItem name="expectCity" label="\u671f\u671b\u57ce\u5e02" />],\n        [\n          <ListFilterItem\n            name="experience"\n            label="\u5de5\u4f5c\u7ecf\u9a8c"\n            single\n            items={[\n              {\n                value: [null, 1],\n                label: "1\u5e74\u4ee5\u4e0b",\n              },\n              {\n                value: [1, 5],\n                label: "1-5\u5e74",\n              },\n              { value: [5, null], label: "5\u5e74\u4ee5\u4e0a" },\n            ]}\n            custom={<NumberRangeFilterItem label="\u81ea\u5b9a\u4e49" unit="\u5e74" />}\n          />,\n        ],\n        [<InputAdvancedFilterItem name="company" label="\u516c\u53f8" />],\n      ]}\n      more={[\n        <InputFilterItem label="\u6587\u5b57" name="text" />,\n        <CityFilterItem label="\u57ce\u5e02" name="city" />,\n        <FilterItemContainer name="select" label="\u9ad8\u7ea7\u9009\u62e9">\n          {(props) => (\n            <div>\n              <AdvancedSelectFilterItem\n                {...props}\n                api={{\n                  loader: () => {\n                    return {\n                      pageData: [\n                        { label: "\u7b2c\u4e00\u9879", value: 1 },\n                        {\n                          label: "\u7b2c\u4e8c\u9879",\n                          value: 2,\n                          disabled: true,\n                        },\n                        {\n                          label: "\u7b2c\u4e09\u9879",\n                          value: 3,\n                        },\n                      ],\n                    };\n                  },\n                }}\n              />\n            </div>\n          )}\n        </FilterItemContainer>,\n        <DatePickerFilterItem label="\u65e5\u671f" name="date" picker="week" />,\n        <TypeDateRangePickerFilterItem\n          label="\u590d\u6742\u65e5\u671f\u8303\u56f4"\n          name="type-data-range"\n          allowEmpty={[true, true]}\n        />,\n        <DateRangePickerFilterItem label="\u65e5\u671f\u8303\u56f4" name="date-range" />,\n        <UserFilterItem\n          label="\u7528\u6237\u9009\u62e9"\n          name="user"\n          api={{\n            loader: () => {\n              return {\n                pageData: [\n                  {\n                    label: "\u7528\u6237\u4e00",\n                    value: 1,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                  {\n                    label: "\u7528\u6237\u4e8c",\n                    value: 2,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                  {\n                    label: "\u7528\u6237\u4e09",\n                    value: 3,\n                    description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                  },\n                ],\n              };\n            },\n          }}\n        />,\n        <FunctionSelectFilterItem\n          label="\u804c\u80fd\u9009\u62e9"\n          name="function"\n          onlyAllowLastLevel\n          single\n        />,\n        <IndustrySelectFilterItem\n          label="\u884c\u4e1a\u9009\u62e9"\n          name="industry"\n          onlyAllowLastLevel\n        />,\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Filter, TreeFilterItem } = _Filter;\nconst { default: treeData } = _data;\nconst { useState } = React;\nconst { Space } = antd;\n\nconst BaseExample = () => {\n  const [filter, setFilter] = useState([]);\n  const [filter2, setFilter2] = useState([]);\n\n  return (\n    <Space direction="vertical">\n      <Filter\n        value={filter}\n        onChange={setFilter}\n        list={[\n          [\n            <TreeFilterItem\n              name="tree"\n              single\n              label="\u6811\u7ec4\u4ef6"\n              fieldNames={{\n                title: "name",\n                key: "id",\n                children: "children",\n              }}\n              api={{\n                loader: () => {\n                  return treeData.children;\n                },\n              }}\n            />,\n          ],\n        ]}\n      />\n      <Filter\n        value={filter2}\n        onChange={setFilter2}\n        list={[\n          [\n            <TreeFilterItem\n              name="tree"\n              label="\u6811\u7ec4\u4ef6"\n              fieldNames={{\n                title: "name",\n                key: "id",\n                children: "children",\n              }}\n              api={{\n                loader: () => {\n                  return treeData.children;\n                },\n              }}\n            />,\n          ],\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a},{name:"antd",packageName:"antd",component:o},{name:"_data",packageName:"@components/Filter/doc/mock/tree-data.json",component:t.t(l,2)}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const {\n  FilterValueDisplay,\n  FilterItem,\n  FilterLines,\n  PopoverItem,\n  InputFilterItem,\n  CityFilterItem,\n  AdvancedSelectFilterItem,\n  UserFilterItem,\n  FunctionSelectFilterItem,\n  IndustrySelectFilterItem,\n} = _Filter;\nconst { Space, Input } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, setValue] = useState([\n    {\n      label: "\u57ce\u5e02",\n      name: "city",\n      value: [\n        { label: "\u4e0a\u6d77", value: "010" },\n        { label: "\u5317\u4eac", value: "020" },\n      ],\n    },\n    {\n      label: "\u804c\u80fd",\n      name: "function",\n      value: [\n        { label: "\u4ea7\u54c1\u7ecf\u7406", value: "010" },\n        { label: "\u9500\u552e", value: "020" },\n        {\n          label: "\u5ba2\u6237\u7ecf\u7406",\n          value: "030",\n        },\n      ],\n    },\n  ]);\n  return (\n    <Space direction="vertical">\n      <FilterValueDisplay value={value} onChange={setValue} />\n      <Space>\n        <FilterItem label="\u5ba2\u6237" />\n        <FilterItem label="\u5ba2\u6237" active />\n        <FilterItem label="\u5ba2\u6237" open />\n        <FilterItem label="\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f\u8d85\u957f" active open />\n      </Space>\n      <FilterLines\n        list={[\n          [\n            <FilterItem label="\u5ba2\u6237" />,\n            <FilterItem label="\u804c\u4f4d" />,\n            <FilterItem label="\u804c\u4f4d\u8d1f\u8d23\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n          [\n            <FilterItem label="\u5f00\u59cb\u65f6\u95f4" />,\n            <FilterItem label="\u7ed3\u675f\u65f6\u95f4" />,\n            <FilterItem label="\u804c\u4f4dBD\u4eba" />,\n          ],\n        ]}\n      />\n      <PopoverItem label="\u5ba2\u6237">\n        {({ value, onChange }) => (\n          <Input value={value} onChange={(e) => onChange(e.target.value)} />\n        )}\n      </PopoverItem>\n      <FilterLines\n        list={[\n          [\n            <InputFilterItem label="\u6587\u5b57" />,\n            <CityFilterItem label="\u57ce\u5e02" />,\n            <AdvancedSelectFilterItem\n              label="\u9ad8\u7ea7\u9009\u62e9"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: "\u7b2c\u4e00\u9879", value: 1 },\n                      { label: "\u7b2c\u4e8c\u9879", value: 2, disabled: true },\n                      {\n                        label: "\u7b2c\u4e09\u9879",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <UserFilterItem\n              label="\u7528\u6237\u9009\u62e9"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: "\u7528\u6237\u4e00",\n                        value: 1,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e8c",\n                        value: 2,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                      {\n                        label: "\u7528\u6237\u4e09",\n                        value: 3,\n                        description: "\u6211\u662f\u7528\u6237\u63cf\u8ff0",\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <FunctionSelectFilterItem label="\u804c\u80fd\u9009\u62e9" />,\n            <IndustrySelectFilterItem label="\u884c\u4e1a\u9009\u62e9" />,\n          ],\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Filter",packageName:"@components/Filter",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},77091:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(47338),o=t(55199);const l={name:"ConfirmButton",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u6267\u884c\u64cd\u4f5c\u524d\u786e\u8ba4\u540e\u518d\u6267\u884c</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>message</td>\n<td>\u5220\u9664\u63d0\u793a</td>\n<td>jsx</td>\n<td>\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u5220\u9664\u63d0\u793a\u6807\u9898</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isDelete</td>\n<td>\u662f\u5426\u4e3a\u5220\u9664\u64cd\u4f5c</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>onClick</td>\n<td>\u70b9\u51fb\u786e\u8ba4\u540e\u6267\u884c\u7684\u4e8b\u4ef6</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>\u70b9\u51fb\u53d6\u6d88\u540e\u6267\u884c\u7684\u4e8b\u4ef6</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>disabled</td>\n<td>\u6309\u94ae\u662f\u5426\u7981\u7528</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showCancel</td>\n<td>\u662f\u5426\u663e\u793a\u53d6\u6d88\u6309\u94ae</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>cancelText</td>\n<td>\u53d6\u6d88\u6309\u94ae\u6587\u6848</td>\n<td>string</td>\n<td>\u53d6\u6d88</td>\n</tr>\n<tr>\n<td>okText</td>\n<td>\u786e\u8ba4\u6309\u94ae\u6587\u6848</td>\n<td>string</td>\n<td>\u786e\u8ba4</td>\n</tr>\n<tr>\n<td>isModal</td>\n<td>\u662f\u5426\u4ee5\u5f39\u7a97\u65b9\u5f0f\u5c55\u793a\uff0c\u9ed8\u8ba4\u4e3aPopconfirm</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>placement</td>\n<td>\u5f53isModal\u4e3afalse\u65f6\u751f\u6548\uff0c\u6307\u5b9aPopconfirm\u7684\u5f39\u51fa\u65b9\u5411</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getContainer</td>\n<td>\u6307\u5b9aPopconfirm\u6216Modal\u5f39\u51fa\u4f4d\u7f6e\uff0c\u4e00\u822c\u4e0d\u9700\u8981\u6307\u5b9a</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>ConfirmLink</h3>\n<p>\u53e6\u5916\u7684\u4e00\u79cd\u6309\u94ae\u5f62\u5f0f\u53c2\u6570\u540cConfirmButton</p>\n<h3>withConfirm</h3>\n<p>\u9ad8\u9636\u7ec4\u4ef6\u53ef\u4ee5\u81ea\u5b9a\u4e49\u6309\u94ae</p>",example:{isFull:!1,className:"ConfirmButton_5f815",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: ConfirmButton, ConfirmLink } = _ConfirmButton;\nconst { Space } = antd;\nconst { PureGlobal } = global;\nconst BaseExample = () => {\n  return (\n    <Space direction={"vertical"}>\n      <Space>\n        <ConfirmButton\n          isDelete={false}\n          message="\u786e\u5b9a\u8981\u5220\u9664\u5417"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          isDelete={false}\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-\u6c14\u6ce1-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-\u6c14\u6ce1-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          isDelete={false}\n          message="\u786e\u5b9a\u63d0\u4ea4XX\u5417\uff1f"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-modal-\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u8b66\u544a-modal-\u6b63\u6587\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          title="\u786e\u5b9a\u63d0\u4ea4XX\u5417\uff1f"\n          isDelete={false}\n          message="\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e\u8fd9\u91cc\u663e\u793a\u8be6\u60c5\u8bf4\u660e"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u975e\u8b66\u544a-modal-\u6807\u9898\u6b63\u6587\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          title="\u786e\u5b9a\u8981\u5220\u9664\u5417\uff1f"\n          message="\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664\u786e\u5b9a\u8981\u5220\u9664"\n          onClick={() => {\n            console.log("\u6267\u884c\u5220\u9664");\n          }}\n        >\n          \u6709title\u7684Modal\u786e\u8ba4\u5220\u9664\n        </ConfirmButton>\n      </Space>\n      <ConfirmLink\n        onClick={() => {\n          console.log("\u6267\u884c\u5220\u9664");\n        }}\n      >\n        Link-\u8b66\u544a-\u6c14\u6ce1-\u6b63\u6587\n      </ConfirmLink>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n',scope:[{name:"_ConfirmButton",packageName:"@components/ConfirmButton",component:a},{name:"antd",packageName:"antd",component:o},{name:"global",packageName:"@components/Global",component:t(63743)}]}]}}},82723:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.Content});var a=t(87923)},85772:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(40438),o=t(63743),l=t(55199);const d={name:"Image",summary:"<p>\u7528\u4e8e\u5c55\u793a\u4e00\u5f20\u56fe\u7247\uff0c\u548cimg\u6807\u7b7e\u4e0d\u540c\u7684\u662f\uff0c\u53ef\u4ee5\u5c55\u793a\u4e00\u5f20\u666e\u901a\u56fe\u7247\uff0c\u4e5f\u53ef\u4ee5\u901a\u8fc7id\u52a0\u8f7d\u4e00\u5f20oss\u56fe\u7247\uff0c\u5728\u52a0\u8f7doss\u5730\u5740\u548c\u56fe\u7247\u6570\u636e\u7684\u65f6\u5019\u4f1a\u663e\u793aloading\u72b6\u6001</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>src</td>\n<td>\u56fe\u7247\u7684src\u5730\u5740</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>oss\u7684id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>\u52a0\u8f7d\u65f6\u663e\u793a\u7684\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>\u52a0\u8f7d\u9519\u8bef\u65f6\u663e\u793a\u7684\u7ec4\u4ef6</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Image.Avatar</h3>\n<p>\u7528antd\u7684Avatar\u6765\u663e\u793a\u56fe\u7247\uff0c\u53ef\u4ee5\u663e\u793a\u9ed8\u8ba4\u7684\u7537\u5973\u5934\u50cf\uff0c\u5176\u4ed6\u53c2\u6570\u53c2\u8003antd\u7684Avatar\u7ec4\u4ef6</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>gender</td>\n<td>\u6027\u522b F\uff0cfemale\uff0cf\u4e3a\u5973\u5176\u4ed6\u4e3a\u7537</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Image_be53a",style:"",list:[{title:"\u901a\u8fc7src\u52a0\u8f7d\u4e00\u4e2a\u666e\u901a\u56fe\u7247",description:"\u901a\u8fc7src\u52a0\u8f7d\u4e00\u4e2a\u666e\u901a\u56fe\u7247",code:"const {default: Image} = _Image;\nconst BaseExample = () => {\n    return <Image src={window.PUBLIC_URL + \"/logo512.png\"} style={{width: '100px', height: '100px'}}/>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Image",packageName:"@components/Image",component:a}]},{title:"\u901a\u8fc7id\u52a0\u8f7d\u4e00\u4e2aoss\u56fe\u7247",description:"\u56fe\u7247\u4e00\u52a0\u8f7d\u6210\u529f\uff0c\u56fe\u7247\u4e8c\u52a0\u8f7d\u4e2d\uff0c\u56fe\u7247\u4e09\u52a0\u8f7d\u5931\u8d25",code:"const {default: Image} = _Image;\nconst {PureGlobal} = global;\nconst {Space} = antd;\nconst BaseExample = () => {\n    return <PureGlobal preset={{\n        apis: {\n            file: {\n                getUrl: {\n                    loader: ({params}) => {\n                        if (params.id === 'logo513.png') {\n                            return new Promise(() => {\n\n                            });\n                        }\n                        return new Promise((resolve) => {\n                            resolve(window.PUBLIC_URL + '/' + params.id);\n                        });\n\n                    }\n                }\n            }\n        }\n    }}>\n        <Space>\n            <Image id=\"logo512.png\" style={{width: '100px', height: '100px'}}/>\n            <Image id=\"logo513.png\" style={{width: '100px', height: '100px'}}/>\n            <Image id=\"logo511.png\" style={{width: '100px', height: '100px'}}/>\n        </Space>\n    </PureGlobal>;\n};\n\nrender(<BaseExample/>);\n\n",scope:[{name:"_Image",packageName:"@components/Image",component:a},{name:"global",packageName:"@components/Global",component:o},{name:"antd",packageName:"antd",component:l}]},{title:"\u663e\u793a\u4e00\u4e2a\u5934\u50cf",description:"\u663e\u793a\u56fe\u7247\u5934\u50cf\u548c\u9ed8\u8ba4\u5934\u50cf",code:'const { default: Image } = _Image;\nconst { Space } = antd;\nconst BaseExample = () => {\n  return (\n    <Space>\n      <Image.Avatar src={window.PUBLIC_URL + "/avatar.png"} shape="circle" />\n      <Image.Avatar\n        src={window.PUBLIC_URL + "/avatar.png"}\n        shape="circle"\n        size={80}\n      />\n      <Image.Avatar\n        src={window.PUBLIC_URL + "/avatar.png"}\n        shape="circle"\n        size={50}\n      />\n\n      <Image.Avatar shape="circle" />\n      <Image.Avatar gender="M" shape="circle" size={80} />\n      <Image.Avatar gender="female" shape="circle" size={50} />\n      <Image.Avatar gender="m" shape="circle" size={50} />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Image",packageName:"@components/Image",component:a},{name:"antd",packageName:"antd",component:l}]}]}}},86454:(n,e,t)=>{t.r(e),t.d(e,{default:()=>a.FetchButton});t(9056);var a=t(61186)},89896:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(63743),o=t(55199),l=t(64671);const d={name:"Global",summary:"<h3>\u4f55\u65f6\u4f7f\u7528</h3>\n<p>\u5728\u4f7f\u7528components-core\u7684\u4efb\u4f55\u7ec4\u4ef6\u7684\u4e1a\u52a1\u7cfb\u7edf\uff0c\u9700\u8981\u5c06\u8be5\u7ec4\u4ef6\u653e\u7f6e\u4e8e\u6700\u5916\u5c42\uff0c\u5e76\u4e14\u6309\u7167\u8981\u6c42\u6b63\u786e\u8bbe\u7f6epreset\u3002</p>\n<p>\u4ee5\u4e0b\u662fcomponents-core\u7ec4\u4ef6\u7cfb\u7edf\u4e2d\u9700\u8981\u8bbe\u7f6e\u7684preset\u503c\uff0c\u53ca\u4f7f\u7528\u8fd9\u4e9b\u503c\u7684\u7ec4\u4ef6</p>\n<table>\n<thead>\n<tr>\n<th>\u540d\u79f0</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u4f7f\u7528\u7ec4\u4ef6</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>\u914d\u7f6e\u529f\u80fd\u6743\u9650\u5217\u8868\uff0cPermissions\u6839\u636e\u8be5\u5217\u8868\u91cc\u9762\u662f\u5426\u5b58\u5728\u67d0\u6743\u9650\u540d\u79f0\u5224\u65ad\u7528\u6237\u662f\u5426\u5177\u6709\u8be5\u529f\u80fd\u6743\u9650\uff0c\u6765\u63a7\u5236\u5bf9\u5e94\u64cd\u4f5c\u884c\u4e3a</td>\n<td>array</td>\n<td>Permissions</td>\n</tr>\n<tr>\n<td>ajax</td>\n<td>\u7528\u4e8e\u53d1\u9001ajax\u8bf7\u6c42\u7684\u65b9\u6cd5\uff0c\u4e00\u822c\u60c5\u51b5\u4e0b\u5176\u5e94\u8be5\u662f\u4e00\u4e2aaxios\u5bf9\u8c61</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>\u7528\u4e8e\u548c\u540e\u7aef\u8fdb\u884c\u4e00\u4e9b\u4ea4\u4e92\u884c\u4e3a\u7684\u63a5\u53e3\u96c6\u5408</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.oss</td>\n<td>\u7528\u4e8e\u901a\u8fc7\u4e00\u4e2aossId\u5411\u540e\u7aefoss\u670d\u52a1\u83b7\u53d6\u4e00\u4e2a\u53ef\u4ee5\u8bbf\u95ee\u5230\u6307\u5b9a\u6587\u4ef6\u7684url</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.ossUpload</td>\n<td>\u7528\u4e8e\u5411oss\u670d\u52a1\u4e0a\u4f20\u4e00\u4e2a\u6587\u4ef6</td>\n<td>object</td>\n<td>FormInfo.Upload,FormInfo.Avatar</td>\n</tr>\n<tr>\n<td>features</td>\n<td>\u7528\u4e8e\u914d\u7f6e\u7cfb\u7edf\u7684\u7279\u6027\u53c2\u6570</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.profile</td>\n<td>\u7cfb\u7edf\u7684\u7279\u6027\u5217\u8868\u53c2\u8003\u7ec4\u4ef6Features</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.debug</td>\n<td>\u7279\u6027\u7684\u8c03\u8bd5\u6a21\u5f0f\uff0c\u53ef\u4ee5\u5728\u63a7\u5236\u53f0\u6253\u5370Features\u7684id\u548c\u72b6\u6001</td>\n<td>boolean</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>enums</td>\n<td>\u516c\u5171\u679a\u4e3e\u503c\uff0c\u8be6\u60c5\u53c2\u770bEnum\u7ec4\u4ef6</td>\n<td>object</td>\n<td>Enum</td>\n</tr>\n<tr>\n<td>enums.helperGuide</td>\n<td>\u5e2e\u52a9\u6587\u6863\u679a\u4e3e\u914d\u7f6e</td>\n<td>function</td>\n<td>HelperGuide</td>\n</tr>\n<tr>\n<td>formInfo</td>\n<td>\u8868\u5355\u914d\u7f6e</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n<tr>\n<td>formInfo.rules</td>\n<td>\u8868\u5355\u89c4\u5219\u914d\u7f6e</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n</tbody>\n</table>\n<p>\u5168\u5c40context\u7ba1\u7406\u8bbe\u7f6e\u53ca\u9ed8\u8ba4\u6837\u5f0f</p>\n<ul>\n<li>\u8bf7\u5c06\u5168\u5c40\u8986\u76d6\u6027\u7684\u6837\u5f0f\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8bf7\u5c06\u5b57\u4f53\u6587\u4ef6\u7684\u5f15\u7528\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8bf7\u5c06antd\u7684\u8986\u76d6\u6027\u6837\u5f0f\u653e\u5728\u6b64\u7ec4\u4ef6\u4e2d</li>\n<li>\u8be5\u7ec4\u4ef6\u9700\u8981\u653e\u7f6e\u5728\u5e94\u7528\u6839\u4f4d\u7f6e</li>\n</ul>\n<p>\u66f4\u65b0\u5b57\u4f53\u6587\u4ef6:</p>\n<ul>\n<li>\u5c06iconfont\u4e0a\u4e0b\u8f7d\u7684\u5b57\u4f53\u5305\u89e3\u538b\u540e\u653e\u5728public\u6587\u4ef6\u5939\u4e0b\u9762</li>\n<li>\u66f4\u65b0src/common/params.js \u4e2d\u7684\u53d8\u91cf iconfontBase</li>\n<li>\u4fee\u6539\u540e\u6784\u5efa\u8be5\u9879\u76ee\u53d1\u5e03\u5230\u5bf9\u5e94\u73af\u5883</li>\n</ul>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>preset</td>\n<td>\u5168\u5c40\u9884\u8bbe\u53c2\u6570\uff0c\u53ef\u4ee5\u901a\u8fc7usePreset\u83b7\u53d6\uff0c\u7531\u4e1a\u52a1\u7cfb\u7edf\u8bbe\u7f6e</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>themeToken</td>\n<td>\u8bbe\u7f6e\u4e3b\u9898\uff0c\u53c2\u770bantd\u7684themeToken\uff0c\u4e00\u822c\u53ea\u9700\u8981\u8bbe\u7f6e{colorPrimary}</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>init</td>\n<td>\u521d\u59cb\u5316\u65b9\u6cd5\uff0c\u5728\u7cfb\u7edf\u9996\u6b21\u52a0\u8f7d\u65f6\u6267\u884c\uff0c\u53ef\u4ee5\u8fd4\u56dePromise\u3002\u7528\u6765\u653e\u7f6e\u7cfb\u7edf\u663e\u793a\u4e4b\u524d\u7684\u5f02\u6b65\u64cd\u4f5c</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PureGlobal</h3>\n<p>api\u540cGlobal\uff0c\u4f46\u662f\u5c11\u4e86\u9875\u9762\u9519\u8bef\u6355\u83b7\u548cclassName:container-body\u5e26\u6765\u7684\u9ed8\u8ba4\u6700\u5c0f\u5bbd\u5ea6\u7b49\u6837\u5f0f\u8bbe\u7f6e\uff0c\u4e3b\u8981\u7528\u5728\u7ec4\u4ef6\u5e93\u7684\u6f14\u793a\u73af\u5883\u548c\u5f39\u7a97\u4e2d</p>\n<h3>usePreset</h3>\n<p>\u83b7\u53d6\u9884\u8bbe\u7684preset\uff0c\u5df2\u7ecf\u786e\u5b9a\u4e3a\u7cfb\u7edf\u9700\u8981\u4f7f\u7528\u7684key\u503c:permissions,apis,formOptions,modalOptions</p>\n<h3>useGlobalContext</h3>\n<p>\u83b7\u53d6\u548c\u8bbe\u7f6e\u5168\u5c40\u72b6\u6001\uff0c\u8be5\u72b6\u6001\u4fdd\u5b58\u5728Global\u7ec4\u4ef6\u4e00\u7ea7\uff0c\u4e0d\u4f1a\u968f\u7740\u5185\u90e8\u7ec4\u4ef6\u672c\u8eab\u7684\u9500\u6bc1\u800c\u9500\u6bc1\u3002\n\u4e3b\u8981\u7ed9\u7ec4\u4ef6\u5185\u90e8\u4f7f\u7528\uff0c\u4e1a\u52a1\u5e94\u8be5\u907f\u514d\u4f7f\u7528\u8be5api\u8bbe\u7f6e\u65b0\u7684global\u53d8\u91cf\u3002\u4e1a\u52a1\u5982\u679c\u6709\u9700\u8981\u5e94\u5f53\u81ea\u884c\u5728\u9876\u7ea7\u7ec4\u4ef6\u4e2d\u8bbe\u7f6econtext\u3002</p>\n<h4>params:useGlobalContext(globalKey)</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>globalKey</td>\n<td>\u5168\u5c40\u53c2\u6570\u7684key\uff0c\u5f53\u5b58\u5728globalKey\u65f6\uff0c\u9ed8\u8ba4\u83b7\u53d6\u548c\u8bbe\u7f6e\u90fd\u662fglobal[key]\uff0c\u5f53\u4e0d\u5b58\u5728globalKey\u83b7\u53d6\u548c\u8bbe\u7f6e\u7684\u90fd\u662fglobal\uff0c\u9664\u975e\u5b58\u5728\u591a\u4e2a\u83b7\u53d6\u548c\u8bbe\u7f6eglobal\u7684key-value\uff0c\u5426\u5219\u4e0d\u63a8\u8350\u76f4\u63a5\u4f7f\u7528\u4e0d\u5b58\u5728globalKey\u7684\u60c5\u51b5</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>return:{global,setGlobal}</h4>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>global</td>\n<td>\u5f53\u524d\u7684global\u503c</td>\n<td>any</td>\n</tr>\n<tr>\n<td>setGlobal</td>\n<td>\u8bbe\u7f6e\u5f53\u524d\u7684global\u503c</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Global_4cc66",style:".Global_4cc66 .label {\n  font-weight: bold;\n}",list:[{title:"\u57fa\u672c\u793a\u4f8b",description:"\u5c55\u793a\u4e86\u6587\u5b57\u5927\u5c0f\u989c\u8272\u884c\u9ad8\u7684\u8bbe\u7f6e",code:"const { PureGlobal } = _Global;\nconst { Space, Divider } = antd;\nconst BaseExample = () => {\n    return (\n        <PureGlobal>\n            <Space direction=\"vertical\">\n                <div className=\"label\">\u6587\u5b57\u5927\u5c0f:</div>\n                <div style={{ fontSize: 'var(--font-size-large)' }}>\u5927\u53f7\u6587\u5b57</div>\n                <div>\u9ed8\u8ba4\u5927\u5c0f\u6587\u5b57</div>\n                <div style={{ fontSize: 'var(--font-size-small)' }}>\u5c0f\u53f7\u6587\u5b57</div>\n                <Divider />\n                <div className=\"label\">\u6587\u5b57\u989c\u8272:</div>\n                <div style={{ color: 'var(--font-color)' }}>\u9ed8\u8ba4\u989c\u8272</div>\n                <div style={{ color: 'var(--font-color-grey)' }}>\u7070\u8272</div>\n                <div style={{ color: 'var(--font-color-grey-1)' }}>\u7070\u82721</div>\n                <div style={{ color: 'var(--font-color-grey-2)' }}>\u7070\u82722</div>\n                <Divider />\n                <div className=\"label\">\u884c\u9ad8:</div>\n                <div style={{ lineHeight: 'var(--line-height-large)' }}>\n                    \u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\u5bbd\u677e\u884c\u9ad8\n                </div>\n                <div>\n                    \u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\u9ed8\u8ba4\u884c\u9ad8\n                </div>\n                <div style={{ lineHeight: 'var(--line-height-small)' }}>\n                    \u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\u7d27\u51d1\u884c\u9ad8\n                </div>\n            </Space>\n        </PureGlobal>\n    );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u8b66\u544a\u63d0\u793a",description:"\u5c55\u793a\u4e86\u8b66\u544a\u63d0\u793a\u7684\u8986\u76d6\u6837\u5f0f",code:'const { PureGlobal } = _Global;\nconst { Alert, Space } = antd;\nconst { default: Icon } = icon;\n\nconst BasicExample = () => {\n  return (\n    <PureGlobal>\n      <Space direction="vertical">\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988" type="success" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e" type="info" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f" type="warning" showIcon />\n        <Alert message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988" type="error" showIcon />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          type="error"\n          showIcon\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="success"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="info"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="warning"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u64cd\u4f5c\u6210\u529f\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="success"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u666e\u901a\u7684\u4fe1\u606f\u8bf4\u660e"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="info"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u63d0\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="warning"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8bf7\u6c42\u5931\u8d25\u7684\u72b6\u6001\u53cd\u9988"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          closable\n        />\n        <Alert\n          message="\u8fd9\u662f\u4e00\u6761\u8b66\u793a\u4fe1\u606f"\n          description="\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a\u63d0\u793a"\n          type="error"\n          showIcon\n          closable\n          icon={<Icon colorful type="icon-color-caisejingshi" />}\n        />\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BasicExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o},{name:"icon",packageName:"@components/Icon",component:l}]},{title:"\u6309\u94ae",description:"\u5c55\u793a\u4e86\u6309\u94ae\u7684\u8986\u76d6\u6837\u5f0f",code:'const { PureGlobal } = _Global;\nconst { Button, Typography, Space } = antd;\nconst { default: Icon } = icon;\n\nconst BaseExample = () => {\n  return (\n    <PureGlobal>\n      <Space direction="vertical">\n        <Space>\n          <Button size="large">\u5927\u6309\u94ae</Button>\n          <Button>\u9ed8\u8ba4\u6309\u94ae</Button>\n          <Button size="small">\u5c0f\u6309\u94ae</Button>\n        </Space>\n        <Space>\n          <Button type="primary">\u6309\u94ae</Button>\n          <Button type="link">\u6309\u94ae</Button>\n          <Button type="text">\u6309\u94ae</Button>\n        </Space>\n        <Space>\n          <Button danger>\u5371\u9669\u6309\u94ae</Button>\n          <Button type="primary" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="link" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="text" danger>\n            \u5371\u9669\u6309\u94ae\n          </Button>\n        </Space>\n        <Space>\n          <Button disabled>\u7981\u7528\u6309\u94ae</Button>\n          <Button type="primary" danger disabled>\n            \u7981\u7528\u5371\u9669\u6309\u94ae\n          </Button>\n          <Button type="link" disabled>\n            \u7981\u7528Link\u6309\u94ae\n          </Button>\n          <Button type="text" disabled>\n            \u7981\u7528Text\u6309\u94ae\n          </Button>\n        </Space>\n        <Space>\n          <Button type="text" icon={<Icon type="icon-tianjia" />}>\n            \u56fe\u6807\u6309\u94ae\n          </Button>\n          <Button type="text">\n            \u56fe\u6807\u6309\u94ae\u53f3\n            <Icon type="icon-arrow-thin-down" />\n          </Button>\n        </Space>\n        <Space>\n          <Button type="primary" icon={<Icon type="icon-tianjia" />} />\n          <Button icon={<Icon type="icon-tianjia" />} />\n          <Button danger icon={<Icon type="icon-tianjia" />} />\n          <Button type="link" icon={<Icon type="icon-tianjia" />} />\n          <Button type="text" icon={<Icon type="icon-tianjia" />} />\n        </Space>\n        <Space>\n          <Button type="primary" disabled icon={<Icon type="icon-tianjia" />} />\n          <Button disabled icon={<Icon type="icon-tianjia" />} />\n          <Button disabled danger icon={<Icon type="icon-tianjia" />} />\n          <Button disabled type="link" icon={<Icon type="icon-tianjia" />} />\n          <Button disabled type="text" icon={<Icon type="icon-tianjia" />} />\n        </Space>\n        <Space>\n          <Typography.Link>Link\u6587\u5b57</Typography.Link>\n          <Typography.Text className="ant-btn">\u6587\u5b57</Typography.Text>\n          <Typography.Link>\n            <Icon type="icon-tianjia" />\n            Link\u6587\u5b57\n          </Typography.Link>\n          <Typography.Text className="ant-btn">\n            <Icon type="icon-tianjia" />\n            \u6587\u5b57\n          </Typography.Text>\n          <Typography.Link className="ant-btn-dangerous">\n            Link\u6587\u5b57\n          </Typography.Link>\n        </Space>\n        <Space>\n          <Button className="btn-no-padding" type="link" size="large">\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link">\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="small">\n            \u5c0f\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text" size="large">\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text">\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="text" size="small">\n            \u5c0f\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="large" danger>\n            \u5927\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" danger>\n            \u9ed8\u8ba4\u6309\u94ae\n          </Button>\n          <Button className="btn-no-padding" type="link" size="small" danger>\n            \u5c0f\u6309\u94ae\n          </Button>\n        </Space>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o},{name:"icon",packageName:"@components/Icon",component:l}]},{title:"\u65e0\u8fb9\u6846\u6807\u7b7e",description:"\u5c55\u793a\u4e86\u65e0\u8fb9\u6846\u6807\u7b7e",code:'const { PureGlobal } = _Global;\nconst { Tag, Space } = antd;\n\nconst BasicExample = () => {\n  return (\n    <PureGlobal>\n      <Space>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e1\n        </Tag>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e2\n        </Tag>\n        <Tag className="no-border" closable>\n          \u6807\u7b7e3\n        </Tag>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BasicExample />);\n\n',scope:[{name:"_Global",packageName:"@components/Global",component:a},{name:"antd",packageName:"antd",component:o}]}]}}},91026:(n,e,t)=>{t.d(e,{A:()=>r});var a=t(29556),o=t(8002),l=t(96252),d=t(87558);const r={name:"Tooltip",summary:"<p>\u7b80\u5355\u7684\u6587\u5b57\u63d0\u793a\u6c14\u6ce1\u6846</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>\u9ed8\u8ba4\u5bbd\u5ea6 360\uff0csmall \u5bbd\u5ea6 240</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>\u6807\u9898\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showInfo</td>\n<td>\u5c55\u793a\u6807\u9898\u65c1\u7684\u63d0\u793a\u6309\u94ae</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfo</td>\n<td>\u91cd\u8981\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>subtitle</td>\n<td>\u526f\u6807\u9898</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>\u5185\u5bb9</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfoType</td>\n<td>\u91cd\u8981\u5185\u5bb9\u7c7b\u578b\uff0csuccess,error,warning</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>moreInfo</td>\n<td>\u5176\u4ed6\u5185\u5bb9</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>TooltipFetch</h3>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>\u83b7\u53d6\u6570\u636e\u7684\u63a5\u53e3\uff0c\u53c2\u8003@kne/react-fetch</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>fetchContent</td>\n<td>\u5f53api\u63a5\u53e3\u8fd4\u56de\u503c\u7684\u65f6\u5019\u8c03\u7528\uff0c\u53ef\u4ee5\u83b7\u53d6\u5230\u63a5\u53e3\u53c2\u6570\uff0c\u8fd4\u56de\u503c\u4f1a\u66f4\u65b0\u5230Tootip\u7684\u53c2\u6570\u4e2d</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"Tooltip_c9830",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: Tooltip, TooltipInfoLabel } = _Tooltip;\nconst { default: Space } = space;\nconst {\n  default: FormInfo,\n  Form,\n  Input,\n  TypeDateRangePicker,\n  SubmitButton,\n  CancelButton,\n} = formInfo;\n\nconst MoreInfo = () => {\n  return (\n    <Form>\n      <FormInfo\n        column={1}\n        list={[\n          <Input label="\u59d3\u540d" name="name" rule="REQ" />,\n          <TypeDateRangePicker\n            name="type_date"\n            label="\u65e5\u671f\u65f6\u95f4\u6bb5"\n            rule="REQ"\n          />,\n          <Space\n            style={{\n              width: "100%",\n              justifyContent: "end",\n            }}\n          >\n            <CancelButton>\u53d6\u6d88</CancelButton>\n            <SubmitButton>\u786e\u5b9a</SubmitButton>\n          </Space>,\n        ]}\n      />\n    </Form>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <Tooltip content="\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f">\u5c0f\u6bb5\u4fe1\u606f</Tooltip>\n      <Tooltip\n        size="small"\n        content="\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\uff0c\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u5b8c\u6574\u7684\u4fe1\u606f\uff0c\u8fd9\u91cc\u663e\u793a\u5b8c\u6574\u7684\u4fe1\u606f\u3002"\n      >\n        \u5927\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip title="\u6807\u9898" content="\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u3002">\n        \u5e26\u6709\u6807\u9898\u7684\u5c0f\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip\n        title="\u6807\u9898"\n        content="\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0\u5185\u5bb9\u63cf\u8ff0"\n      >\n        \u5e26\u6709\u6807\u9898\u7684\u5927\u6bb5\u4fe1\u606f\n      </Tooltip>\n      <Tooltip\n        importantInfo="\u7b5b\u9009\u65e5\u671f\u8303\u56f4\u5185\uff0c\u804c\u4f4d\u4e0a\u5b89\u6392\u987e\u95ee\u9762\u8bd5\u7684\u5019\u9009\u4eba\u603b\u6570\u3002\u6839\u636e\u6240\u586b\u5199\u7684\u987e\u95ee\u3010\u9762\u8bd5\u9762\u8bd5\u3011\u65f6\u95f4\u6765\u8fdb\u884c\u7edf\u8ba1\uff0c\u800c\u975e\u5728\u7cfb\u7edf\u7684\u64cd\u4f5c\u65f6\u95f4\u3002"\n        subtitle="\u793a\u4f8b:"\n        content="2022.10.21\u5728\u7cfb\u7edf\u64cd\u4f5c\u987e\u95ee\u9762\u8bd5\uff0c\u4f46\u586b\u5199\u7684\u987e\u95ee\u9762\u8bd5\u65f6\u95f4\u4e3a2022.10.20\uff0c\u5219\u6570\u636e\u4f1a\u7edf\u8ba1\u57282022.10.20\uff0c\u800c\u975e2022.10.21 \u3002"\n      >\n        \u5e26\u6709\u91cd\u8981\u4fe1\u606f\n      </Tooltip>\n      <TooltipInfoLabel\n        title="\u5e26\u6709Info\u4fe1\u606f"\n        tooltipTitle={{\n          importantInfo:\n            "\u7b5b\u9009\u65e5\u671f\u8303\u56f4\u5185\uff0c\u804c\u4f4d\u4e0a\u5b89\u6392\u987e\u95ee\u9762\u8bd5\u7684\u5019\u9009\u4eba\u603b\u6570\u3002\u6839\u636e\u6240\u586b\u5199\u7684\u987e\u95ee\u3010\u9762\u8bd5\u9762\u8bd5\u3011\u65f6\u95f4\u6765\u8fdb\u884c\u7edf\u8ba1\uff0c\u800c\u975e\u5728\u7cfb\u7edf\u7684\u64cd\u4f5c\u65f6\u95f4\u3002",\n          subtitle: "\u793a\u4f8b:",\n          content:\n            "2022.10.21\u5728\u7cfb\u7edf\u64cd\u4f5c\u987e\u95ee\u9762\u8bd5\uff0c\u4f46\u586b\u5199\u7684\u987e\u95ee\u9762\u8bd5\u65f6\u95f4\u4e3a2022.10.20\uff0c\u5219\u6570\u636e\u4f1a\u7edf\u8ba1\u57282022.10.20\uff0c\u800c\u975e2022.10.21 \u3002",\n        }}\n      />\n      <Tooltip\n        trigger="click"\n        title="\u6807\u9898"\n        content="\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9\u8f85\u52a9\u4fe1\u606f\u63cf\u8ff0\u5185\u5bb9"\n        moreInfo={<MoreInfo />}\n      >\n        \u5e26\u6709\u8868\u5355\u4fe1\u606f\n      </Tooltip>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Tooltip",packageName:"@components/Tooltip",component:a},{name:"space",packageName:"antd/lib/space",component:o},{name:"formInfo",packageName:"@components/FormInfo",component:l}]},{title:"\u5e26\u6709\u8fdc\u7a0b\u6570\u636e\u52a0\u8f7d\u7684\u63d0\u793a",description:"\u5c55\u793a\u5e26\u6709\u8fdc\u7a0b\u6570\u636e\u52a0\u8f7d\u7684\u63d0\u793a",code:'const { TooltipFetch } = _Tooltip;\nconst { preset } = reactFetch;\nconst { default: Descriptions } = _Descriptions;\nconst { default: StateTag } = _StateTag;\n\npreset({\n  ajax: () => {\n    return new Promise((resolve) => {\n      setTimeout(() => {\n        resolve({\n          data: {\n            code: 0,\n            data: {\n              clientName: "\u817e\u8baf",\n              title: "\u817e\u8baf\u79d1\u6280\u516c\u53f8",\n              type: "\u589e\u503c\u7a0e\u4e13\u7528\u53d1\u7968",\n              date: "2022-08-15",\n            },\n          },\n        });\n      }, 1000);\n    });\n  },\n});\n\nconst BaseExample = () => {\n  return (\n    <TooltipFetch\n      api={{\n        url: "/api/data",\n      }}\n      size="large"\n      fetchContent={(data) => {\n        return {\n          content: (\n            <Descriptions\n              dataSource={[\n                [\n                  { label: "\u5ba2\u6237\u540d\u79f0", content: data.clientName },\n                  { label: "\u53d1\u7968\u62ac\u5934", content: data.title },\n                ],\n                [\n                  { label: "\u53d1\u7968\u7c7b\u578b", content: data.type },\n                  { label: "\u53d1\u7968\u65e5\u671f", content: data.date },\n                ],\n              ]}\n            />\n          ),\n        };\n      }}\n    >\n      <StateTag text="\u54c8\u54c8\u54c8" />\n    </TooltipFetch>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_Tooltip",packageName:"@components/Tooltip",component:a},{name:"reactFetch",packageName:"@kne/react-fetch",component:d},{name:"_Descriptions",packageName:"@components/Descriptions",component:t(5633)},{name:"_StateTag",packageName:"@components/StateTag",component:t(3874)}]}]}}},91707:(n,e,t)=>{t.d(e,{A:()=>d});var a=t(330),o=t(55199),l=t(21079);const d={name:"FlexBox",summary:"<p>\u7528\u4e8e\u6839\u636e\u76d2\u5b50\u5927\u5c0f\u54cd\u5e94\u5f0f\u5c55\u793a\u4e0d\u540c\u5217</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!0,className:"FlexBox_51df0",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: FlexBox } = _FlexBox;\nconst { Card } = antd;\nconst BaseExample = () => {\n  return (\n    <FlexBox\n      dataSource={[\n        {\n          title: "Title 1",\n        },\n        {\n          title: "Title 2",\n        },\n        {\n          title: "Title 3",\n        },\n        {\n          title: "Title 4",\n        },\n        {\n          title: "Title 5",\n        },\n        {\n          title: "Title 6",\n        },\n      ]}\n      renderItem={(item) => (\n        <FlexBox.Item>\n          <Card title={item.title}>Card content</Card>\n        </FlexBox.Item>\n      )}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_FlexBox",packageName:"@components/FlexBox",component:a},{name:"antd",packageName:"antd",component:o}]},{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:"const { default: FlexBox } = _FlexBox;\nconst { Card, Button } = antd;\nconst { range } = lodash;\nconst { useRef } = React;\nconst BaseExample = () => {\n  const ref = useRef();\n  return (\n    <div>\n      <FlexBox.Fetch\n        ref={ref}\n        getFetchApi={({ size }) => {\n          return {\n            data: {\n              pageSize: size,\n            },\n            loader: ({ data }) => {\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve({\n                    pageData: range(0, data.pageSize).map((index) => {\n                      return {\n                        key: index,\n                        title: `\u7b2c${index}\u9879`,\n                      };\n                    }),\n                  });\n                }, 1000);\n              });\n            },\n          };\n        }}\n        renderItem={(item) => (\n          <FlexBox.Item>\n            <Card title={item.title}>Card content</Card>\n          </FlexBox.Item>\n        )}\n      />\n      <Button\n        onClick={() => {\n          console.log(ref.current);\n        }}\n      >\n        \u83b7\u53d6FetchApi\n      </Button>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_FlexBox",packageName:"@components/FlexBox",component:a},{name:"antd",packageName:"antd",component:o},{name:"lodash",packageName:"lodash",component:l}]}]}}},93314:(n,e,t)=>{t.d(e,{A:()=>l});var a=t(24666),o=t(55199);const l={name:"HistoryStore",summary:"<p>\u5386\u53f2\u8bb0\u5f55\u63d0\u793a</p>",api:"<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027\u540d</th>\n<th>\u8bf4\u660e</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n</tr>\n</thead>\n</table>",example:{isFull:!1,className:"HistoryStore_a963f",style:"",list:[{title:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u6807\u9898",description:"\u8fd9\u91cc\u586b\u5199\u793a\u4f8b\u8bf4\u660e",code:'const { default: HistoryStore } = _HistoryStore;\nconst { Input } = antd;\nconst { useState } = React;\nconst BaseExample = () => {\n  const [value, setValue] = useState("");\n  return (\n    <HistoryStore\n      onSelect={(value) => {\n        setValue(value);\n      }}\n    >\n      {({ appendHistory, openHistory }) => (\n        <Input.Search\n          value={value}\n          onChange={(e) => {\n            setValue(e.target.value);\n          }}\n          onFocus={openHistory}\n          onSearch={(value) => {\n            appendHistory({\n              value,\n              label: value,\n            });\n          }}\n        />\n      )}\n    </HistoryStore>\n  );\n};\n\nrender(<BaseExample />);\n\n',scope:[{name:"_HistoryStore",packageName:"@components/HistoryStore",component:a},{name:"antd",packageName:"antd",component:o}]}]}}}}]);
+//# sourceMappingURL=2242.a5c4c8d4.chunk.js.map