@kne-components/components-core 0.4.38 → 0.4.39

package/build/static/js/2242.7df7a936.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/2242.7df7a936.chunk.js","mappings":"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","sources":["components/FilePreview/README.md","components/StateBar/README.md","components/Features/README.md","components/FetchButton/README.md","components/FileList/README.md","components/Layout/README.md","components/ButtonGroup/README.md","webpack://@kne-components/components-core/./src/components/HistoryStore/style.module.scss?1856","components/HistoryStore/index.js","components/Content/README.md","components/Modal/README.md","components/Permissions/README.md","components/HelperGuide/README.md","components/Navigation/README.md","components/Descriptions/README.md","components/Icon/README.md","components/Menu/README.md","components/Intl/doc/locale/en-US.js","components/Intl/doc/locale/zh-CN.js","components/Intl/README.md","components/File/README.md","components/StateTag/README.md","components/Drawer/README.md","components/LoadingButton/README.md","components/Common/README.md","components/FormInfo/README.md","components/Table/README.md","components/InfoPage/README.md","components/Enum/README.md","components/Filter/README.md","components/ConfirmButton/README.md","components/Image/README.md","components/Global/README.md","components/Tooltip/README.md","components/FlexBox/README.md","components/HistoryStore/README.md"],"sourcesContent":["import * as component_32 from '@components/FilePreview';\nimport * as component_33 from '@kne/remote-loader';\nimport * as component_34 from '@components/Global';\nconst readmeConfig = {\n    name: `FilePreview`,\n    summary: `<p>文件预览</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: true,\n        className: `FilePreview_143ff`,\n        style: ``,\n        list: [{\n    title: `HtmlPreview`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n}]\n},{\n    title: `PdfPreview`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n}]\n},{\n    title: `TextPreview`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n}]\n},{\n    title: `ImagePreview`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n}]\n},{\n    title: `unknown`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n}]\n},{\n    title: `office`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_34\n}]\n},{\n    title: `audio`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_34\n}]\n},{\n    title: `video`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FilePreview\",\n    packageName: \"@components/FilePreview\",\n    component: component_32\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_33\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_34\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_97 from '@components/StateBar';\nimport * as component_98 from 'antd';\nconst readmeConfig = {\n    name: `StateBar`,\n    summary: `<p>用于 State Bar</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stateOption</td>\n<td>state操作列表</td>\n<td>string</td>\n<td>{key: string, tab: ReactNode}[]</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>当前激活 tab 面板的 key</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>当前tab展示样式</td>\n<td>'tab'、'radio'、'step'</td>\n<td>'tab'</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>事件返回选中的key</td>\n<td>(value: string) =&gt; void</td>\n<td></td>\n</tr>\n<tr>\n<td>tabBarExtraContent</td>\n<td>展示在state bar右侧</td>\n<td>ReactNode</td>\n<td>null</td>\n</tr>\n<tr>\n<td>isInner</td>\n<td>底部线延展至总长</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>key</td>\n<td>对应 activeKey</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>tab</td>\n<td>选项卡头显示文字</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `StateBar_de00a`,\n        style: ``,\n        list: [{\n    title: `State Bar`,\n    description: `State Bar`,\n    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: \"全部\", key: \"1\" },\n          { tab: \"科目一\", key: \"2\" },\n          {\n            tab: \"科目二\",\n            key: \"3\",\n          },\n          { tab: \"科目三\", key: \"4\" },\n          { tab: \"科目四\", key: \"5\" },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_StateBar\",\n    packageName: \"@components/StateBar\",\n    component: component_97\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_98\n}]\n},{\n    title: `Radio State Bar`,\n    description: `Radio State Bar`,\n    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: \"全部\", key: \"1\" },\n          { tab: \"科目一\", key: \"2\" },\n          { tab: \"科目二\", key: \"3\" },\n          { tab: \"科目三\", key: \"4\" },\n          { tab: \"科目四\", key: \"5\" },\n          { tab: \"科目一1\", key: \"22\" },\n          { tab: \"科目二2\", key: \"33\" },\n          { tab: \"科目三3\", key: \"44\" },\n          { tab: \"科目四4\", key: \"55\", style: { cursor: \"copy\" } },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseStateExample />);\n\n`,\n    scope: [{\n    name: \"_StateBar\",\n    packageName: \"@components/StateBar\",\n    component: component_97\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_98\n}]\n},{\n    title: `Step State Bar`,\n    description: `Step State Bar`,\n    code: `const { default: StateBar } = _StateBar;\n\nconst BaseStateExample = () => {\n  return (\n    <StateBar\n      type=\"step\"\n      stateOption={[\n        { tab: \"全部\", key: \"1\" },\n        { tab: \"科目一\", key: \"2\" },\n        { tab: \"科目二\", key: \"3\" },\n        { tab: \"科目三\", key: \"4\" },\n        { tab: \"科目四\", key: \"5\" },\n        { tab: \"科目一1\", key: \"22\" },\n        { tab: \"科目二2\", key: \"33\" },\n        { tab: \"科目三3\", key: \"44\" },\n        { tab: \"科目四4\", key: \"55\", className: \"last\" },\n      ]}\n      tabBarExtraContent={<div>测试</div>}\n    />\n  );\n};\n\nrender(<BaseStateExample />);\n\n`,\n    scope: [{\n    name: \"_StateBar\",\n    packageName: \"@components/StateBar\",\n    component: component_97\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_21 from '@components/Features';\nimport * as component_22 from '@components/Global';\nimport * as component_23 from '@components/Layout';\nimport * as component_24 from 'react-router-dom';\nimport * as component_25 from 'antd';\nconst readmeConfig = {\n    name: `Features`,\n    summary: `<h3>何时使用</h3>\n<p>在系统中需要通过一些条件，系统性地让整个系统的某些功能屏蔽或者有另外的一些展现方式，可以用该组件来实现</p>\n<h3>特点</h3>\n<ul>\n<li>全局性配置，一次性声明，避免将各种判断语句散落在项目各处造成难以维护</li>\n<li>具有特征判断和依赖性判断，即当系统描述性文件中含有某个模块且含有所有依赖项模块则判断该组件为正常状态，其他情况为关闭状态</li>\n<li>可以通过配置文件给正常状态和关闭状态的组件传递不同的props来控制两种状态下组件的不同逻辑</li>\n<li>在配置文件中，组件的id是简写，只需要保证同一层级的组件id不重复就可以了，它的真实id会通过其所在的上下级关系，通过冒号将每一层的组件id链接起来组成其真实的id，你可以打开调试模式查看每一个组件实际运行时的id和判断状态</li>\n<li>组件的type可以设置为三种：system,module,feature。system为配置文件最顶级组件，module为功能模块，默认Layout的Page组件openFeatures为true时它的name会被设置成module，feature为具体的功能项</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>模块或功能id，通过Global里面的preset的features配置确定该模块开启或者关闭</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>features 参数设置</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>debug</td>\n<td>是否开启调试模式，开启后控制台会打印所有模块的id和判断结果</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>profile</td>\n<td>模块配置列表，具体参考下面profile参数说明</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<ul>\n<li>profile参数说明</li>\n</ul>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>模块的唯一标识符，需要保证在当前一级中不重复，实际id为所有父级的id用’:‘链接的字符串</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>type</td>\n<td>可能取值为system,module,feature，注意最外层的type必须为system</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>模块的中文名称，不参与判断，只标识模块名帮助开发者识别</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>close</td>\n<td>模块是否关闭，可以缺省该值，缺省时profile里面存在某id的模块即为模块开启，不存在即为关闭。在特殊情况下，在profile存在该模块配置但是希望其关闭时可以显示指定该参数为true来关闭模块</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>dependencies</td>\n<td>依赖模块列表，每一项为一个模块id（该id必须为完整的id串，即带有所有父级id的用’:‘链接起来的字符串）,当所有id的指代模块都被判断开启时，该模块被判断为开启</td>\n<td>array[string]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>options</td>\n<td>模块开启时获取的参数</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rejectedOptions</td>\n<td>模块关闭时获取的参数</td>\n<td>any</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>被控制的模块，为function时可以接收到({isPass,options})参数 isPass为模块是否开启，options在模块开启时为options参数，在模块关闭时为rejectedOptions参数，其不为function类型时当模块关闭则不显示children，模块开启时正常显示children</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Features_98f77`,\n        style: ``,\n        list: [{\n    title: `展示了一个系统中功能一开启功能二关闭的情况`,\n    description: `展示了一个系统中功能一开启功能二关闭的情况`,\n    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: \"业务系统\",\n            children: [\n              {\n                id: \"home\",\n                type: \"module\",\n                name: \"首页\",\n                children: [\n                  {\n                    id: \"test\",\n                    type: \"feature\",\n                    name: \"测试功能\",\n                    dependencies: [\"erc:client\"],\n                  },\n                ],\n              },\n              {\n                id: \"position\",\n                type: \"module\",\n                name: \"职位\",\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: \"客户\",\n              },\n            ],\n          },\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <PermissionsPage name=\"home\" openFeatures>\n          <Features id=\"test\">功能模块一</Features>\n          <Features id=\"test2\">功能模块二</Features>\n        </PermissionsPage>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Features\",\n    packageName: \"@components/Features\",\n    component: component_21\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_22\n},{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_23\n}]\n},{\n    title: `展示了打开页面特性配置开启和关闭的情况`,\n    description: `展示了打开页面特性配置开启和关闭的情况`,\n    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: \"业务系统\",\n            children: [\n              {\n                id: \"home\",\n                type: \"module\",\n                name: \"首页\",\n                children: [\n                  {\n                    id: \"test\",\n                    type: \"feature\",\n                    name: \"测试功能\",\n                  },\n                  {\n                    id: \"test2\",\n                    type: \"feature\",\n                    name: \"测试功能2\",\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: \"职位\",\n              path: \"/position\",\n            },\n            {\n              key: \"client\",\n              title: \"客户\",\n              path: \"/client\",\n            },\n          ],\n        }}\n      >\n        <Routes>\n          <Route\n            index\n            element={\n              <PermissionsPage name=\"home\" openFeatures>\n                home页面模块\n                <div>\n                  <Features id=\"test\">开启模块</Features>\n                  <Features id=\"test2\">关闭模块</Features>\n                </div>\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path=\"/position\"\n            element={\n              <PermissionsPage name=\"position\" openFeatures>\n                position页面模块\n              </PermissionsPage>\n            }\n          />\n          <Route\n            path=\"/client\"\n            element={\n              <PermissionsPage name=\"client\">\n                client页面模块,未打开features\n              </PermissionsPage>\n            }\n          />\n        </Routes>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Features\",\n    packageName: \"@components/Features\",\n    component: component_21\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_22\n},{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_23\n},{\n    name: \"Router\",\n    packageName: \"react-router-dom\",\n    component: component_24\n}]\n},{\n    title: `展示了一个系统中功能开启和关闭参数获取`,\n    description: `展示了一个系统中功能开启和关闭参数获取`,\n    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: \"业务系统\",\n            children: [\n              {\n                id: \"home\",\n                type: \"module\",\n                name: \"首页\",\n                children: [\n                  {\n                    id: \"test\",\n                    type: \"feature\",\n                    name: \"测试功能\",\n                    options: {\n                      state: \"开启\",\n                    },\n                    rejectedOptions: {\n                      state: \"关闭\",\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          切换\n        </Button>\n        <Layout navigation={{ isFixed: false }}>\n          <PermissionsPage name=\"home\" openFeatures>\n            <Features id=\"test\">\n              {({ isPass, options }) => {\n                return isPass\n                  ? \"模块开启,options:\" + JSON.stringify(options)\n                  : \"模块关闭,options:\" + JSON.stringify(options);\n              }}\n            </Features>\n          </PermissionsPage>\n        </Layout>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Features\",\n    packageName: \"@components/Features\",\n    component: component_21\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_22\n},{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_23\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_25\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_26 from '@components/FetchButton';\nconst readmeConfig = {\n    name: `FetchButton`,\n    summary: `<p>用于点击后加载数据的按钮</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `FetchButton_8e1c9`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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        点击加载数据\n      </FetchButton>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_FetchButton\",\n    packageName: \"@components/FetchButton\",\n    component: component_26\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_35 from '@components/FileList';\nimport * as component_36 from '@kne/remote-loader';\nimport * as component_37 from 'lodash';\nimport * as component_38 from 'antd';\nconst readmeConfig = {\n    name: `FileList`,\n    summary: `<p>文件列表展示，预览，上传</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</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>`,\n    example: {\n        isFull: true,\n        className: `FileList_a785a`,\n        style: ``,\n        list: [{\n    title: `完整示例`,\n    description: `提供一个上传文件，显示文件列表，预览文件的展示`,\n    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: \"哈哈哈\",\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: \"测试开发_夏永昱_本科_5年.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: \"测试开发_夏永昱_本科_5年.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`,\n    scope: [{\n    name: \"_FileList\",\n    packageName: \"@components/FileList\",\n    component: component_35\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_36\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_37\n}]\n},{\n    title: `上传文件列表`,\n    description: `展示一个上传文件展示上传成功文件列表`,\n    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: \"哈哈哈\",\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_王晶简历-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>非受控情况</div>\n      <FileUpload\n        setList={(fileList) => {\n          console.log(\">>>>>>>>>>\", fileList);\n        }}\n        apis={apis}\n      />\n    </PureGlobal>\n  );\n});\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_FileList\",\n    packageName: \"@components/FileList\",\n    component: component_35\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_36\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_37\n}]\n},{\n    title: `拖拽上传`,\n    description: `展示一个拖拽上传文件，得到File对象`,\n    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}>标题</Col>\n          <Col>\n            <Space split={<Divider type=\"vertical\" />}>\n              <DragButton />\n              <UploadButton>上传</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`,\n    scope: [{\n    name: \"_FileList\",\n    packageName: \"@components/FileList\",\n    component: component_35\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_38\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_77 from '@components/Layout';\nimport * as component_78 from '@components/Global';\nimport * as component_79 from 'antd';\nimport * as component_80 from '@components/Filter';\nconst readmeConfig = {\n    name: `Layout`,\n    summary: `<h3>何时使用</h3>\n<p>每个登录后的系统页面都应该在Layout的框架之下，它定义了页面的基本框架。根据设计对于页面的不同要求，适当选择不同的组合</p>\n<h3>特点</h3>\n<p>Layout将整个页面划分成以下几个区域</p>\n<ol>\n<li>导航区</li>\n<li>内容区</li>\n<li>左菜单区</li>\n<li>右操作区</li>\n<li>页头区</li>\n<li>页头信息区</li>\n<li>页面标题区</li>\n</ol>\n<p>通过给Page配置不同的参数实现不同区域的显示</p>\n<h3>注意</h3>\n<ul>\n<li>Page的name参数必须要传，用来在页面跳转时确定Page是不是同一个，决定着Page是否走install周期</li>\n<li>Page组件的参数是通过Context保存在Layout中的，这样做的目的是为了让页面跳转时，除页面区以外的区域在前后俩页面差别不大的情况下走更新周期而不是install周期，以此带来更快的渲染速度避免不必要的重复安装和卸载</li>\n<li>请尽量通过Page提供的参数来配置出设计要求的页面，不要自行用css实现，以便于Layout组件能从整体控制页面的基本形式和不同区域的padding和margin，让系统更加统一化标准化</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>navigation</td>\n<td>导航参数参考 Navigation 组件参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>一般放置Page组件</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>menu</td>\n<td>左菜单区内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filter</td>\n<td>页面标题位置筛选器参数,参考 Filter 组件参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>menuOpen</td>\n<td>左菜单是否默认打开</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuWidth</td>\n<td>左菜单宽度</td>\n<td>string</td>\n<td>240px</td>\n</tr>\n<tr>\n<td>menuFixed</td>\n<td>左菜单是否fixed布局</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>menuCloseButton</td>\n<td>控制左菜单显示隐藏的按钮是否显示</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>header</td>\n<td>页头区内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>headerFixed</td>\n<td>页头区是否fixed布局</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>headerInfo</td>\n<td>页头信息区内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>backUrl</td>\n<td>右侧内容区的标题前展示返回按钮，并返回到该url</td>\n<td>参考 useNavigate</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>页面标题</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleExtra</td>\n<td>页面标题区右侧位置内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>titleLeftExtra</td>\n<td>页面标题区左侧位置内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>noMargin</td>\n<td>页面内容区是否去掉Margin</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>noPadding</td>\n<td>页面内容区是否去掉Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>option</td>\n<td>右操作区内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>optionWidth</td>\n<td>右操作区宽度</td>\n<td>string</td>\n<td>400px</td>\n</tr>\n<tr>\n<td>optionNoPadding</td>\n<td>右操作区是否去掉Padding</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFixed</td>\n<td>右操作区是否fixed布局</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>optionFooter</td>\n<td>右操作区底部内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openFeatures</td>\n<td>Page是否启用Features，启用时如果配置文件中没有该模块id则判断为模块关闭，会将name作为Features的id进行设置</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<h3>Affix</h3>\n<p>可以控制其中的内容是否是fixed布局</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>isFixed</td>\n<td>内容是否fixed布局</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>offsetTop</td>\n<td>距离窗口顶部达到指定偏移量后触发</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>offsetBottom</td>\n<td>距离窗口底部达到指定偏移量后触发</td>\n<td>number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>固定状态改变时触发的回调函数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Menu</h3>\n<p>显示一个菜单，最多支持两级，支持第一级展开收起，支持路径匹配自动高亮</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>菜单项</td>\n<td>array[object]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>菜单项显示内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>菜单项的key要求必须唯一</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].iconType</td>\n<td>菜单项前面的icon类型参考 Icon组件的type参数</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].path</td>\n<td>菜单项的路径</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].onClick</td>\n<td>菜单项点击触发事件，注意：如果菜单项已经传入path参数则该参数不生效</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>菜单项的第二级项列表，参考items参数。注意该组件只支持两级菜单，所以该参数内部的菜单项不再支持children参数</td>\n<td>array[object]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>currentKey</td>\n<td>当前被选中的菜单项的key，如果菜单项又path参数，不需要传递该参数，组件会根据路由自动判断选中项</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>currentKey产生修改时触发函数，注意：如果菜单项已经传入path参数则该参数不生效</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>allowCollapsed</td>\n<td>是否允许一级菜单收起</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>defaultOpenKeys</td>\n<td>初始展开的 SubMenu 菜单项 key 数组</td>\n<td>string[]</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PermissionsPage</h3>\n<p>加入权限判断的Page，错误类型默认为error，即在该页面没有权限时显示错误</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>权限列表参考 Permissions 组件参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Layout_ebd9b`,\n        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}`,\n        list: [{\n    title: `基础上下布局`,\n    description: `展示最基础的上导航栏，下内容的布局`,\n    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: \"测试帮助文档\",\n              url: \"/\",\n            },\n          ],\n        },\n      }}\n    >\n      <Layout navigation={{ isFixed: false }}>\n        <Page name=\"base\" helperGuideName=\"base-detail\">\n          <div className=\"layout-content\">内容区</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_78\n}]\n},{\n    title: `带有左侧菜单布局`,\n    description: `展示带有左侧菜单布局`,\n    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: \"父级标题1\",\n                key: \"p-0\",\n                iconType: \"icon-zhanghaodenglu\",\n                children: [\n                  {\n                    label: \"子标题1\",\n                    key: \"s-0\",\n                    path: \"/link1\",\n                  },\n                  {\n                    label: \"子标题2\",\n                    key: \"s-1\",\n                    path: \"/link2\",\n                  },\n                ],\n              },\n              {\n                label: \"父级标题2\",\n                key: \"p-1\",\n                iconType: \"icon-zhanghaodenglu\",\n                children: [\n                  {\n                    label: \"子标题1\",\n                    key: \"s-2\",\n                    path: \"/link3\",\n                  },\n                  {\n                    label: \"子标题2\",\n                    key: \"s-3\",\n                    path: \"/link4\",\n                  },\n                ],\n              },\n              {\n                label: \"父级标题3\",\n                key: \"p-2\",\n                iconType: \"icon-zhanghaodenglu\",\n                path: \"/link5\",\n              },\n            ]}\n          />\n        }\n        titleExtra={\n          <Space>\n            <Button type=\"primary\">新建</Button>\n          </Space>\n        }\n        backUrl={\"/\"}\n        title=\"标题\"\n      >\n        <div className=\"layout-content with-title-layout-content\">内容区</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_78\n}]\n},{\n    title: `左侧固定带Header`,\n    description: `展示带有header的左侧固定菜单布局`,\n    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\">左侧菜单区</div>}\n          titleExtra={\n            <Space>\n              <Button type=\"primary\">新建</Button>\n            </Space>\n          }\n          title=\"标题\"\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区域</div>}\n        >\n          <div>内容区</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: \"测试帮助文档\",\n            url: \"/\",\n          },\n        ],\n      },\n    }}\n  >\n    <Example />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_78\n}]\n},{\n    title: `右侧固定`,\n    description: `展示带有header的右侧固定菜单布局`,\n    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\">右侧操作区域</div>}\n        optionFooter={\n          <Space>\n            <Button type=\"primary\">新建</Button>\n          </Space>\n        }\n        titleExtra={\n          <Space>\n            <Button type=\"primary\">新建</Button>\n          </Space>\n        }\n        title=\"标题\"\n        header={<div className=\"header\">header</div>}\n        headerFixed={false}\n        menuFixed={false}\n      >\n        <div>内容区</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <Example />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_78\n}]\n},{\n    title: `带有filter的列表页`,\n    description: `展示带有filter的列表页`,\n    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\">添加</Button>\n            </Space>\n          }\n          filter={{\n            extraExpand: (\n              <Button type=\"primary\" size=\"small\">\n                订阅筛选项\n              </Button>\n            ),\n            value: filter,\n            onChange: (value) => {\n              setFilter(value);\n              console.log(getFilterValue(value));\n            },\n            list: [\n              [\n                <InputFilterItem label=\"文字\" name=\"text\" />,\n                <CityFilterItem label=\"城市\" name=\"city\" />,\n                <AdvancedSelectFilterItem\n                  label=\"高级选择\"\n                  name=\"select\"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: \"第一项\", value: 1 },\n                          { label: \"第二项\", value: 2, disabled: true },\n                          {\n                            label: \"第三项\",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <UserFilterItem\n                  label=\"用户选择\"\n                  name=\"user\"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: \"用户一\",\n                            value: 1,\n                            description: \"我是用户描述\",\n                          },\n                          {\n                            label: \"用户二\",\n                            value: 2,\n                            description: \"我是用户描述\",\n                          },\n                          {\n                            label: \"用户三\",\n                            value: 3,\n                            description: \"我是用户描述\",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n                <FunctionSelectFilterItem\n                  label=\"职能选择\"\n                  name=\"function\"\n                  onlyAllowLastLevel\n                  single\n                />,\n                <IndustrySelectFilterItem\n                  label=\"行业选择\"\n                  name=\"industry\"\n                  onlyAllowLastLevel\n                />,\n              ],\n              [\n                <UserFilterItem\n                  label=\"职位协助人\"\n                  name=\"position_user\"\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: \"用户一\",\n                            value: 1,\n                            description: \"我是用户描述\",\n                          },\n                          {\n                            label: \"用户二\",\n                            value: 2,\n                            description: \"我是用户描述\",\n                          },\n                          {\n                            label: \"用户三\",\n                            value: 3,\n                            description: \"我是用户描述\",\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />,\n              ],\n            ],\n          }}\n        >\n          <div className=\"layout-content\">内容区</div>\n        </Page>\n      </Layout>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_78\n},{\n    name: \"filter\",\n    packageName: \"@components/Filter\",\n    component: component_80\n}]\n},{\n    title: `左侧导航菜单`,\n    description: `展示一个左侧导航菜单`,\n    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: \"父级标题1\",\n          key: \"p-0\",\n          iconType: \"icon-zhanghaodenglu\",\n          children: [\n            {\n              label: \"子标题1\",\n              key: \"s-0\",\n            },\n            {\n              label: \"子标题2\",\n              key: \"s-1\",\n            },\n          ],\n        },\n        {\n          label: \"父级标题2\",\n          key: \"p-1\",\n          iconType: \"icon-zhanghaodenglu\",\n          children: [\n            {\n              label: \"子标题1\",\n              key: \"s-2\",\n            },\n            {\n              label: \"子标题2\",\n              key: \"s-3\",\n            },\n          ],\n        },\n        {\n          label: \"父级标题3\",\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: \"父级标题1\",\n            key: \"p-0\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-0\",\n                path: \"/link1\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-1\",\n                path: \"/link2\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题2\",\n            key: \"p-1\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-2\",\n                path: \"/link3\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-3\",\n                path: \"/link4\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题3\",\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: \"子标题1\",\n            key: \"s-0\",\n            path: \"/link1\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题2\",\n            key: \"s-1\",\n            path: \"/link2\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题1\",\n            key: \"s-2\",\n            path: \"/link3\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题2\",\n            key: \"s-3\",\n            path: \"/link4\",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: \"父级标题1\",\n            key: \"p-0\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-0\",\n                path: \"/link1\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-1\",\n                path: \"/link2\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题2\",\n            key: \"p-1\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-2\",\n                path: \"/link3\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-3\",\n                path: \"/link4\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题3\",\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`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n}]\n},{\n    title: `PageHeader`,\n    description: `页面头`,\n    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\">左侧菜单区</div>}\n        title=\"标题\"\n        hideCloseSvg={true}\n        menuFixed={false}\n        name=\"pageHeaderLayout\"\n        header={\n          <PageHeader\n            iconType=\"icon-color-shenpi-biaoti\"\n            title=\"详情页名称\"\n            info=\"编号:85767\"\n            options={[\n              {\n                children: \"新建\",\n              },\n              {\n                children: \"操作1\",\n              },\n              {\n                children: \"操作2\",\n              },\n              {\n                children: \"操作3\",\n              },\n              {\n                children: \"操作4\",\n              },\n            ]}\n            tags={[\"辅助信息\", \"辅助信息\", \"辅助信息\", \"辅助信息\"]}\n          />\n        }\n        headerFixed={false}\n      >\n        <div>内容区</div>\n      </Page>\n    </Layout>\n  );\n};\n\nrender(<Example />);\n\n`,\n    scope: [{\n    name: \"layout\",\n    packageName: \"@components/Layout\",\n    component: component_77\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_79\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_1 from '@components/ButtonGroup';\nimport * as component_2 from 'antd';\nimport * as component_3 from '@components/ConfirmButton';\nconst readmeConfig = {\n    name: `ButtonGroup`,\n    summary: `<p>用于根据当前容器空间自动计算多余按钮收起</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>button按钮属性的数组</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>more</td>\n<td>更多按钮占位</td>\n<td>jsx</td>\n<td>&lt;Button&gt;更多&lt;Icon type=\"icon-arrow-thin-down\"/&gt;&lt;/Button&gt;</td>\n</tr>\n<tr>\n<td>compact</td>\n<td>是否为紧凑模式</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>size</td>\n<td>当compact为false时为按钮间隔大小，否则为按钮大小</td>\n<td>'small','middle','large',number</td>\n<td>8</td>\n</tr>\n<tr>\n<td>split,align</td>\n<td>参考antd Space</td>\n<td>-</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `ButtonGroup_e3fc2`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"操作1\",\n            },\n            {\n              children: \"操作2\",\n            },\n            {\n              children: \"操作3\",\n              hidden: true,\n            },\n            {\n              children: \"操作4\",\n              message: \"确定要执行操作吗？\",\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          增加容器宽度\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          减少容器宽度\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_ButtonGroup\",\n    packageName: \"@components/ButtonGroup\",\n    component: component_1\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_2\n}]\n},{\n    title: `紧凑模式`,\n    description: `紧凑模式`,\n    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: \"操作1\",\n            },\n            {\n              children: \"操作2\",\n            },\n            {\n              children: \"操作3\",\n            },\n            {\n              children: \"操作3\",\n              message: \"确定要执行操作吗？\",\n            },\n          ]}\n        />\n      </div>\n      <Space>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width + 20;\n            });\n          }}\n        >\n          增加容器宽度\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          减少容器宽度\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_ButtonGroup\",\n    packageName: \"@components/ButtonGroup\",\n    component: component_1\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_2\n}]\n},{\n    title: `渲染函数`,\n    description: `渲染函数`,\n    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(\"加载完成\");\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                  操作1\n                </Button>\n              );\n            },\n            (props) => {\n              return <Button {...props}>操作2</Button>;\n            },\n            (props) => {\n              return <Button {...props}>操作3</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=\"确定要执行操作吗？\"\n                        onClick={onClick}\n                      >\n                        操作4\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          增加容器宽度\n        </Button>\n        <Button\n          onClick={() => {\n            setWidth((width) => {\n              return width - 20;\n            });\n          }}\n        >\n          减少容器宽度\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_ButtonGroup\",\n    packageName: \"@components/ButtonGroup\",\n    component: component_1\n},{\n    name: \"_ConfirmButton\",\n    packageName: \"@components/ConfirmButton\",\n    component: component_3\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_2\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","// extracted by mini-css-extract-plugin\nexport default {\"overlay\":\"style_overlay__ZS5Wz__71uqS\",\"overlay-content\":\"style_overlay-content__IVFmc__71uqS\",\"state-tag\":\"style_state-tag__+59RJ__71uqS\"};","import style from \"./style.module.scss\";\nimport {\n    useState, useCallback, useEffect, useRef, useLayoutEffect,\n} from \"react\";\nimport localStorage from \"@common/utils/localStorage\";\nimport StateTag from \"@components/StateTag\";\nimport {Popover, Space} from \"antd\";\nimport dropWhile from \"lodash/dropWhile\";\nimport uniqBy from \"lodash/uniqBy\";\nimport useClickOutside from \"@kne/use-click-outside\";\nimport classnames from \"classnames\";\n\nconst HistoryStore = ({\n                          className,\n                          overlayClassName,\n                          storeName = 'HISTORY_STORE_KEY',\n                          maxLength = 5,\n                          label = '最近搜索',\n                          children,\n                          onSelect,\n                          zIndex,\n                          getPopupContainer,\n                      }) => {\n    const [list, setList] = useState(() => {\n        return localStorage.getItem(storeName) || [];\n    });\n    const [open, setOpen] = useState(false);\n    const openHistory = useCallback(() => {\n        if (list.length === 0) {\n            return;\n        }\n        setOpen(true);\n    }, [list]);\n    const storeNameRef = useRef(storeName);\n    storeNameRef.current = storeName;\n    useEffect(() => {\n        localStorage.setItem(storeNameRef.current, list);\n    }, [list]);\n\n    const appendHistory = useCallback((item) => {\n        if (item.value && item.label) {\n            setList((list) => {\n                const newList = dropWhile(list, {value: item.value});\n                newList.splice(0, 0, item);\n                return maxLength ? uniqBy(newList, \"value\").slice(0, maxLength) : newList;\n            });\n        }\n        setOpen(false);\n    }, [maxLength]);\n\n    const close = useCallback(() => {\n        setOpen(false);\n    }, []);\n\n    const outerRef = useClickOutside(close);\n\n    const popoverChildrenRef = useRef(null), popoverContentRef = useRef(null);\n    outerRef.current = {\n        contains: (target) => {\n            return (popoverChildrenRef.current.contains(target) || (open && popoverContentRef.current.contains(target)));\n        },\n    };\n\n    const onSelectRef = useRef(null);\n    const setOnSelect = (callback) => {\n        onSelectRef.current = callback;\n    };\n\n    const [width, setWidth] = useState(0);\n\n    useLayoutEffect(() => {\n        const callback = () => {\n            setWidth(popoverChildrenRef.current.clientWidth);\n        };\n        callback();\n        const resizeObserver = new ResizeObserver(callback);\n        resizeObserver.observe(popoverChildrenRef.current);\n        const mutationObserver = new MutationObserver(callback);\n        mutationObserver.observe(popoverChildrenRef.current, {\n            subtree: true, childList: true,\n        });\n        return () => {\n            mutationObserver.disconnect();\n            resizeObserver.disconnect();\n        };\n    }, []);\n\n    return (<Popover\n            zIndex={zIndex}\n            placement=\"bottom\"\n            transitionName={\"ant-slide-up\"}\n            arrow={false}\n            open={open}\n            getPopupContainer={getPopupContainer}\n            overlayClassName={classnames(overlayClassName, style[\"overlay\"])}\n            content={<div\n                className={style[\"overlay-content\"]}\n                style={{width}}\n                ref={popoverContentRef}\n            >\n                <Space direction=\"vertical\">\n                    <div>{label}</div>\n                    <Space wrap>\n                        {list.map((item) => (<StateTag\n                                className={style[\"state-tag\"]}\n                                text={item.label}\n                                type={\"result\"}\n                                onClick={() => {\n                                    onSelect && onSelect(item.value, item);\n                                    onSelectRef.current && onSelectRef.current(item.value, item);\n                                    close();\n                                    appendHistory(item);\n                                }}\n                            />))}\n                    </Space>\n                </Space>\n            </div>}\n        >\n            <div ref={popoverChildrenRef} className={classnames(className)}>\n                {children({\n                    open, openHistory, appendHistory, setOnSelect, close,\n                })}\n            </div>\n        </Popover>);\n};\n\nexport default HistoryStore;\n","import * as component_11 from '@components/Content';\nconst readmeConfig = {\n    name: `Content`,\n    summary: `<h3>何时使用</h3>\n<p>成组展示多个字段，常见于详情页的信息展示</p>\n<h3>特点</h3>\n<p>labelAlign不为auto时会自动计算label的最小宽度使所有label的宽度等于最长的label宽度使视觉上更加整齐有秩序感</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td>内容，为一个数组，数组里面每一个值{label,content}</td>\n<td>array</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td>label的对齐方式可以传入的值 left,right,center,auto,为auto时label不计算最小宽度</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>显示列数</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>栅格间隔，可以写成像素值或支持响应式的对象写法来设置水平间隔 { xs: 8, sm: 16, md: 24}。或者使用数组形式同时设置 [水平间距, 垂直间距]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Content_f15c1`,\n        style: ``,\n        list: [{\n    title: `基本示例`,\n    description: `展示了一个基本内容`,\n    code: `const {default:Content} = _Content;\nconst BaseExample = ()=>{\n    return <Content list={[\n        {label:'标题',content:'内容'},\n        {label:'标题标题',content:'内容内容'},\n        {label:'标题标',content:'内容内容内容内容内容内容内容内容内容内容'},\n        {label:'标题标题标题',content:'内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容'}\n    ]}/>;\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_11\n}]\n},{\n    title: `labelAlign auto`,\n    description: `展示了设置labelAlign为auto的情况`,\n    code: `const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content labelAlign=\"auto\" list={[\n        {label: '标题', content: '内容'},\n        {label: '标题标题', content: '内容内容'},\n        {label: '标题标', content: '内容内容内容内容内容内容内容内容内容内容'},\n        {\n            label: '标题标题标题',\n            content: '内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n`,\n    scope: [{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_11\n}]\n},{\n    title: `多列`,\n    description: `展示了两列的情况`,\n    code: `const {default: Content} = _Content;\nconst BaseExample = () => {\n    return <Content col={2} labelAlign=\"auto\" list={[\n        {label: '标题', content: '内容'},\n        {label: '标题标题', content: '内容内容'},\n        {label: '标题标', content: '内容内容内容内容内容内容内容内容内容内容'},\n        {\n            label: '标题标题标题',\n            content: '内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容'\n        }\n    ]}/>;\n};\n\nrender(<BaseExample/>);\n\n`,\n    scope: [{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_11\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_83 from '@components/Modal';\nimport * as component_84 from '@components/Global';\nimport * as component_85 from 'antd';\nimport * as component_86 from '@kne/react-fetch';\nimport * as component_87 from '@components/Content';\nimport * as component_88 from '@components/FormInfo';\nconst readmeConfig = {\n    name: `Modal`,\n    summary: `<h3>何时使用</h3>\n<p>需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以在当前页面正中打开一个浮层，承载相应的操作。</p>\n<h3>特点</h3>\n<p>该组件是antd Modal组件的再封装：</p>\n<ul>\n<li>修改了footer部分的设置逻辑,能更加简单的定义footer区域的功能</li>\n<li>添加了withDecorator可以更加方便的处理Modal外层的显示逻辑</li>\n<li>扩展了用于方法调用的useModal的hooks，可以通过hooks获得一个Modal的调用方法，并且保证其和Modal组件式调用有相同的UI表现和行为</li>\n<li>扩展了ModalButton组件，可以在点击该按钮时执行加载数据，并且Button的状态变为loading，在数据加载完成之后再弹出弹窗</li>\n<li>扩展了TabsModal组件，它是一个Tabs和Modal组合起来的组件，对弹窗title做了特殊处理，更加符合UI交互逻辑</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>弹窗的footer，当其被显式设置成null且footerButtons没有设置过时弹窗不显示footer。当它类型为function时可以得到close方法和withDecorator设置的props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>弹窗footer的按钮区，默认为确认和取消按钮，默认按钮分别响应onConfirm和onCancel方法，如果自定义设置footerButtons则需要自行传入onClick参数，onConfirm和onCancel方法将不生效</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>弹窗关闭时调用，弹窗受控时由该方法将外部open状态修改</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>当footerButtons未自定义设置时点击确认按钮触发执行该方法，当其返回Promise点击后Promise，resolve之前确认按钮显示为loading状态，返回值为false或者Promise的resolve值为false时弹窗不会被关闭，其他情况弹窗默认关闭</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>和onConfirm类似，其为点击取消按钮触发</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>弹窗内容，可以为jsx或者function，为function时可以接收到close和withDecorator设置的props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>弹窗修饰器，会接收到弹窗children的render方法，可以在其外部添加修饰内容后执行render方法，给render方法传入的值可以在children,footer,rightOptions类型为function时接收到对应的参数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>rightOptions</td>\n<td>弹窗右侧区域，和children类似可以为jsx或者function类型</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>点击蒙层是否允许关闭</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数参考antd Modal组件</p>\n<h3>useModal</h3>\n<p>获取一个执行后可以弹出一个Modal组件的方法</p>\n<h4>return:modal</h4>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>执行后可以弹出一个Modal弹窗，参数同Modal组件参数</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>TabsModal</h3>\n<p>一个Tabs和Modal组合起来的组件，对弹窗title做了特殊处理，更加符合UI交互逻辑</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>items</td>\n<td>同antd Tabs的items参数</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].label</td>\n<td>选项卡头显示文字</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].children</td>\n<td>选项卡头显示内容，和antd Tabs不同的是它可以是一个function和Modal的children类似可以接收items[].withDecorator传入的参数</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>items[].key</td>\n<td>对应activeKey值</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>activeKey</td>\n<td>当前激活 tab 面板的 key</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>弹窗修饰器和Modal的withDecorator作用一致</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>defaultActiveKey</td>\n<td>初始化选中面板的 key，如果没有设置 activeKey</td>\n<td>string</td>\n<td></td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>切换面板的回调</td>\n<td>function</td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3>useTabsModal</h3>\n<p>获取一个执行后可以弹出一个TabsModal组件的方法</p>\n<h4>return:tabsModal</h4>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>tabsModal</td>\n<td>执行后可以弹出一个TabsModal弹窗，参数同TabsModal组件参数</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>ModalButton</h3>\n<p>点击以后可以执行获取数据，在数据未返回时按钮展示为loading状态，数据返回后弹出Modal弹窗</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch 所需参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>同Modal参数,当它为function时，执行function后返回的值作为modalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数同antd Button 组件</p>\n<h3>TabsModalButton</h3>\n<p>点击以后可以执行获取数据，在数据未返回时按钮展示为loading状态，数据返回后弹出TabsModal弹窗</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch 所需参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>同TabsModal参数,当它为function时，执行function后返回的值作为modalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数同antd Button 组件</p>`,\n    example: {\n        isFull: false,\n        className: `Modal_c59d6`,\n        style: ``,\n        list: [{\n    title: `普通弹窗`,\n    description: `展示弹窗的基本用法，自定义footer等功能。\n注意:\n1.onConfirm和onCancel只对于默认的footerButtons生效，如果是自定义的footerButtons则不需要传这两个参数，直接定义按钮的onClick即可。\n2.自定义的footerButtons的onClick可以返回一个Promise来延迟关闭弹窗，resolve的值为false不关闭弹窗，其他情况会自动关闭弹窗。在resolve未返回之前按钮会变成loading状态`,\n    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=\"确定延迟关闭弹窗\"\n          size={size}\n          open={open}\n          onClose={() => {\n            setOpen(false);\n          }}\n          onConfirm={() => {\n            return new Promise((resolve) => {\n              message.success(\"弹窗1s后关闭\");\n              setTimeout(() => {\n                message.success(\"弹窗关闭\");\n                resolve();\n              }, 1000);\n            });\n          }}\n        >\n          <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>\n        </Modal>\n        <Button\n          onClick={() => {\n            setOpen(true);\n          }}\n        >\n          确定延迟关闭弹窗\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"hooks调用弹框\",\n              size,\n              children: <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>,\n            });\n          }}\n        >\n          hooks调用弹框\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"超高弹窗\",\n              size,\n              children: (\n                <div style={{ height: \"2000px\" }}>\n                  超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗超高弹窗\n                </div>\n              ),\n            });\n          }}\n        >\n          展示超高弹窗\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"自定义footer弹框\",\n              size,\n              children: <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>,\n              footer: ({ close }) => (\n                <Space>\n                  <span>自定义footer</span>\n                  <Button\n                    type=\"link\"\n                    onClick={() => {\n                      close();\n                    }}\n                  >\n                    关闭\n                  </Button>\n                </Space>\n              ),\n            });\n          }}\n        >\n          展示自定义footer弹框\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"无footer弹框\",\n              size,\n              children: <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>,\n              footer: null,\n            });\n          }}\n        >\n          无footer弹框\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"自定义按钮组\",\n              size,\n              children: <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>,\n              footerButtons: [\n                {\n                  children: \"按钮一\",\n                },\n                {\n                  type: \"primary\",\n                  children: \"按钮二\",\n                },\n                {\n                  children: \"按钮三\",\n                },\n              ],\n            });\n          }}\n        >\n          自定义按钮组\n        </Button>\n        <Button\n          onClick={() => {\n            modal({\n              title: \"有rightOptions的弹窗\",\n              size,\n              children: <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>,\n              rightOptions: <div>右侧内容右侧内容右侧内容右侧内容</div>,\n              rightSpan: 12,\n            });\n          }}\n        >\n          有rightOptions的弹窗\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: \"有rightOptions的弹窗\",\n              size,\n              withDecorator: (render) => {\n                return <StateContainer>{render}</StateContainer>;\n              },\n              footerButtons: ({ disabled }) => [\n                {\n                  type: \"primary\",\n                  disabled,\n                  children: \"确定\",\n                },\n              ],\n              children: ({ disabled, setDisabled }) => (\n                <div>\n                  弹窗弹窗弹窗弹窗弹窗弹窗弹窗[{String(disabled)}]\n                  <Button\n                    onClick={() => {\n                      setDisabled((disabled) => !disabled);\n                    }}\n                  >\n                    切换确定按钮disabled\n                  </Button>\n                </div>\n              ),\n            });\n          }}\n        >\n          children控制footerButtons状态\n        </Button>\n      </Space>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_84\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n}]\n},{\n    title: `childrenRef的使用`,\n    description: ``,\n    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: \"示例弹框\",\n          children: ({ childrenRef }) => {\n            return (\n              <div ref={childrenRef}>\n                示例弹框示例弹框示例弹框示例弹框示例弹框示例弹框\n              </div>\n            );\n          },\n          onConfirm: (e, { childrenRef }) => {\n            console.log(childrenRef.current);\n          },\n        });\n      }}\n    >\n      点击弹出弹框\n    </Button>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n}]\n},{\n    title: `需要加载数据的弹窗`,\n    description: `可以通过withDecorator属性实现弹窗的加载数据或者加载远程组件的逻辑，在数据或者远程组件加载完成之前弹窗展示loading状态，加载完成之后children可以获取到加载的数据`,\n    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=\"组件调用方式\"\n        withDecorator={(render) => (\n          <Fetch\n            loader={() => {\n              return new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve([\n                    {\n                      label: \"内容1\",\n                      content: \"内容1内容1内容1内容1内容1内容1内容1\",\n                    },\n                    {\n                      label: \"内容2\",\n                      content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\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        组件调用方式\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: \"hooks调用方式\",\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: \"内容1\",\n                          content: \"内容1内容1内容1内容1内容1内容1内容1\",\n                        },\n                        {\n                          label: \"内容2\",\n                          content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\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调用方式\n      </Button>\n      <Button\n        onClick={() => {\n          modal({\n            title: (props) => {\n              return \"hooks调用方式\";\n            },\n            withDecorator: (render) => (\n              <Fetch\n                loader={() => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: \"内容1\",\n                          content: \"内容1内容1内容1内容1内容1内容1内容1\",\n                        },\n                        {\n                          label: \"内容2\",\n                          content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\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调用方式\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_84\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n},{\n    name: \"fetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_86\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_87\n}]\n},{\n    title: `可以弹出弹窗的按钮`,\n    description: `可以点击按钮弹出弹窗，并且在弹窗弹出之前可以加载数据，加载数据时，按钮为loading状态，数据加载完成之后再弹出弹窗`,\n    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: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\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: \"加载数据的弹窗\",\n            children: <Content list={data} col={2} />,\n          };\n        }}\n      >\n        点击加载数据\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        点击加载数据的Tabs弹窗\n      </TabsModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_84\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_87\n},{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_88\n}]\n},{\n    title: `tabs弹窗`,\n    description: `展示一个tabs弹窗，tabs的选项的label会占据弹窗title位置，弹框的title将不显示\ntabs的items多加了withDecorator参数和Modal的withDecorator参数类似可以控制其外部显示及渲染内容\ntabs的items的children也可以是function，同样可以接收到TabsModal的withDecorator传回的参数`,\n    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: \"项目 1\", key: \"item-1\", children: <div>项目 1项目 1项目 1项目 1项目 1项目 1项目 1项目 1</div>\n    }, {\n      label: \"项目 2\", key: \"item-2\", children: <div>项目 2项目 2项目 2项目 2项目 2项目 2项目 2项目 2</div>\n    }]} rightOptions={<div>右边栏内容右边栏内容右边栏内容右边栏内容</div>}>\n      <div>弹窗弹窗弹窗弹窗弹窗弹窗弹窗</div>\n    </TabsModal>\n    <Button onClick={() => {\n      setOpen(true);\n    }}>组件调用方式</Button>\n    <Button onClick={() => {\n      tabsModal({\n        rightOptions: <div>右边栏内容右边栏内容右边栏内容右边栏内容</div>, items: [{\n          label: \"项目 1\", key: \"item-1\", children: <div>项目 1项目 1项目 1项目 1项目 1项目 1项目 1项目 1</div>\n        }, {\n          label: \"项目 2\", key: \"item-2\", children: <div>项目 2项目 2项目 2项目 2项目 2项目 2项目 2项目 2</div>\n        }]\n      });\n    }}>hooks调用方式</Button>\n    <Button onClick={() => {\n      tabsModal({\n        title: \"此title不展示\",\n        rightOptions: ({ data }) => <Content list={data} />,\n        withDecorator: (render) => <Fetch loader={() => {\n          return new Promise((resolve) => {\n            setTimeout(() => {\n              resolve([{ label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" }, {\n                label: \"内容2\", content: \"内容2内容2内容2内容2内容2内容2内容2内容2\"\n              }]);\n            }, 1000);\n          });\n        }} render={({ data }) => render({ data })} />,\n        items: [{\n          label: \"项目 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: \"内容3\", content: \"内容3内容3内容3内容3内容3内容3内容3\" }, {\n                  label: \"内容4\", content: \"内容4内容4内容4内容4内容4内容4内容4内容4\"\n                }]);\n              }, 1000);\n            });\n          }} render={({ data }) => render({ tabData: data })} />,\n          label: \"项目 2\",\n          key: \"item-2\",\n          children: ({ data, tabData }) => <Content list={[...data, ...tabData]} col={2} />\n        }]\n      });\n    }}>复杂数据加载</Button>\n  </Space>;\n};\n\nrender(<PureGlobal><BaseExample /></PureGlobal>);\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_84\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n},{\n    name: \"fetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_86\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_87\n}]\n},{\n    title: `消息确认和提示`,\n    description: `展示确认消息提醒`,\n    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: \"确定要删除吗？\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        confirm\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"confirm\",\n            confirmType: \"warning\",\n            title: \"确定要编辑吗？\",\n            message:\n              \"确定要编辑确定要编辑确定要编辑确定要编辑确定要编辑确定要编辑确定要编辑\",\n          });\n        }}\n      >\n        confirm 警告\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"info\",\n            title: \"确定要删除吗？\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        info\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"info\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        info无标题\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"success\",\n            title: \"确定要删除吗？\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        success\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"warning\",\n            title: \"确定要删除吗？\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        warning\n      </Button>\n      <Button\n        onClick={() => {\n          confirmModal({\n            type: \"error\",\n            title: \"确定要删除吗？\",\n            message:\n              \"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\",\n          });\n        }}\n      >\n        error\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_83\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_84\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_85\n},{\n    name: \"fetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_86\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_87\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_94 from '@components/Permissions';\nimport * as component_95 from '@components/Global';\nimport * as component_96 from 'antd';\nconst readmeConfig = {\n    name: `Permissions`,\n    summary: `<h3>何时使用</h3>\n<p>在系统中存在一些功能和操作只允许某些角色用户使用，使用该组件可以让其包裹的组件或者区域根据系统的权限列表配置展示不同的状态</p>\n<h3>特点</h3>\n<p>通过在Global中的preset中设置permissions作为当前用户的权限列表，在Permissions组件配置permissions作为该功能要求具备的权限项，当要求具备的权限项全部在用户的权限列表中找到时为权限通过状态否则为权限不通过状态</p>\n<p>当权限不通过时，Permissions组件可以有三种方式呈现：</p>\n<ol>\n<li>用户可以看到操作功能的组件显示，但是不能进行操作，在鼠标移入时会以ToolTip提示错误原因，一般用在按钮等需要用户交互的功能位置</li>\n<li>用户不能看到操作功能或者数据呈现，对应区域显示错误原因，一般用在要数据展示等场景</li>\n<li>隐藏内部组件，一般用在不需要干扰到用户或用户不需要了解其没有权限的功能或数据等场景</li>\n</ol>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>类型，可选值为hidden，tooltip，error，分别为隐藏，气泡提示，错误提示三种形式</td>\n<td>string</td>\n<td>hidden</td>\n</tr>\n<tr>\n<td>tagName</td>\n<td>当前组件的tagName，同React.createElement的type参数，默认为span</td>\n<td>string</td>\n<td>span</td>\n</tr>\n<tr>\n<td>message</td>\n<td>提示文案</td>\n<td>string</td>\n<td>您暂无权限，请联系管理员</td>\n</tr>\n<tr>\n<td>request</td>\n<td>权限列表为一个字符串数组，每个item为一项权限的key，所有权限在全局的permissions中存在则判断为权限通过</td>\n<td>array[string]</td>\n<td>[]</td>\n</tr>\n<tr>\n<td>children</td>\n<td>该参数可以传function类型，children({isPass, type, request})，isPass为权限校验是否通过，type为提示类型，request为所需权限列表，可以自行实现权限的展示</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Permissions_d08cc`,\n        style: `.Permissions_d08cc .box {\n  padding: 20px;\n  background: #f8f8f8;\n}`,\n        list: [{\n    title: `展示权限不通过的几种形式`,\n    description: `通过切换不同的type，可以预览三种不同type的表现形式`,\n    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(\"执行操作\")}>有权限操作</Button>\n          </div>\n        </Permissions>\n        <Permissions type={type} request={[\"permission_3\"]}>\n          <div className=\"box\">\n            <Button onClick={() => console.log(\"执行操作\")}>无权限操作</Button>\n          </div>\n        </Permissions>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Permissions\",\n    packageName: \"@components/Permissions\",\n    component: component_94\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_95\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_96\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_54 from '@components/HelperGuide';\nimport * as component_55 from '@components/Global';\nconst readmeConfig = {\n    name: `HelperGuide`,\n    summary: `<p>给用户提供帮助文档</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `HelperGuide_4e237`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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                \"哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈\",\n              url: \"/xxxx\",\n            },\n          ],\n        },\n      }}\n    >\n      <HelperGuide name=\"test\" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_HelperGuide\",\n    packageName: \"@components/HelperGuide\",\n    component: component_54\n},{\n    name: \"Global\",\n    packageName: \"@components/Global\",\n    component: component_55\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_91 from '@components/Navigation';\nimport * as component_92 from '@components/Global';\nimport * as component_93 from 'antd';\nconst readmeConfig = {\n    name: `Navigation`,\n    summary: `<h3>何时使用</h3>\n<p>系统的顶部导航，一级导航项偏左靠近 logo 放置，辅助菜单偏右放置。</p>\n<h3>特点</h3>\n<ul>\n<li>集成了Permissions权限判断，可以通过权限列表来判断导项是否显示</li>\n<li>在屏幕显示不了全部的一级导航时可以自动将后面的导航项收起到更多下拉菜单里面</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Navigation_84649`,\n        style: `.Navigation_84649 .fold-items {\n  width: 600px;\n}`,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    code: `const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: \"client\",\n    title: \"客户\",\n    path: \"/client\",\n    permission: \"client:client:look\",\n  },\n  {\n    key: \"position\",\n    title: \"职位\",\n    path: \"/position\",\n    permission: \"jd:job:look\",\n  },\n  {\n    key: \"ats\",\n    title: \"招聘流程\",\n    path: \"/ats\",\n  },\n  {\n    key: \"talent\",\n    title: \"人才库\",\n    permission: \"cv:cv:look\",\n    path: \"/talent\",\n  },\n  {\n    key: \"contract\",\n    title: \"合同\",\n    permission: \"contract:mgr:look\",\n    path: \"/contract\",\n  },\n  {\n    key: \"payment\",\n    title: \"付款信息\",\n    permission: \"payment:mgr:look\",\n    path: \"/payment\",\n  },\n  {\n    key: \"invoice-center\",\n    title: \"开票\",\n    permission: \"client:invoice:center\",\n    path: \"/invoice-center\",\n  },\n  {\n    key: \"invoice-manage\",\n    title: \"发票管理\",\n    permission: \"client:invoice:manager\",\n    path: \"/invoice-manage\",\n  },\n  {\n    key: \"setting\",\n    title: \"设置\",\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`,\n    scope: [{\n    name: \"_Navigation\",\n    packageName: \"@components/Navigation\",\n    component: component_91\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_92\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    code: `const { default: Navigation } = _Navigation;\nconst { PureGlobal } = global;\n\nconst menuList = [\n  {\n    key: \"client\",\n    title: \"客户\",\n    path: \"/client\",\n    permission: \"client:client:look\",\n  },\n  {\n    key: \"position\",\n    title: \"职位\",\n    path: \"/position\",\n    permission: \"jd:job:look\",\n  },\n  {\n    key: \"ats\",\n    title: \"招聘流程\",\n    path: \"/ats\",\n  },\n  {\n    key: \"talent\",\n    title: \"人才库\",\n    permission: \"cv:cv:look\",\n    path: \"/talent\",\n  },\n  {\n    key: \"contract\",\n    title: \"合同\",\n    permission: \"contract:mgr:look\",\n    path: \"/contract\",\n  },\n  {\n    key: \"payment\",\n    title: \"付款信息\",\n    permission: \"payment:mgr:look\",\n    path: \"/payment\",\n  },\n  {\n    key: \"invoice-center\",\n    title: \"开票\",\n    permission: \"client:invoice:center\",\n    path: \"/invoice-center\",\n  },\n  {\n    key: \"invoice-manage\",\n    title: \"发票管理\",\n    permission: \"client:invoice:manager\",\n    path: \"/invoice-manage\",\n  },\n  {\n    key: \"setting\",\n    title: \"设置\",\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`,\n    scope: [{\n    name: \"_Navigation\",\n    packageName: \"@components/Navigation\",\n    component: component_91\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_92\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    code: `const { useState } = React;\nconst { PureGlobal } = global;\nconst { default: Navigation } = _Navigation;\nconst { Checkbox, Space } = antd;\n\nconst menuList = [\n  {\n    key: \"client\",\n    title: \"客户\",\n    path: \"/client\",\n    permission: \"client:client:look\",\n  },\n  {\n    key: \"position\",\n    title: \"职位\",\n    path: \"/position\",\n    permission: \"jd:job:look\",\n  },\n  {\n    key: \"ats\",\n    title: \"招聘流程\",\n    path: \"/ats\",\n  },\n  {\n    key: \"talent\",\n    title: \"人才库\",\n    permission: \"cv:cv:look\",\n    path: \"/talent\",\n  },\n  {\n    key: \"contract\",\n    title: \"合同\",\n    permission: \"contract:mgr:look\",\n    path: \"/contract\",\n  },\n  {\n    key: \"payment\",\n    title: \"付款信息\",\n    permission: \"payment:mgr:look\",\n    path: \"/payment\",\n  },\n  {\n    key: \"invoice-center\",\n    title: \"开票\",\n    permission: \"client:invoice:center\",\n    path: \"/invoice-center\",\n  },\n  {\n    key: \"invoice-manage\",\n    title: \"发票管理\",\n    permission: \"client:invoice:manager\",\n    path: \"/invoice-manage\",\n  },\n  {\n    key: \"setting\",\n    title: \"设置\",\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`,\n    scope: [{\n    name: \"_Navigation\",\n    packageName: \"@components/Navigation\",\n    component: component_91\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_93\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_92\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_12 from '@components/Descriptions';\nconst readmeConfig = {\n    name: `Descriptions`,\n    summary: `<h3>何时使用</h3>\n<p>常见于详情页的信息展示</p>\n<h3>特点</h3>\n<ul>\n<li>最多支持两列数据展示，多余的列将不展示</li>\n<li>支持Features控制列内容开启和关闭</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>详情数据源，内部每个数组为一行数据，每行数据中每个对象为一列数据，每行最多包含2列内容，多余的会被丢弃</td>\n<td>array[[{display,label,content,featureId}]]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{display}]]</td>\n<td>数据是否展示,当为function时可以接收到(item,dataSource)参数，item为当前项配置，dataSource为整个组件的dataSource配置</td>\n<td>boolean,function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>dataSource[[{label}]]</td>\n<td>数据展示的label</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{content}]]</td>\n<td>数据展示的内容</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[[{featureId}]]</td>\n<td>Features控制的id，参考Features组件的id参数</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Descriptions_8bc84`,\n        style: ``,\n        list: [{\n    title: `展示一个信息详情`,\n    description: `展示一个信息详情`,\n    code: `const { default: Descriptions } = _Descriptions;\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: \"客户名称\", content: \"腾讯\" },\n          {\n            label: \"发票抬头\",\n            content: \"腾讯科技公司\",\n          },\n        ],\n        [\n          { label: \"发票类型\", content: \"增值税专用发票\" },\n          {\n            label: \"发票开具日期\",\n            content: \"2022-08-15\",\n          },\n        ],\n        [{ label: \"退票金额\", content: \"22000.00元\" }],\n        [\n          {\n            label: \"发票号\",\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: \"是否需要重开发票\", content: \"否\" },\n          {\n            label: \"是否涉及金融变动\",\n            content: \"否\",\n          },\n        ],\n        [\n          { label: \"是否造成实质损失\", content: \"否\" },\n          { label: \"责任归属\", content: \"客户原因\" },\n        ],\n        [\n          {\n            label: \"退票原因\",\n            content: \"退票原因的描述退票原因的描述退票原因的描\",\n          },\n        ],\n        [{ label: \"附件\", content: \"附件名称\" }],\n        [\n          { label: \"操作时间\", content: \"2022-08-01 16:32\" },\n          {\n            label: \"操作人\",\n            content: \"西西歪\",\n          },\n        ],\n        [\n          {\n            label: \"超长内容\",\n            content:\n              \"超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容\",\n          },\n          {\n            label: \"超长英文\",\n            content:\n              \"aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa\",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Descriptions\",\n    packageName: \"@components/Descriptions\",\n    component: component_12\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_61 from '@components/Icon';\nimport * as component_62 from 'antd';\nimport * as component_63 from '@kne/react-fetch';\nimport * as component_64 from '@components/Global';\nimport * as component_65 from 'axios';\nimport * as component_66 from '@kne/remote-loader';\nconst readmeConfig = {\n    name: `Icon`,\n    summary: `<p>可以显示一个图标，图标必须在字体文件中被定义过</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>图标类型，参考示例下的字符串</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>colorful</td>\n<td>是否是彩色图标</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>prefix</td>\n<td>图标前缀</td>\n<td>string</td>\n<td>\"\"</td>\n</tr>\n<tr>\n<td>size</td>\n<td>图标大小</td>\n<td>number</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Icon_81743`,\n        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}`,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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>调整大小:</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`,\n    scope: [{\n    name: \"_Icon\",\n    packageName: \"@components/Icon\",\n    component: component_61\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_62\n},{\n    name: \"ReactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_63\n},{\n    name: \"Global\",\n    packageName: \"@components/Global\",\n    component: component_64\n},{\n    name: \"_axios\",\n    packageName: \"axios\",\n    component: component_65\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_66\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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>调整大小:</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`,\n    scope: [{\n    name: \"_Icon\",\n    packageName: \"@components/Icon\",\n    component: component_61\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_62\n},{\n    name: \"ReactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_63\n},{\n    name: \"Global\",\n    packageName: \"@components/Global\",\n    component: component_64\n},{\n    name: \"_axios\",\n    packageName: \"axios\",\n    component: component_65\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_66\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_81 from '@components/Menu';\nimport * as component_82 from 'antd';\nconst readmeConfig = {\n    name: `Menu`,\n    summary: `<p>支持远程加载数据的菜单</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Menu_b6154`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"父级标题1\",\n          key: \"p-0\",\n          iconType: \"icon-zhanghaodenglu\",\n          children: [\n            {\n              label: \"子标题1\",\n              key: \"s-0\",\n            },\n            {\n              label: \"子标题2\",\n              key: \"s-1\",\n            },\n          ],\n        },\n        {\n          label: \"父级标题2\",\n          key: \"p-1\",\n          iconType: \"icon-zhanghaodenglu\",\n          children: [\n            {\n              label: \"子标题1\",\n              key: \"s-2\",\n            },\n            {\n              label: \"子标题2\",\n              key: \"s-3\",\n            },\n          ],\n        },\n        {\n          label: \"父级标题3\",\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: \"父级标题1\",\n              iconType: \"icon-zhanghaodenglu\",\n              children: [\n                {\n                  label:\n                    \"子标题1超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长子标题1超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长子标题1超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长子标题1超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级\",\n                  path: \"/link1\",\n                },\n                {\n                  label: \"子标题2\",\n                  path: \"/link2\",\n                },\n              ],\n            },\n            {\n              label: \"父级标题2\",\n              iconType: \"icon-zhanghaodenglu\",\n              children: [\n                {\n                  label: \"子标题1\",\n                  path: \"/link3\",\n                },\n                {\n                  label: \"子标题2\",\n                  path: \"/link4\",\n                },\n              ],\n            },\n            {\n              label: \"父级标题3\",\n              iconType: \"icon-zhanghaodenglu\",\n              fetchOptions: {\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        {\n                          label: \"子标题1\",\n                          path: \"/link5\",\n                        },\n                        {\n                          label: \"子标题2\",\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: \"子标题1\",\n            key: \"s-0\",\n            path: \"/link1\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题2\",\n            key: \"s-1\",\n            path: \"/link2\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题1\",\n            key: \"s-2\",\n            path: \"/link3\",\n          },\n          {\n            iconType: \"icon-zhanghaodenglu\",\n            label: \"子标题2\",\n            key: \"s-3\",\n            path: \"/link4\",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        items={[\n          {\n            label: \"父级标题1\",\n            key: \"p-0\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-0\",\n                path: \"/link1\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-1\",\n                path: \"/link2\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题2\",\n            key: \"p-1\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                key: \"s-2\",\n                path: \"/link3\",\n              },\n              {\n                label: \"子标题2\",\n                key: \"s-3\",\n                path: \"/link4\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题3\",\n            key: \"p-2\",\n            iconType: \"icon-zhanghaodenglu\",\n            path: \"/link5\",\n          },\n        ]}\n      />\n      <Menu\n        allowCollapsed={false}\n        defaultItems={[\n          {\n            label: \"父级标题1\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                path: \"/link1\",\n              },\n              {\n                label: \"子标题2\",\n                path: \"/link2\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题2\",\n            iconType: \"icon-zhanghaodenglu\",\n            children: [\n              {\n                label: \"子标题1\",\n                path: \"/link3\",\n              },\n              {\n                label: \"子标题2\",\n                path: \"/link4\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题3\",\n            iconType: \"icon-zhanghaodenglu\",\n            fetchOptions: {\n              loader: () => {\n                return new Promise((resolve) => {\n                  setTimeout(() => {\n                    resolve([\n                      {\n                        label: \"子标题1\",\n                        path: \"/link5\",\n                      },\n                      {\n                        label: \"子标题2\",\n                        path: \"/link6\",\n                      },\n                    ]);\n                  }, 1000);\n                });\n              },\n            },\n          },\n        ]}\n      />\n      <Menu\n        defaultItems={[\n          {\n            label: \"父级标题1\",\n            children: [\n              {\n                label: \"子标题1\",\n                path: \"/link1\",\n              },\n              {\n                label: \"子标题2\",\n                path: \"/link2\",\n              },\n            ],\n          },\n          {\n            label: \"父级标题2\",\n            children: [\n              {\n                label: \"子标题1\",\n                path: \"/link3\",\n              },\n              {\n                label: \"子标题2\",\n                path: \"/link4\",\n              },\n            ],\n          },\n        ]}\n      />\n      <ControlMenu />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Menu\",\n    packageName: \"@components/Menu\",\n    component: component_81\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_82\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","const message = {\n    ButtonText: \"confirm\"\n};\n\nexport default message;","const message = {\n    ButtonText: \"确定\"\n};\n\nexport default message;","import * as component_72 from '@components/Intl';\nimport * as component_73 from '@components/Global';\nimport * as component_74 from 'antd';\nimport * as component_75 from '@components/Intl/doc/locale/en-US';\nimport * as component_76 from '@components/Intl/doc/locale/zh-CN';\nconst readmeConfig = {\n    name: `Intl`,\n    summary: `<p>支持系统国际化</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Intl_51734`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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=\"按钮\" id=\"ButtonText\">\n                    {text => <div>{text}</div>}\n                </FormattedMessage>\n            </IntlProvider>\n\n        </PureGlobal>\n    </Space>);\n};\n\nrender(<BaseExample/>);\n\n`,\n    scope: [{\n    name: \"_Intl\",\n    packageName: \"@components/Intl\",\n    component: component_72\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_73\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_74\n},{\n    name: \"localeEN\",\n    packageName: \"@components/Intl/doc/locale/en-US\",\n    component: component_75\n},{\n    name: \"localeCN\",\n    packageName: \"@components/Intl/doc/locale/zh-CN\",\n    component: component_76\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_27 from '@components/File';\nimport * as component_28 from '@components/Global';\nimport * as component_29 from '@kne/remote-loader';\nimport * as component_30 from 'lodash';\nimport * as component_31 from 'antd';\nconst readmeConfig = {\n    name: `File`,\n    summary: `<p>提供文件展示，OSS文件id转换访问地址，文件列表，下载等操作</p>\n<p>注意：</p>\n<ul>\n<li>如果需要显示或者转换oss id的文件，需要Global的preset apis设置过oss接口或者传入apis.oss参数，oss返回访问地址</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>如果文件为oss文件，传入ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>如果文件为普通文件地址，传入该参数</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>加载文件失败展示组件</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>通过oss id获取oss文件地址接口{oss} oss为一个@kne/react-fetch参数，如果Global的preset已设置该值，切当前组件也需要应用该值时可以不传</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>加载文件loading过程中显示组件</td>\n<td>jsx</td>\n<td>null</td>\n</tr>\n</tbody>\n</table>\n<h4>Download</h4>\n<p>下载文件按钮</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>下载文件的文件名</td>\n<td>string</td>\n<td>未命名下载文件</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>下载成功回调函数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>下载失败回调函数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>如果文件为oss文件，传入ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>url</td>\n<td>如果文件为普通文件地址，传入该参数</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>通过oss id获取oss文件地址接口{oss} oss为一个@kne/react-fetch参数，如果Global的preset已设置该值，切当前组件也需要应用该值时可以不传</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>List</h4>\n<p>显示文件列表，可以带有编辑文件名称，文件预览，文件删除等功能</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>文件列表</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:文件的id，一般为ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].type</td>\n<td>文件状态为uploading时该行文件展示为loading状态</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].filename</td>\n<td>文件名</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].date</td>\n<td>文件上传日期</td>\n<td>Date,date timestamp</td>\n<td>-</td>\n</tr>\n<tr>\n<td>dataSource[].userName</td>\n<td>文件上传人</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getPermission</td>\n<td>获取操作权限，会在render每条数据时调用，获取到参数列表[type,itemData],type:preview预览,edit编辑,download下载，返回false为没有权限，其他情况为有权限</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>是否开启预览功能，和getPermission type:preview预览结果同事控制，全都判断通过才能开启预览功能</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>infoItemRenders</td>\n<td>自定义列</td>\n<td>array[{span,render}]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>infoItemRenders[].span</td>\n<td>当前列栅格数</td>\n<td>number</td>\n<td>4</td>\n</tr>\n<tr>\n<td>infoItemRenders[].render</td>\n<td>render函数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>用于操作的api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>文件名编辑回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>文件预览回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>文件删除回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>OptionButtons</h4>\n<p>文件操作按钮，可以带有编辑文件名称，文件预览，文件删除等功能</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>apis</td>\n<td>用于操作的api</td>\n<td>object{onEdit,onPreview,onDelete}</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onEdit</td>\n<td>文件名编辑回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onPreview</td>\n<td>文件预览回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis.onDelete</td>\n<td>文件删除回调接口</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>hasPreview</td>\n<td>是否开启预览功能，和getPermission type:preview预览结果同事控制，全都判断通过才能开启预览功能</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n</tbody>\n</table>\n<h4>FileLink</h4>\n<p>外观类似Link的组件，点击后可以弹出文件预览框</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>title</td>\n<td>弹窗标题</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>id</td>\n<td>文件oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>originName</td>\n<td>文件名称</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>通过oss id获取oss文件地址接口{oss} oss为一个@kne/react-fetch参数，如果Global的preset已设置该值，切当前组件也需要应用该值时可以不传</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>openDownload</td>\n<td>是否开启文件下载</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal的其他参数，参考Modal组件</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>downloadBlobFile(target, filename)</h4>\n<p>下载文件的方法</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>target</td>\n<td>下载链接地址,或者二进制数据</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>下载后的文件名</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>生成下载文件function的hooks，带有下载中的状态控制</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>id</td>\n<td>文件ossId</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>下载后的文件名</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onError</td>\n<td>下载失败回调</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>下载成功回调</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>通过oss id获取oss文件地址接口{oss} oss为一个@kne/react-fetch参数，如果Global的preset已设置该值，切当前组件也需要应用该值时可以不传</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isLoading</td>\n<td>是否正在下载中</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>download</td>\n<td>执行该方法开始下载</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>others</td>\n<td>其他@kne/react-fetch useFetch参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>modal = useFileModal()</h4>\n<p>文件预览弹框方法生成的hooks</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>modal</td>\n<td>执行后弹出文件预览弹窗</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>弹窗标题</td>\n<td>string,jsx</td>\n<td>originName</td>\n</tr>\n<tr>\n<td>modal({id})</td>\n<td>文件oss id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({originName})</td>\n<td>文件名称</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({apis})</td>\n<td>通过oss id获取oss文件地址接口{oss} oss为一个@kne/react-fetch参数，如果Global的preset已设置该值，切当前组件也需要应用该值时可以不传</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modal({openDownload})</td>\n<td>是否开启文件下载</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>modal的其他参数，参考Modal组件</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `File_0b279`,\n        style: ``,\n        list: [{\n    title: `获取文件地址`,\n    description: `通过一个ossId获取文件地址`,\n    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`,\n    scope: [{\n    name: \"_File\",\n    packageName: \"@components/File\",\n    component: component_27\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_28\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_29\n}]\n},{\n    title: `文件下载`,\n    description: `展示文件下载`,\n    code: `const { Download } = _File;\nconst { PureGlobal } = global;\nconst { getPublicPath } = remoteLoader;\nconst BaseExample = () => {\n  return (\n    <Download\n      id=\"123\"\n      filename=\"下载的文件\"\n      onSuccess={() => {\n        console.log(\"下载成功\");\n      }}\n    >\n      文件下载\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`,\n    scope: [{\n    name: \"_File\",\n    packageName: \"@components/File\",\n    component: component_27\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_28\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_29\n}]\n},{\n    title: `文件列表`,\n    description: `展示文件列表`,\n    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: \"张三的简历.doc\",\n          },\n          {\n            id: \"xxxxx\",\n            filename: \"我是一份简历.pdf\",\n            date: \"2022-07-15T11:09:15.000+08:00\",\n            userName: \"用户名\",\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`,\n    scope: [{\n    name: \"_FileList\",\n    packageName: \"@components/File\",\n    component: component_27\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_30\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_28\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_31\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_29\n}]\n},{\n    title: `文件链接`,\n    description: `展示文件链接`,\n    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=\"我是一个图片.jpg\" />\n      <FileLink id=\"02\" originName=\"我是一个网页.html\" />\n      <FileLink id=\"03\" originName=\"我是一个pdf.pdf\" />\n      <CustomButton id=\"03\" originName=\"我是一个pdf.pdf\" />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_File\",\n    packageName: \"@components/File\",\n    component: component_27\n},{\n    name: \"remoteLoader\",\n    packageName: \"@kne/remote-loader\",\n    component: component_29\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_28\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_31\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_99 from '@components/StateTag';\nimport * as component_100 from '@components/Descriptions';\nimport * as component_101 from 'lodash';\nimport * as component_102 from 'antd';\nimport * as component_103 from '@components/Global';\nconst readmeConfig = {\n    name: `StateTag`,\n    summary: `<p>用于展示标签</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>tag的类型，类型决定显示的颜色</td>\n<td>'default'(#666666)、'skill'(#666666)(此时边框颜色为 #EEEEEE)、'success'(#027A48)、'progress'(#F09700)、'danger'(#D14343)、'info'(#155ACF)、'other'(#6740C3)(待定颜色)、'result'(#666666)、'filterResult'(#5CB8B2)</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>showBorder</td>\n<td>是否展示边框</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>showBackground</td>\n<td>是否展示背景色</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>text</td>\n<td>tag文案</td>\n<td>string</td>\n<td>''</td>\n</tr>\n<tr>\n<td>filterName</td>\n<td>tag类型为“filterResult”时显示在前边的文案</td>\n<td>string</td>\n<td>''</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数参考 <a href=\"https://ant.design/components/tag-cn\">antd Tag.Tag</a></p>`,\n    example: {\n        isFull: true,\n        className: `StateTag_cfeaa`,\n        style: ``,\n        list: [{\n    title: `基本示例`,\n    description: `状态标签`,\n    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>使用场景: 列表页Table,简历详情页</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: \"使用规则\", content: \"待XX，暂停\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"info\", text: \"待提交开票\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"info\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"XX中，正在XX中\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"progress\", text: \"退票审核中\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"progress\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"通过，成功，完成\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"success\", text: \"标签内容\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"success\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"不通过，失败，淘汰，缺席，拒绝\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"danger\", text: \"退票拒绝\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"danger\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"取消，撤销，停止\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"default\", text: \"撤销开票审核\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"default\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"（暂时还未用到）\" },\n            {\n              label: \"示例\",\n              content: (\n                <Space>\n                  <StateTag {...{ type: \"other\", text: \"标签内容\" }} />\n                  <Typography.Text\n                    copyable={{\n                      text: '<StateTag type=\"other\" text=\"标签内容\" />',\n                    }}\n                  />\n                </Space>\n              ),\n            },\n          ],\n        ]}\n      />\n      <br />\n      <br />\n      <div>个别特殊场景（需要单独询问UI):</div>\n      <br />\n      <Descriptions\n        dataSource={[\n          [\n            { label: \"使用规则\", content: \"待XX，暂停\" },\n            {\n              label: \"示例\",\n              content: (\n                <div>\n                  <StateTag {...{ type: \"success\", text: \"已推荐简历\" }} />\n                  <StateTag {...{ type: \"success\", text: \"已退票\" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"已XX待XX\" },\n            {\n              label: \"示例\",\n              content: (\n                <div>\n                  <StateTag {...{ type: \"success\", text: \"已开票待寄出\" }} />\n                  <StateTag {...{ type: \"success\", text: \"已待寄待收款\" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            {\n              label: \"使用规则\",\n              content: \"已XX+词语：根据后面的词语语义进行判断\",\n            },\n            {\n              label: \"示例\",\n              content: (\n                <div>\n                  <StateTag {...{ type: \"success\", text: \"已成功\" }} />\n                  <StateTag {...{ type: \"default\", text: \"已取消\" }} />\n                  <StateTag {...{ type: \"danger\", text: \"已失败\" }} />\n                  <StateTag {...{ type: \"progress\", text: \"已暂停\" }} />\n                </div>\n              ),\n            },\n          ],\n          [\n            { label: \"使用规则\", content: \"完全根据语义语境判断\" },\n            {\n              label: \"示例\",\n              content: (\n                <div>\n                  <StateTag {...{ type: \"success\", text: \"全部到款\" }} />\n                  <StateTag {...{ type: \"success\", text: \"部分到款\" }} />\n                  <StateTag {...{ type: \"success\", text: \"简历亮点\" }} />\n                  <StateTag {...{ type: \"danger\", text: \"简历风险点\" }} />\n                </div>\n              ),\n            },\n          ],\n        ]}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_99\n},{\n    name: \"_Descriptions\",\n    packageName: \"@components/Descriptions\",\n    component: component_100\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_101\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_102\n}]\n},{\n    title: `基本示例`,\n    description: `技能标签`,\n    code: `const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={\"技能标签\"}\n        type={\"skill\"}\n        showBorder\n        showBackground={false}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_99\n}]\n},{\n    title: `基本示例`,\n    description: `下拉菜单、弹窗中已选结果标签`,\n    code: `const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        text={\"技能标签\"}\n        type={\"result\"}\n        showBackground={false}\n        closable\n        onClose={() => console.log(\"close\")}\n      />\n      <StateTag\n        text={\"技能标签\"}\n        type={\"result\"}\n        closable\n        onClose={() => console.log(\"close\")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_99\n}]\n},{\n    title: `基本示例`,\n    description: `筛选组件中筛选结果标签`,\n    code: `const { default: StateTag } = _StateTag;\n\nconst BaseExample = () => {\n  return (\n    <div>\n      <StateTag\n        filterName={\"BD\"}\n        text={\"陈枫林，王晓晨\"}\n        type={\"filterResult\"}\n        closable\n        onClose={() => console.log(\"close\")}\n      />\n      <br />\n      <StateTag\n        filterName={\"添加人\"}\n        text={\"陈枫林，王晓晨，陈路，张力\"}\n        type={\"filterResult\"}\n        closable\n        onClose={() => console.log(\"close\")}\n      />\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_99\n}]\n},{\n    title: `基本示例`,\n    description: `枚举状态标签`,\n    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: \"第一项\", type: 'success' },\n                  { value: \"2\", description: \"第二项\", type: 'danger' },\n                  { value: \"3\", description: \"第三项\", 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`,\n    scope: [{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_99\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_102\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_103\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_13 from '@components/Drawer';\nimport * as component_14 from '@components/Global';\nimport * as component_15 from '@components/Content';\nimport * as component_16 from 'antd';\nimport * as component_17 from 'lodash';\nconst readmeConfig = {\n    name: `Drawer`,\n    summary: `<p>屏幕边缘滑出的浮层面板</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>footer</td>\n<td>弹窗的footer，当其被显式设置成null且footerButtons没有设置过时弹窗不显示footer。当它类型为function时可以得到close方法和withDecorator设置的props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>footerButtons</td>\n<td>弹窗footer的按钮区，默认为确认和取消按钮，默认按钮分别响应onConfirm和onCancel方法，如果自定义设置footerButtons则需要自行传入onClick参数，onConfirm和onCancel方法将不生效</td>\n<td>array</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>弹窗关闭时调用，弹窗受控时由该方法将外部open状态修改</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onConfirm</td>\n<td>当footerButtons未自定义设置时点击确认按钮触发执行该方法，当其返回Promise点击后Promise，resolve之前确认按钮显示为loading状态，返回值为false或者Promise的resolve值为false时弹窗不会被关闭，其他情况弹窗默认关闭</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>和onConfirm类似，其为点击取消按钮触发</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>弹窗内容，可以为jsx或者function，为function时可以接收到close和withDecorator设置的props</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>withDecorator</td>\n<td>弹窗修饰器，会接收到弹窗children的render方法，可以在其外部添加修饰内容后执行render方法，给render方法传入的值可以在children,footer,rightOptions类型为function时接收到对应的参数</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>maskClosable</td>\n<td>点击蒙层是否允许关闭</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数参考antd Drawer组件</p>\n<h3>AppDrawer</h3>\n<p>全局抽屉包裹组件，提供消费上下文的默认环境，提供可消费 React context 的 drawer 的静态方法，可以简化 useDrawer 等方法需要手动植入 contextHolder 的问题。</p>\n<h3>useDrawer</h3>\n<p>获取一个执行后可以弹出一个Drawer组件的方法,前置条件是需要再全局注入AppDrawer包裹组件</p>\n<h4>return:drawer</h4>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>drawer</td>\n<td>执行后可以弹出一个Drawer弹窗，参数同Drawer组件参数</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>DrawerButton</h3>\n<p>点击以后可以执行获取数据，在数据未返回时按钮展示为loading状态，数据返回后弹出Drawer弹窗</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch 所需参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>drawerProps</td>\n<td>同Drawer参数,当它为function时，执行function后返回的值作为drawerProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数同antd Button 组件</p>`,\n    example: {\n        isFull: false,\n        className: `Drawer_9b1ed`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"内容1\",\n            content:\n              \"内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1\",\n          },\n          {\n            label: \"内容2\",\n            content:\n              \"内容2内容2内内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2内容2容2内容2内容2内容2内容2内容2\",\n          },\n          { label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\n          },\n          { label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\n          },\n          { label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\n          },\n          { label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\n          },\n          { label: \"内容1\", content: \"内容1内容1内容1内容1内容1内容1内容1\" },\n          {\n            label: \"内容2\",\n            content: \"内容2内容2内容2内容2内容2内容2内容2内容2\",\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 组件打开\n      </Button>\n      <Button\n        onClick={() => {\n          drawer({\n            title: \"标题\",\n            children: \"打开了一个抽屉\",\n          });\n        }}\n      >\n        hook 打开\n      </Button>\n      <DrawerButton\n        api={api}\n        modalProps={({ data }) => {\n          return {\n            title: \"加载数据的弹窗\",\n            children: <Content list={data} col={1} />,\n          };\n        }}\n      >\n        按钮点击加载数据\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`,\n    scope: [{\n    name: \"_Drawer\",\n    packageName: \"@components/Drawer\",\n    component: component_13\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_14\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_15\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_16\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_17\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_89 from '@components/LoadingButton';\nimport * as component_90 from 'antd';\nconst readmeConfig = {\n    name: `LoadingButton`,\n    summary: `<h3>何时使用</h3>\n<p>当点击按钮时，需要显示loading状态，当然你可以使用antd Button的loading属性，但是这样你需要自己声明一个state来控制，LoadingButton组件可以帮你做好这件事情</p>\n<h3>特点</h3>\n<p>通过onClick返回的Promise来控制Button的loading状态</p>\n<p>children除了可以传正常的jsx以外还接受function参数，可以接收到loading状态以便根据loading状态显示不同文案</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>onClick</td>\n<td>点击按钮触发函数，可以返回一个Promise，当Promise再pending状态时Button将自动处于loading状态，当Promise返回结果会自动从loading切换回普通状态</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>children</td>\n<td>Button的子元素，可以为jsx或者function，为function时可以接收到loading状态用来切换显示内容</td>\n<td>jsx,function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `LoadingButton_cd4ed`,\n        style: ``,\n        list: [{\n    title: `带有加载状态按钮`,\n    description: `点击按钮切换到加载状态，加载方法完成后自动切换为普通状态`,\n    code: `const { default: LoadingButton } = _LoadingButton;\nconst { Space, message } = antd;\n\nconst clickHandler = () => {\n  message.success(\"点击按钮1s后完成加载\");\n  return new Promise((resolve) => {\n    setTimeout(() => {\n      message.success(\"完成\");\n      resolve();\n    }, 1000);\n  });\n};\nconst BaseExample = () => {\n  return (\n    <Space wrap>\n      <LoadingButton onClick={clickHandler}>按钮</LoadingButton>\n      <LoadingButton onClick={clickHandler}>\n        {(isLoading) => (isLoading ? \"正在加载中...\" : \"切换加载文案\")}\n      </LoadingButton>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_LoadingButton\",\n    packageName: \"@components/LoadingButton\",\n    component: component_89\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_90\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_4 from '@components/Common';\nimport * as component_5 from 'antd';\nimport * as component_6 from '@kne/react-fetch';\nimport * as component_7 from 'lodash';\nconst readmeConfig = {\n    name: `Common`,\n    summary: `<p>为组件库提供通用的组件、方法、hooks</p>\n<h3>组件</h3>\n<ol>\n<li>FetchButton Button触发加载数据</li>\n<li>ScrollLoader 下拉滚动加载组件</li>\n<li>SearchInput 提供防抖的查询输入框</li>\n<li>SimpleBarBox</li>\n</ol>\n<h3>方法</h3>\n<ol>\n<li>changeMoneyToChinese 将金额转化为大写的人民币金额</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>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Common_d13bc`,\n        style: `.Common_d13bc .scroll-list {\n  max-height: 300px;\n}`,\n        list: [{\n    title: `FetchButton`,\n    description: `这里填写示例说明`,\n    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>我是一个弹窗</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`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n}]\n},{\n    title: `Enum`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n},{\n    name: \"_antd\",\n    packageName: \"antd\",\n    component: component_5\n}]\n},{\n    title: `ScrollLoader`,\n    description: `这里填写示例说明`,\n    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: \\`第\\${key + 1}项\\`,\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`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n},{\n    name: \"_reactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_6\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_7\n}]\n},{\n    title: `SearchInput`,\n    description: `搜索框`,\n    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`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n}]\n},{\n    title: `AdvancedSelect`,\n    description: `高级选择`,\n    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=\"人\"\n        allLabel=\"所有人\"\n        showSelectedTag={false}\n        api={{\n          loader: () => {\n            return {\n              pageData: [\n                {\n                  label: \"用户一\",\n                  value: 1,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户二\",\n                  value: 2,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户三\",\n                  value: 3,\n                  description: \"我是用户描述\",\n                },\n              ],\n            };\n          },\n        }}\n        onChange={(value) => {\n          console.log(value);\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_5\n}]\n},{\n    title: `SuperSelect`,\n    description: `新版高级选择`,\n    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: \"用户一\",\n                  value: 1,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户二\",\n                  value: 2,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户三\",\n                  value: 3,\n                  description: \"我是用户描述\",\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: \"用户一\",\n                  value: 1,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户二\",\n                  value: 2,\n                  description: \"我是用户描述\",\n                },\n                {\n                  label: \"用户三\",\n                  value: 3,\n                  description: \"我是用户描述\",\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: \\`名称\\${key + 1}\\`,\n            count: key + 1,\n            description: \\`描述\\${key + 1}\\`,\n            disabled: key === 1,\n          };\n        })}\n        columns={[\n          {\n            name: \"name\",\n            title: \"名称\",\n            span: 8,\n          },\n          {\n            name: \"count\",\n            title: \"数量\",\n            span: 8,\n          },\n          {\n            name: \"description\",\n            title: \"描述\",\n            span: 8,\n          },\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Common\",\n    packageName: \"@components/Common\",\n    component: component_4\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_5\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_45 from '@components/FormInfo';\nimport * as component_46 from '@components/Global';\nimport * as component_47 from '@components/Modal';\nimport * as component_48 from 'lodash';\nimport * as component_49 from 'antd';\nimport * as component_50 from '@kne/react-fetch';\nimport * as component_51 from '@components/Content';\nimport * as component_52 from '@components/Icon';\nimport * as component_53 from 'dayjs';\nconst readmeConfig = {\n    name: `FormInfo`,\n    summary: `<p>表单控件，自带数据域管理。包含数据录入、校验以及对应样式</p>\n<h3>何时使用</h3>\n<ul>\n<li>用于创建或编辑一个实体或收集信息</li>\n<li>需要对输入的数据类型进行校验时</li>\n</ul>\n<h3>概念</h3>\n<ul>\n<li>Form Data：\nForm提交时获取到的输出值通常用来提交给后端，不包含Form的校验信息，只包含Form组件可以向外部提供的数据输出信息。</li>\n<li>Form State：\nForm中用来存储一切状态的值，包含Field信息，校验信息，Form的值（需要一定的转换从才能变成Form Data），表单是否验证通过，表单错误信息等值。</li>\n<li>字段或称Field：\nForm中的一个项，必须拥有参数name,label,可选参数rule。name作为Form提交时获取到data的key值。\nlabel为字段展示给用户的名字以及字段报错时提示用户错误的语句中指代该字段的名字。\nrule为下方介绍的RULE。\n一个Field的取值可以是简单的Number，Boolean，String也可以是复杂的Array，Object等，所以在考虑一些值需要分成多个Field还是集中在一个Field时非常重要的。\n一个通用的规则是：<em><strong>对于Form来说，它的最小校验单元是一个Field</strong></em>。</li>\n<li>Field组件：\nField组件是Field的一部分，可以由用户自己实现也可以由组件库提供，通过Form提供的Field hooks将其变成Field。\nfield hooks主要接管Field组件的value，onChange参数，用来把Field组件的值获取到Form管理。Field组件必须为<em><strong>受控组件</strong></em>。\nfield hooks还会接管triggerValidate，用来获取Field的校验时机。field hooks会向Field组件提供Field的校验状态和校验错误信息。</li>\n<li>RULE：\n用于字段的校验。RULE可以为一个function或者正则表达式，不过推荐以大写字符串调用。\n字符串形式的RULE以空格为间隔可以传入多条规则，如：\"REQ TEL\"，\n执行校验时会从左至右依次校验，如果左侧的规则校验失败则不再执行其右侧规则，返回校验失败状态及该规则失败原因提示作为字段校验失败原因。\n字符串RULE允许传入参数，参数以中划线隔开，可传入多个参数，如：\"LEN-3-10\"。\n字符串RULE使用前必须在Form组件中有所声明，Form的RULE声明有3个级别：\n默认级，包含于Form内部，提供了一些基本的校验规则。preset级：在项目的preset中声明，应该把项目中常用的或者是比较复杂的RULE声明集中维护于此。\nForm级：以rules参数传入Form组件，主要是某Form单独使用的RULE。\n如果声明字符相同，会以 Form级&gt;preset级&gt;默认级 进行覆盖。\nRULE声明为一个对象，key和去掉参数的字符串RULE相同，value为一个function称为校验函数。此function接收到的参数有三部分(\nvalue,[...args]\n,{data,{field}}),第一个参数value为当前字段的值，最后一个参数为form的状态，data是form的当前值，field是form里面当前字段的信息，\n中间参数args为字符串参数如：\"LEN-3-10\"会接收到3和20两个参数。校验函数返回{result,errMsg}，\n或者一个Promise.resolve({result,errMsg})的Promise对象。result为校验是否通过，errMsg为失败提示，失败提示可以用%s占位，展示时会替换成字段的label。</li>\n<li>校验或称Validate：\nForm会在Field组件执行triggerValidate时执行当前Field的Validate，表单提交时执行所有Field的Validate。\nValidate会串行执行RULE里面的所有规则的校验函数，校验函数返回Promise时也会等待左边的校验函数的Promise完成再执行右边的规则校验函数。\n表单提交时，正在执行异步的校验函数的Field将不会重复执行Validate。表单提交时所有Field的校验状态为通过时才会执行onSubmit方法，否则会执行onError方法，\nonPrevSubmit方法在用户点击提交按钮时就会触发，不管Validate结果是否为通过。</li>\n<li>Event：\nForm采用了事件驱动的方式来设计，用以满足多种异步校验，和给Form提供强大的可扩展性。\nForm的API里面可以获取到的emitter就是Form内部的事件发射器，可以触发Form内部定义的事件，也可以自定义一些事件。同时可以通过emitter.addListener监听事件。\nForm内部定义的事件有：\nform-field-add：Field被添加进Form时触发，\nform-field-edit：Field的参数发生改变时触发，\norm-field-remove：Field被卸载时触发，\nform-field-validate：Field执行Validate时触发，\nform-field-data-change：Field的值发生修改时触发，\nform-data-reset：Form组件重置data时触发，\nform-data-set-field：Form组件给data赋值时触发，\nform-data-set-field-validate：Field被赋值时触发，\nform-validate-all：Form执行全部Field的Validate时触发，一般为表单提交时，\nform-submit：表单提交时触发。</li>\n<li>拦截器或称Interceptor：\n没有Field可以接收一个interceptor参数，字符串类型，和RULE类似可以再preset或者Form的interceptors props中声明以后使用，可以配置多个用空格连接。\n拦截器的作用是，在Field接收到一个新的值时，会串行执行拦截器的output部分，把其返回值输出到Form Data。\n在执行Form Data的赋值操作时把赋值作为输入串行执行拦截器的input部分，把其结果作为Form Data的输入。\n现在有个Field是日期选择，输出Date类型值，但是Form Data输出希望将其格式化为日期字符串，在表单编辑时Form\nData输入格式化后的日期字符串，但是Field只接收Date类型的值，\n以下例子可以来解决此问题：<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=\"日期\" interceptor=\"date-string\"/&gt;\n</code></pre>\n</li>\n<li>Group：\n当Form的data需要接收到一个复杂值的时候，可以使用Group来实现，如：<pre><code class=\"language-jsx\">&lt;Group name=\"baseInfo\"&gt;\n  &lt;Field name=\"name\" label=\"名称\"/&gt;\n  &lt;Field name=\"des\" label=\"说明\"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm的data可以接收到 {baseInfo:{name:\"xxx\",des:\"xxx\"}}，Group的name和Field的name一致时也可以用来表示数组如：<pre><code class=\"language-jsx\">&lt;Group name=\"name\"&gt;\n  &lt;Field name=\"name\" label=\"名称\"/&gt;\n&lt;/Group&gt;\n&lt;Group name=\"des\"&gt;\n  &lt;Field name=\"des\" label=\"说明\"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm的data可以接收到 {name:[\"name1\",\"name2\"],des:[\"des1\",\"des2\"]}。\nGroup可以嵌套，如<pre><code class=\"language-jsx\">&lt;Group name=\"baseInfo\"&gt;\n  &lt;Group name=\"info\"&gt;\n    &lt;Field name=\"name\" label=\"名称\"/&gt;\n  &lt;/Group&gt;\n  &lt;Field name=\"des\" label=\"说明\"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm的data可以接收到 {baseInfo:{info:{name:'xxx'},des:'xxx'}}。\n支持点操作，如：<pre><code class=\"language-jsx\">&lt;Group name=\"baseInfo.info\"&gt;\n  &lt;Field name=\"name\" label=\"名称\"/&gt;\n  &lt;Field name=\"des\" label=\"说明\"/&gt;\n&lt;/Group&gt;\n</code></pre>\nForm的data可以接收到 {baseInfo:{info:{name:'xxx',des:'xxx'}}}。</li>\n<li>GroupList：\n使用Group实现的一个特殊的区域用来更方便的实现多段式的表单如：<pre><code class=\"language-jsx\">&lt;Button onClick={()=&gt;ref.current.onAdd()}&gt;添加&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;删除&lt;/Button&gt;\n    &lt;Field name=\"schoolName\" label=\"学校名称\"/&gt;\n    &lt;Field name=\"degree\" label=\"学历\"/&gt;\n    &lt;Field name=\"des\" label=\"说明\"/&gt;\n  &lt;/&gt;}\n&lt;/GroupList&gt;\n</code></pre>\n以上是一个简历的学历列表的实现，可以点击添加按钮添加多段学历Field，可以点击删除按钮删除当前一段学历Field，\nForm的data可以接收到的 {edu:[{schoolName:'xxx',degree:'xxx',des:'xxx'}]}。\n当然你可以不用使用这样底层的API，FormInfo.List 已经帮你处理好一切。</li>\n</ul>\n<h3>特点</h3>\n<ul>\n<li>集中化校验规则管理，分层抽象，调用简便</li>\n<li>支持异步校验规则</li>\n<li>事件驱动式架构设计，便于扩展</li>\n<li>支持Group及GroupList，可轻松实现复杂表单</li>\n<li>UI，校验逻辑分层抽象，一次封装使用简单</li>\n<li>context和ref双重API暴露，在Form内还是Form外都能轻松获取</li>\n<li>form-helper提供基本的表单封装，灵活组合</li>\n<li>支持拦截器，便捷实现FormData和Field的值之间的转换</li>\n</ul>\n<h3>Field实现规范</h3>\n<ul>\n<li>FormInfo里面的Field都会放置在fields文件夹，其中每个文件夹代表一个Field</li>\n<li>一个Field只能默认导出会被引用，其他的方法枚举等需要放置在默认导出的组件的function的静态属性上</li>\n<li>一个Field的默认导出组件只能被放置在Form中作为Field被使用，它的Field组件会被挂载在默认导出的组件的function的Field静态属性上</li>\n<li>一个Field的Field组件必须支持受控和非受控两种形式</li>\n<li>一个Field的导出必须被包含在FormInfo导出的formModule中和FormInfo中，即：以下两种方法都可以获取到该Field<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>选择器类型Field组件实现规范</h3>\n<ul>\n<li>必须使用SelectInnerInput作为选择器的值显示和触发的输入框</li>\n<li>SelectInnerInput可以通过isPopup提供popup和modal两种展示形态和交互逻辑，Field组件可以通过自身的默认值或者调用SelectInnerInput时显式指定来设置最佳推荐的默认形式，一般情况一种选择器需要良好支持两种形式</li>\n<li>SelectInnerInput可以通过single决定输出值是单项还是多项，单项和多项的交互逻辑也可能不同，SelectInnerInput的内部value state都是使用多项值来处理的，在输入值和在onChange输出时根据参数转化成数组，一般情况一种选择器需要支持两种情况</li>\n<li>选择器可能会在顶部有一个搜索框，通过使用时是否传入getSearchProps来决定搜索框是否显示，在FormInfo/common中提供了默认的SearchInput实现，SelectInnerInput中管理了其searchText和setSearchText状态</li>\n<li>FormInfo/fields/AdvancedSelect/createList.js 实现了一个列表式选择器，实现了包括搜索，下拉加载等逻辑，只需要实现列表渲染逻辑就可以方便的扩展出新的List类型选择器</li>\n<li>通过SelectInnerInput.useContext 可以拿到选择器的用户传入属性（props），值到选项的映射（mapping），搜索框的state（searchText,setSearchText），数据加载器的API（fetchApi）原始value值（valueState），添加映射方法（appendItems）</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</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>同default导出组件</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类型:antd组件</h3>\n<p>以下组件请参考antd具体的组件文档此处不再赘述</p>\n<p>Checkbox,CheckboxGroup,DatePicker,Input,InputNumber,RadioGroup,Select,Switch,TextArea,TimePicker,TreeSelect</p>\n<h3>Field类型:@kne/react-form-antd实现组件</h3>\n<p>DatePickerToday</p>\n<h3>Field类型:components-core实现组件</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>一个Form和Modal组合起来的组件，它预置了Form组件，children传入的内容和footer区域均在Form的context内</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formProps</td>\n<td>同Form组件参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>useFormModal</h3>\n<p>获取一个执行后可以弹出一个FormModal组件的方法</p>\n<h4>return:formModal</h4>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>formModal</td>\n<td>执行后可以弹出一个FormModal弹窗，参数同FormModal组件参数</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>\n<h3>FormModalButton</h3>\n<p>点击以后可以执行获取数据，在数据未返回时按钮展示为loading状态，数据返回后弹出FormModal弹窗</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>@kne/react-fetch 所需参数</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>同FormModal参数,当它为function时，执行function后返回的值作为modalProps</td>\n<td>object,function({data,fetchApi,close})</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<p>其他参数同antd Button 组件</p>`,\n    example: {\n        isFull: true,\n        className: `FormInfo_f344c`,\n        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}`,\n        list: [{\n    title: `一个简单表单示例`,\n    description: `展示了一个简单表单示例`,\n    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: \"英文\", 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重复\", data: {\n                                user: \"我是一个重复的东西\",\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        }}\n        onSubmit={(data) => {\n            modal({\n                title: \"表单提交数据\", children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n            });\n        }}\n    >\n        <FormInfo\n            title=\"基本信息\"\n            list={[<Avatar name=\"avatar\" label=\"头像\" labelHidden block/>, <Avatar\n                name=\"photo\"\n                label=\"证件照\"\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>哈哈哈{validateData.REP.user}</div>;\n                }}\n            >\n                <Input\n                    name=\"name\"\n                    label=\"姓名\"\n                    rule=\"REQ LEN-3-10 REP\"\n                    tips=\"姓名\"\n                />\n            </ErrorTip>, <ColorPicker name=\"color\" label=\"主题色\"/>,\n                <MoneyInput name=\"money\" label=\"金额\" rule=\"REQ\" tips={\"money\"}/>,\n                <PhoneNumber name=\"phone\" label=\"手机\" rule=\"REQ\" disabled/>,\n                <Input name=\"email\" label=\"邮箱\" rule=\"EMAIL\"/>, <Upload name=\"file\" label=\"文件\" tips=\"文件\" block/>,\n                <Rate name=\"rate\" label=\"评分\" tips=\"评分\"/>, <Switch name=\"switch\" label=\"开关\" tips=\"开关\">\n                    {({checked}) => (checked ? \"开\" : \"关\")}\n                </Switch>, <Slider name=\"slider\" label=\"滑动条\" tips=\"滑动条\"/>, <TypeDateRangePicker\n                    name=\"type_date\"\n                    label=\"日期时间段\"\n                    tips=\"日期时间段\"\n                    rule=\"REQ\"\n                />, <SuperSelectTree name=\"tree\" label=\"树选择\" options={[{\n                    value: '1', label: '父节点',\n                }]}/>, <TextArea name=\"des\" label=\"备注\" tips=\"备注\" block/>, <SubmitButton>提交</SubmitButton>,]}\n        />\n    </Form>);\n};\n\nrender(<PureGlobal\n    preset={{\n        locale: \"en-US\", enums: {\n            helperGuide: () => [{\n                value: \"test-from-name\", content: \"测试帮助文档\", 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 + \"简历.pdf\",\n                                },\n                            },\n                        });\n                    }, 1000);\n                });\n            },\n        },\n    }}\n>\n    <BaseExample/>\n</PureGlobal>);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_47\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `多行`,\n    description: `展示了一个多行字段示例`,\n    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: \"表单提交数据\",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <FormInfo\n        list={[\n          <MultiField\n            name=\"no\"\n            label=\"单号\"\n            rule=\"REQ\"\n            field={Input}\n            maxLength={5}\n            tips={\"单号\"}\n          />,\n          <Input name=\"name\" label=\"名称\" />,\n          <MultiField name=\"description\" label=\"说明\" field={TextArea} />,\n        ]}\n      />\n      <SubmitButton>提交</SubmitButton>\n    </Form>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_47\n}]\n},{\n    title: `一个含有多段列表的表单示例`,\n    description: `展示了一个含有多段列表的表单示例，列表的最大长度为5，在添加5段之后添加按钮自动隐藏`,\n    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: \"表单提交数据\",\n          children: <pre>{JSON.stringify(data, null, 2)}</pre>,\n        });\n      }}\n    >\n      <Space direction=\"vertical\" size={16}>\n        <FormInfo\n          title=\"基本信息\"\n          list={[\n            <Input name=\"name\" label=\"基本名称\" rule=\"REQ\" block />,\n            <TextArea name=\"des\" label=\"基本描述\" block />,\n          ]}\n        />\n        <List\n          name=\"list\"\n          title=\"列表\"\n          itemTitle={({ index }) => \\`经历\\${index + 1}\\`}\n          maxLength={5}\n          list={[\n            <Input name=\"name\" label=\"名称\" rule=\"REQ\" />,\n            <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n            <TextArea name=\"des\" label=\"描述\" block rule=\"REQ\" />,\n          ]}\n        />\n        <TableList\n          name=\"tableList\"\n          title=\"表格列表\"\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name=\"name\" label=\"名称\" rule=\"REQ\" value=\"xxxxx\" />,\n            <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n            <AdvancedSelect\n              name=\"select\"\n              label=\"选项\"\n              rule=\"REQ\"\n              value={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"第一项\",\n                        value: 1,\n                      },\n                      {\n                        label: \"第二项\",\n                        value: 2,\n                        disabled: true,\n                      },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n          ]}\n        />\n        <List\n          name=\"mult-list\"\n          important\n          title=\"复杂列表\"\n          itemTitle={({ index }) => \\`经历\\${index + 1}\\`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name=\"name\" label=\"名称\" rule=\"REQ\" />,\n            <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n            <TextArea name=\"des\" label=\"描述\" block rule=\"REQ\" />,\n            <TableList\n              block\n              isUnshift={false}\n              name=\"tableList\"\n              title=\"表格列表\"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name=\"name\" label=\"名称\" rule=\"REQ\" value=\"xxxxx\" />,\n                <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n                <AdvancedSelect\n                  name=\"select\"\n                  label=\"选项\"\n                  rule=\"REQ\"\n                  value={[1]}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          {\n                            label: \"第一项\",\n                            value: 1,\n                          },\n                          {\n                            label: \"第二项\",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: \"第三项\",\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=\"复杂列表2\"\n          itemTitle={({ index }) => \\`经历\\${index + 1}\\`}\n          maxLength={5}\n          minLength={1}\n          list={[\n            <Input name=\"name\" label=\"名称\" rule=\"REQ\" />,\n            <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n            <TextArea name=\"des\" label=\"描述\" block rule=\"REQ\" />,\n            <List\n              block\n              name=\"tableList\"\n              title=\"列表\"\n              maxLength={5}\n              minLength={1}\n              list={[\n                <Input name=\"name\" label=\"名称\" rule=\"REQ\" value=\"xxxxx\" />,\n                <Input name=\"title\" label=\"标题\" rule=\"REQ\" />,\n                <TextArea name=\"des\" label=\"描述\" block rule=\"REQ\" />,\n              ]}\n            />,\n          ]}\n        />\n        <FormInfo\n          list={[\n            <SubmitButton>提交</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              设置表单值\n            </FormApiButton>,\n          ]}\n        />\n      </Space>\n    </Form>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Modal\",\n    packageName: \"@components/Modal\",\n    component: component_47\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n}]\n},{\n    title: `Modal Form弹窗`,\n    description: `展示一个form弹窗`,\n    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=\"表单弹窗\"\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=\"基本信息\"\n          list={[\n            <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n            <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n            <TextArea name=\"field3\" label=\"字段3\" />,\n          ]}\n        />\n        <List\n          title=\"列表\"\n          name=\"list\"\n          maxLength={3}\n          list={[\n            <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n            <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n            <TextArea name=\"field3\" label=\"字段3\" />,\n          ]}\n        />\n      </FormModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        组件调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: \"表单弹窗\",\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=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: \"表单弹窗\",\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: \"我接口获取的数据\",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks加载form数据调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formModal({\n            title: \"表单弹窗\",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: \"取消\" },\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: \"提交\",\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=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        自定义footerButtons\n      </Button>\n      <FormModalButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: \"Lucy\",\n                  desc: \"个人介绍个人介绍个人介绍个人介绍个人介绍个人介绍个人介绍\",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: \"加载数据的form弹窗\",\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=\"基本信息\"\n                column={1}\n                list={[\n                  <Input name=\"name\" label=\"姓名\" rule=\"REQ\" />,\n                  <TextArea name=\"desc\" label=\"介绍\" rule=\"REQ\" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        加载form数据按钮\n      </FormModalButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"fetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_50\n}]\n},{\n    title: `FormStepModal表单弹窗示例`,\n    description: `展示了一个FormStepModal表单弹窗示例`,\n    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=\"表单弹窗\"\n        onClose={() => {\n          setOpen(false);\n        }}\n        autoClose\n        items={[\n          {\n            title: \"基本信息\",\n            formProps: {\n              data: {\n                field1: \"基本信息field1field1field1field1\",\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=\"基本信息\"\n                list={[\n                  <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                  <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                  <TextArea name=\"field3\" label=\"字段3\" />,\n                ]}\n              />\n            ),\n          },\n          {\n            title: \"列表信息\",\n            formProps: {\n              data: {\n                list: [{ field1: \"列表信息field1field1field1field1\" }],\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=\"列表\"\n                name=\"list\"\n                maxLength={3}\n                list={[\n                  <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                  <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                  <TextArea name=\"field3\" label=\"字段3\" />,\n                ]}\n              />\n            ),\n          },\n        ]}\n      ></FormStepModal>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        组件调用\n      </Button>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n}]\n},{\n    title: `Drawer Form 抽屉弹窗`,\n    description: `展示一个form抽屉弹窗`,\n    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=\"表单弹窗\"\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=\"基本信息\"\n          list={[\n            <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n            <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n            <TextArea name=\"field3\" label=\"字段3\" />,\n          ]}\n        />\n        <List\n          title=\"列表\"\n          name=\"list\"\n          maxLength={3}\n          list={[\n            <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n            <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n            <TextArea name=\"field3\" label=\"字段3\" />,\n          ]}\n        />\n      </FormDrawer>\n      <Button\n        onClick={() => {\n          setOpen(true);\n        }}\n      >\n        组件调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: \"表单弹窗\",\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=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: \"表单弹窗\",\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: \"我接口获取的数据\",\n                      });\n                    }, 1000);\n                  });\n                }}\n                render={({ data }) => render({ data })}\n              />\n            ),\n            children: (\n              <div>\n                <FormInfo\n                  title=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        hooks加载form数据调用\n      </Button>\n      <Button\n        onClick={() => {\n          const api = formDrawer({\n            title: \"表单弹窗\",\n            footerButtons: [\n              { ButtonComponent: CancelButton, children: \"取消\" },\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: \"提交\",\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=\"基本信息\"\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n                <List\n                  title=\"列表\"\n                  name=\"list\"\n                  maxLength={3}\n                  list={[\n                    <Input name=\"field1\" label=\"字段1\" rule=\"REQ LEN-0-10\" />,\n                    <Input name=\"field2\" label=\"字段2\" rule=\"REQ LEN-0-10\" />,\n                    <TextArea name=\"field3\" label=\"字段3\" />,\n                  ]}\n                />\n              </div>\n            ),\n          });\n        }}\n      >\n        自定义footerButtons\n      </Button>\n      <FormDrawerButton\n        api={{\n          loader: () => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve({\n                  name: \"Lucy\",\n                  desc: \"个人介绍个人介绍个人介绍个人介绍个人介绍个人介绍个人介绍\",\n                });\n              }, 1000);\n            });\n          },\n        }}\n        modalProps={({ data, close }) => {\n          return {\n            title: \"加载数据的form弹窗\",\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=\"基本信息\"\n                column={1}\n                list={[\n                  <Input name=\"name\" label=\"姓名\" rule=\"REQ\" />,\n                  <TextArea name=\"desc\" label=\"介绍\" rule=\"REQ\" />,\n                ]}\n              />\n            ),\n          };\n        }}\n      >\n        加载form数据按钮\n      </FormDrawerButton>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"fetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_50\n}]\n},{\n    title: `选择控件的数据展示框`,\n    description: `展示了一个选择控件的数据展示框，它是其他选择器的子组件一般不独立使用，开放该组件是为了方面自定义新的选择控件，但是请谨慎使用`,\n    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: \"修改的项\", value: 1 },\n            { label: \"新增的项\", value: 4 },\n          ]);\n        }}\n      >\n        点击设置mapping值\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 = \"选区内容\";\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: \"非受控状态\",\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: \"受控状态\",\n          content: (\n            <ControlledSelectInnerInput>{children}</ControlledSelectInnerInput>\n          ),\n        },\n        {\n          label: \"mapping值显示\",\n          content: (\n            <SelectInnerInput\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: \"第一项\", value: 1 },\n                        { label: \"第二项\", value: 2 },\n                        {\n                          label: \"第三项\",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"单项值显示\",\n          content: (\n            <SelectInnerInput\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve([\n                        { label: \"第一项\", value: 1 },\n                        { label: \"第二项\", value: 2 },\n                        {\n                          label: \"第三项\",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"多项超出情况\",\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                        \"第一项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        \"第二项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 2,\n                    },\n                    {\n                      label: \"第三项\",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        \"第四项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        \"第五项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        \"第六项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        \"第七项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 7,\n                    },\n                    { label: \"第八项\", value: 8 },\n                    { label: \"第九项\", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"单项超出情况\",\n          content: (\n            <SelectInnerInput\n              defaultValue={1}\n              single\n              api={{\n                loader: () => {\n                  return [\n                    {\n                      label:\n                        \"第一项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        \"第二项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 2,\n                    },\n                    {\n                      label: \"第三项\",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        \"第四项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 4,\n                    },\n                    {\n                      label:\n                        \"第五项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 5,\n                    },\n                    {\n                      label:\n                        \"第六项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 6,\n                    },\n                    {\n                      label:\n                        \"第七项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 7,\n                    },\n                    { label: \"第八项\", value: 8 },\n                    { label: \"第九项\", value: 9 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"popup多项超出情况\",\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                        \"第一项超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 1,\n                    },\n                    {\n                      label:\n                        \"第二项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 2,\n                    },\n                    {\n                      label: \"第三项\",\n                      value: 3,\n                    },\n                    {\n                      label:\n                        \"第四项超级长超级长超级长超级长超级长超级长超级长超级长\",\n                      value: 4,\n                    },\n                    {\n                      label: \"第五项\",\n                      value: 5,\n                    },\n                    {\n                      label: \"第六项\",\n                      value: 6,\n                    },\n                    { label: \"第七项\", value: 7 },\n                    { label: \"第八项\", value: 8 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"popup选区\",\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: \"第一项\", value: 1 },\n                        { label: \"第二项\", value: 2 },\n                        {\n                          label: \"第三项\",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"更新mapping\",\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: \"第一项\", value: 1 },\n                        { label: \"第二项\", value: 2 },\n                        {\n                          label: \"第三项\",\n                          value: 3,\n                        },\n                      ]);\n                    }, 1000);\n                  });\n                },\n              }}\n            >\n              <ResetMapping />\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"隐藏已选标签\",\n          content: (\n            <SelectInnerInput\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: \"第一项\", value: 1 },\n                    { label: \"第二项\", value: 2 },\n                    { label: \"第三项\", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"popup隐藏已选标签\",\n          content: (\n            <SelectInnerInput\n              isPopup\n              showSelectedTag={false}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: \"第一项\", value: 1 },\n                    { label: \"第二项\", value: 2 },\n                    { label: \"第三项\", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"extra\",\n          content: (\n            <SelectInnerInput\n              extra={<Button>添加</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: \"第一项\", value: 1 },\n                    { label: \"第二项\", value: 2 },\n                    { label: \"第三项\", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"popup的extra\",\n          content: (\n            <SelectInnerInput\n              isPopup\n              extra={({ close }) => <Button onClick={close}>添加</Button>}\n              defaultValue={[1, 2, 3]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: \"第一项\", value: 1 },\n                    { label: \"第二项\", value: 2 },\n                    { label: \"第三项\", value: 3 },\n                  ];\n                },\n              }}\n            >\n              {children}\n            </SelectInnerInput>\n          ),\n        },\n        {\n          label: \"valueType为all\",\n          content: (\n            <SelectInnerInput\n              isPopup\n              valueType=\"all\"\n              defaultValue={[\n                { label: \"额外的一项\", value: 100 },\n                { label: \"额外的二项\", value: 200 },\n              ]}\n              api={{\n                loader: () => {\n                  return [\n                    { label: \"第一项\", value: 1 },\n                    { label: \"第二项\", value: 2 },\n                    { label: \"第三项\", 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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n}]\n},{\n    title: `高级选择组件`,\n    description: `展示了高级选择组件的List形态`,\n    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: \"添加的新项目_\" + id,\n              value: id,\n            },\n            ...fetchApi.data.pageData,\n          ],\n          totalCount: fetchApi.data.totalCount,\n        });\n      }}\n    >\n      添加\n    </Button>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Content\n      col={2}\n      list={[\n        {\n          label: \"多选\",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: \"第一项\", value: 1 },\n                      { label: \"第二项\", value: 2, disabled: true },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选\",\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: \\`第\\${key + 1}项\\`,\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: \"多选modal\",\n          content: (\n            <AdvancedSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: \"第一项\", value: 1 },\n                      { label: \"第二项\", value: 2 },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选modal\",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: \"第一项\", value: 1 },\n                      { label: \"第二项\", value: 2 },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"描述信息\",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: \"第一项\", value: 1, description: \"描述信息\" },\n                      {\n                        label: \"第二项\",\n                        value: 2,\n                        description: \"描述信息\",\n                      },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                        description: \"描述信息\",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"分页加载数据\",\n          content: (\n            <AdvancedSelect\n              single\n              defaultValue={90}\n              getSearchProps={(text) => {\n                return {\n                  data: { keyword: text },\n                };\n              }}\n              displayItems={[{ label: \"第九十项\", 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: \\`第\\${key + 1}项\\`,\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分页加载数据\",\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: \"第九十项\", 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: \\`第\\${key + 1}项\\`,\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `用户选择组件`,\n    description: `在List的交互逻辑基础上扩展出的不同列表样式`,\n    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: \"多选\",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        value: 1,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户二\",\n                        value: 2,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户三\",\n                        value: 3,\n                        description: \"我是用户描述\",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选\",\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: \\`用户\\${key + 1}\\`,\n                        description: \"我是用户描述\",\n                        value: key + 1,\n                      };\n                    }),\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"多选modal\",\n          content: (\n            <UserSelect\n              defaultValue={[1]}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        value: 1,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户二\",\n                        value: 2,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户三\",\n                        value: 3,\n                        description: \"我是用户描述\",\n                      },\n                    ],\n                  };\n                },\n              }}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选modal\",\n          content: (\n            <UserSelect\n              single\n              defaultValue={1}\n              isPopup={false}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        value: 1,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户二\",\n                        value: 2,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户三\",\n                        value: 3,\n                        description: \"我是用户描述\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `表格选择组件`,\n    description: `在List的交互逻辑基础上扩展出的不同列表样式`,\n    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: \"多选\",\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: \\`员工\\${key + 1}\\`,\n                              company: \"北京科技有限公司\",\n                              department: \"技术部\",\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: \"姓名\",\n                  dataIndex: \"label\",\n                },\n                {\n                  title: \"所属公司\",\n                  dataIndex: \"company\",\n                },\n                {\n                  title: \"所属部门\",\n                  dataIndex: \"department\",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选\",\n          content: (\n            <TableSelect\n              single\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        company: \"北京科技有限公司\",\n                        department: \"财务部\",\n                        value: 1,\n                      },\n                      {\n                        label: \"用户二\",\n                        company: \"北京科技有限公司\",\n                        department: \"技术部\",\n                        value: 2,\n                      },\n                      {\n                        label: \"用户三\",\n                        company: \"北京科技有限公司\",\n                        department: \"商务部\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: \"姓名\",\n                  dataIndex: \"label\",\n                },\n                {\n                  title: \"所属公司\",\n                  dataIndex: \"company\",\n                },\n                {\n                  title: \"所属部门\",\n                  dataIndex: \"department\",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"多选modal\",\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: \\`员工\\${key + 1}\\`,\n                              company: \"北京科技有限公司\",\n                              department: \"技术部\",\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: \"姓名\",\n                  dataIndex: \"label\",\n                },\n                {\n                  title: \"所属公司\",\n                  dataIndex: \"company\",\n                },\n                {\n                  title: \"所属部门\",\n                  dataIndex: \"department\",\n                },\n              ]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选modal\",\n          content: (\n            <TableSelect\n              single\n              isPopup={false}\n              defaultValue={1}\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        company: \"北京科技有限公司\",\n                        department: \"财务部\",\n                        value: 1,\n                      },\n                      {\n                        label: \"用户二\",\n                        company: \"北京科技有限公司\",\n                        department: \"技术部\",\n                        value: 2,\n                      },\n                      {\n                        label: \"用户三\",\n                        company: \"北京科技有限公司\",\n                        department: \"商务部\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n              columns={[\n                {\n                  title: \"姓名\",\n                  dataIndex: \"label\",\n                },\n                {\n                  title: \"所属公司\",\n                  dataIndex: \"company\",\n                },\n                {\n                  title: \"所属部门\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `地址选择组件`,\n    description: `展示地址选择组件`,\n    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: \"多选\",\n          content: (\n            <AddressSelect\n              maxLength={3}\n              defaultValue={[\"110\"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"单选\",\n          content: (\n            <AddressSelect\n              single\n              defaultValue={\"110\"}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"modal多选\",\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单选\",\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为all\",\n          content: (\n            <AddressSelect\n              valueType=\"all\"\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"地址显示\",\n          content: <AddressEnum name=\"270070\" />,\n        },\n        {\n          label: \"显示父级\",\n          content: <AddressEnum name=\"270070\" displayParent />,\n        },\n        {\n          label: \"地址输入\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `级联选择组件`,\n    description: `展示级联选择组件`,\n    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: \"一次性获取数据\",\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: \"客户\",\n                          label: \"客户\",\n                          children: [\n                            {\n                              id: \"client-list\",\n                              value: \"client-list\",\n                              type: \"feature\",\n                              name: \"客户列表页\",\n                              label: \"客户列表页\",\n                            },\n                            {\n                              id: \"client-detail\",\n                              value: \"client-detail\",\n                              type: \"module\",\n                              name: \"客户详情页\",\n                              label: \"客户详情页\",\n                              children: [\n                                {\n                                  id: \"contract\",\n                                  value: \"contract\",\n                                  type: \"module\",\n                                  name: \"合同信息\",\n                                  label: \"合同信息\",\n                                },\n                              ],\n                            },\n                            {\n                              id: \"client-form\",\n                              value: \"client-form\",\n                              type: \"feature\",\n                              name: \"客户表单\",\n                              label: \"客户表单\",\n                              children: [\n                                {\n                                  id: \"taxpayerIdNumber\",\n                                  value: \"taxpayerIdNumber\",\n                                  type: \"feature\",\n                                  name: \"税号\",\n                                  label: \"税号\",\n                                },\n                              ],\n                            },\n                          ],\n                        },\n                        {\n                          id: \"position\",\n                          value: \"position\",\n                          type: \"module\",\n                          name: \"职位\",\n                          label: \"职位\",\n                          children: [\n                            {\n                              id: \"position-list\",\n                              value: \"position-list\",\n                              type: \"feature\",\n                              name: \"职位列表页\",\n                              label: \"职位列表页\",\n                            },\n                            {\n                              id: \"position-detail\",\n                              value: \"position-detail\",\n                              type: \"module\",\n                              name: \"职位详情页\",\n                              label: \"职位详情页\",\n                            },\n                            {\n                              id: \"position-form\",\n                              value: \"position-form\",\n                              type: \"feature\",\n                              name: \"职位表单\",\n                              label: \"职位表单\",\n                              children: [\n                                {\n                                  id: \"industry\",\n                                  value: \"industry\",\n                                  type: \"feature\",\n                                  name: \"行业\",\n                                  label: \"行业\",\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: \"分层加载数据\",\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: \\`节点-\\${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: \\`节点-\\${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分层加载数据\",\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: \\`节点-\\${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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `职能选择`,\n    description: `展示行业职能选择`,\n    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: \"职能选择\",\n          content: (\n            <FunctionSelect\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"modal职能选择\",\n          content: (\n            <FunctionSelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"职能选择无搜索\",\n          content: (\n            <FunctionSelect\n              search={null}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"职能枚举显示\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `行业选择`,\n    description: `展示行业选择组件`,\n    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: \"行业选择\",\n          content: (\n            <IndustrySelect\n              defaultValue={[\"001\"]}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"modal行业选择\",\n          content: (\n            <IndustrySelect\n              isPopup={false}\n              onChange={(value) => {\n                console.log(value);\n              }}\n            />\n          ),\n        },\n        {\n          label: \"职能枚举显示\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_48\n}]\n},{\n    title: `金额输入`,\n    description: `展示金额输入组件`,\n    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: \"金额输入\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n}]\n},{\n    title: `电话号码输入`,\n    description: `展示电话号码输入组件`,\n    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: \"电话输入\",\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n}]\n},{\n    title: `薪资组件`,\n    description: `展示填写薪资范围输入组件`,\n    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: \"薪资范围\",\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 ? \"最低薪资\" : \"最高薪资\"}不能为空\\`,\n                };\n              }\n              if (min > max) {\n                return {\n                  result: false,\n                  errMsg: \"最高薪资应大于最低薪资\",\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=\"薪资范围\"\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`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_Content\",\n    packageName: \"@components/Content\",\n    component: component_51\n}]\n},{\n    title: `可扩展的AdvanceSelect`,\n    description: `AdvanceSelect支持左右布局`,\n    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: \"第九十项\", 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: \\`第\\${key + 1}项\\`,\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={\"面试官\"}\n        placeholder={\"选择面试官\"}\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>我是header</div>\n            <div>我是body</div>\n          </Col>\n        )}\n        leftBottom={() => <div>我是leftBottom</div>}\n      />\n    </PureGlobal>\n  );\n};\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_FormInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_45\n},{\n    name: \"icon\",\n    packageName: \"@components/Icon\",\n    component: component_52\n},{\n    name: \"_antd\",\n    packageName: \"antd\",\n    component: component_49\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_46\n},{\n    name: \"_lodash\",\n    packageName: \"lodash\",\n    component: component_48\n},{\n    name: \"_dayjs\",\n    packageName: \"dayjs\",\n    component: component_53\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_104 from '@components/Table';\nimport * as component_105 from '@components/Global';\nimport * as component_106 from '@kne/react-fetch';\nimport * as component_107 from 'lodash';\nimport * as component_108 from 'antd';\nconst readmeConfig = {\n    name: `Table`,\n    summary: `<p>可以从后端获取数据，然后展示为一个表格</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Table_51c45`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"林珊珊\",\n            title: \"我是主要字段\",\n            tagEnum: null,\n            enUserName: \"Lin Shanshan\",\n            phoneNumber: \"+86 18792877372\",\n            email: \"a@a.com\",\n            count: 4,\n            description:\n              \"我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述\",\n            description2:\n              \"我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述\",\n            other: \"其他信息\",\n          },\n          {\n            id: 1,\n            date: \"\",\n            datetime: \"2023-07-22 09:00:00\",\n            serialNumber: \"SX00192932323434\",\n            serialNumberShort: \"SH0023\",\n            userName: \"林珊珊1\",\n            title: \"我是主要字段\",\n            tagEnum: \"Y\",\n            enUserName: \"Lin Shanshan\",\n            phoneNumber: null,\n            email: \"a@a.com\",\n            count: 5,\n            description: \"我是一段描述\",\n            description2: \"我是一段描述\",\n            other: \"其他信息\",\n          },\n        ]}\n        columns={[\n          {\n            name: \"date\",\n            title: \"日期\",\n            type: \"date\",\n            hover: true,\n          },\n          {\n            name: \"datetime\",\n            title: \"日期时间\",\n            type: \"datetime\",\n            hideSecond: true,\n          },\n          {\n            name: \"serialNumber\",\n            title: \"编号\",\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: \"短编号\",\n            type: \"serialNumberShort\",\n          },\n          {\n            name: \"title\",\n            title: \"主要信息\",\n            type: \"mainInfo\",\n          },\n          {\n            name: \"tag\",\n            title: \"状态标签\",\n            type: \"tag\",\n            valueOf: () => ({ type: \"success\", text: \"审核通过\" }),\n          },\n          {\n            name: \"tagEnum\",\n            title: \"标签枚举\",\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: \"头像\",\n            type: \"avatar\",\n            valueOf: () => ({ gender: \"F\" }),\n          },\n          {\n            name: \"user\",\n            title: \"用户\",\n            type: \"user\",\n            valueOf: (item) => \\`\\${item.enUserName} \\${item.userName}\\`,\n          },\n          {\n            name: \"hideInfo\",\n            title: \"隐藏字段\",\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: \"用户名\",\n            type: \"userName\",\n          },\n          {\n            name: \"contacts\",\n            title: \"联系人\",\n            type: \"contacts\",\n            valueOf: (item) => \\`\\${item.userName} \\${item.phoneNumber}\\`,\n          },\n          {\n            name: \"count\",\n            title: \"数量\",\n            type: \"singleRow\",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: \"description\",\n            title: \"描述\",\n            type: \"description\",\n          },\n          {\n            name: \"description2\",\n            title: \"描述(省略)\",\n            type: \"description\",\n            ellipsis: true,\n          },\n          {\n            name: \"other\",\n            title: \"其他\",\n            type: \"other\",\n            hover: true,\n          },\n          {\n            name: \"options\",\n            title: \"操作\",\n            type: \"options\",\n            valueOf: (item) => [\n              {\n                onClick: () => {\n                  return new Promise((resolve) => {\n                    setTimeout(() => {\n                      resolve();\n                    }, 1000);\n                  });\n                },\n                children: \"分配\",\n                message: \"确定要分配吗\",\n                isDelete: false,\n              },\n              {\n                children: \"审核\",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"淘汰\",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"一键约面\",\n              },\n              {\n                children: \"删除\",\n                confirm: true,\n                onClick: () => {\n                  console.log(\"删除\");\n                },\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Table\",\n    packageName: \"@components/Table\",\n    component: component_104\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_105\n},{\n    name: \"reactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_106\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"业务系统\",\n            children: [\n              {\n                id: \"test\",\n                type: \"feature\",\n                name: \"测试功能\",\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: \"我是大魔王\",\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: \"林珊珊\" + index,\n              title: \"我是主要字段\",\n              enUserName: \"Lin Shanshan\",\n              phoneNumber: \"+86 18792877372\",\n              email: \"a@a.com\",\n              count: 5,\n              description:\n                \"我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述\",\n              other: \"其他信息\",\n            })),\n            totalCount: 50,\n          };\n        }}\n        columns={[\n          {\n            name: \"date\",\n            title: \"日期\",\n            type: \"date\",\n            hover: true,\n          },\n          {\n            name: \"datetime\",\n            title: \"日期时间\",\n            type: \"datetime\",\n          },\n          {\n            name: \"dateRange\",\n            title: \"日期范围\",\n            type: \"dateRange\",\n            valueOf: ({ date, datetime }) => [date, datetime],\n          },\n          {\n            name: \"serialNumber\",\n            title: \"编号\",\n            type: \"serialNumber\",\n            primary: true,\n          },\n          {\n            name: \"serialNumberShort\",\n            title: \"短编号\",\n            type: \"serialNumberShort\",\n          },\n          {\n            name: \"title\",\n            title: \"主要信息\",\n            type: \"mainInfo\",\n          },\n          {\n            name: \"phone\",\n            title: \"手机号\",\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: \"邮箱\",\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: \"状态标签\",\n            type: \"tag\",\n            valueOf: () => ({ type: \"success\", text: \"审核通过\" }),\n          },\n          {\n            name: \"avatar\",\n            title: \"头像\",\n            type: \"avatar\",\n            valueOf: () => ({ gender: \"F\" }),\n          },\n          {\n            name: \"user\",\n            title: \"用户\",\n            type: \"user\",\n            valueOf: (item) => \\`\\${item.enUserName} \\${item.userName}\\`,\n          },\n          {\n            name: \"userName\",\n            title: \"用户名\",\n            type: \"userName\",\n          },\n          {\n            name: \"contacts\",\n            title: \"联系人\",\n            type: \"contacts\",\n            valueOf: (item) => \\`\\${item.userName} \\${item.phoneNumber}\\`,\n          },\n          {\n            name: \"count\",\n            title: \"数量\",\n            type: \"singleRow\",\n          },\n          {\n            name: \"description\",\n            title: \"描述(省略)\",\n            type: \"description\",\n            ellipsis: true,\n          },\n          {\n            name: \"other\",\n            title: \"其他\",\n            type: \"other\",\n            hover: true,\n          },\n          {\n            name: \"addUser\",\n            title: \"添加人\",\n            type: \"user\",\n            render: ({ data }) => ({ valueOf: () => data.addUserName }),\n          },\n          {\n            name: \"options\",\n            title: \"操作\",\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: \"编辑\",\n                disabled: true,\n                tooltipProps: {\n                  title: \"不能编辑这条信息\",\n                },\n              },\n              {\n                children: \"审核\",\n                tooltipProps: {\n                  title: (\n                    <div\n                      style={{ padding: \"10px\", backgroundColor: \"skyblue\" }}\n                    >\n                      审核操作的tooltip\n                    </div>\n                  ),\n                },\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"淘汰\",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"一键约面\",\n              },\n              {\n                children: \"删除\",\n              },\n            ],\n          },\n        ]}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Table\",\n    packageName: \"@components/Table\",\n    component: component_104\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_107\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_105\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"林珊珊\",\n            title: \"我是主要字段\",\n            tagEnum: \"Y\",\n            enUserName: \"Lin Shanshan\",\n            phoneNumber: \"+86 18792877372\",\n            email: \"a@a.com\",\n            count: 4,\n            description:\n              \"我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述\",\n            description2:\n              \"我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述我是一段描述\",\n            other: \"其他信息\",\n          },\n          {\n            id: 1,\n            date: \"\",\n            datetime: \"2023-07-22 09:00:00\",\n            serialNumber: \"SX00192932323434\",\n            serialNumberShort: \"SH0023\",\n            userName: \"林珊珊1\",\n            title: \"我是主要字段\",\n            tagEnum: \"Y\",\n            enUserName: \"Lin Shanshan\",\n            phoneNumber: \"+86 18792877372\",\n            email: \"a@a.com\",\n            count: 5,\n            description: \"我是一段描述\",\n            description2: \"我是一段描述\",\n            other: \"其他信息\",\n          },\n        ]}\n        columns={[\n          {\n            name: \"date\",\n            title: \"日期\",\n            sort: true,\n            groupHeader: [\n              {\n                name: \"group1\",\n                title: \"分组1\",\n              },\n              {\n                name: \"group1-1\",\n                title: \"分组1-1\",\n              },\n            ],\n            type: \"date\",\n            hover: true,\n          },\n          {\n            name: \"datetime\",\n            title: \"日期时间\",\n            sort: true,\n            groupHeader: [\n              {\n                name: \"group1\",\n                title: \"分组1\",\n              },\n              {\n                name: \"group1-2\",\n                title: \"分组1-2\",\n              },\n            ],\n            type: \"datetime\",\n          },\n          {\n            name: \"serialNumber\",\n            title: \"编号\",\n            sort: true,\n            groupHeader: [\n              {\n                name: \"group1\",\n                title: \"分组1\",\n              },\n              {\n                name: \"group1-1\",\n                title: \"分组1-1\",\n              },\n            ],\n            type: \"serialNumber\",\n            primary: true,\n          },\n          {\n            name: \"serialNumberShort\",\n            title: \"短编号\",\n            type: \"serialNumberShort\",\n          },\n          {\n            name: \"title\",\n            title: \"主要信息\",\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: \"状态标签\",\n            type: \"tag\",\n            valueOf: () => ({ type: \"success\", text: \"审核通过\" }),\n          },\n          {\n            name: \"tagEnum\",\n            title: \"标签枚举\",\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: \"头像\",\n            type: \"avatar\",\n            valueOf: () => ({ gender: \"F\" }),\n          },\n          {\n            name: \"user\",\n            title: \"用户\",\n            type: \"user\",\n            valueOf: (item) => \\`\\${item.enUserName} \\${item.userName}\\`,\n          },\n          {\n            name: \"hideInfo\",\n            title: \"隐藏字段\",\n            type: \"hideInfo\",\n            valueOf: (item) => ({\n              loader: () => {\n                return item[\"phoneNumber\"] + \"-\" + item[\"id\"];\n              },\n            }),\n          },\n          {\n            name: \"userName\",\n            title: \"用户名\",\n            type: \"userName\",\n          },\n          {\n            name: \"contacts\",\n            title: \"联系人\",\n            type: \"contacts\",\n            valueOf: (item) => \\`\\${item.userName} \\${item.phoneNumber}\\`,\n          },\n          {\n            name: \"count\",\n            title: \"数量\",\n            type: \"singleRow\",\n            render: ({ target }) => {\n              return target.count === 5 ? { hover: true } : { hover: false };\n            },\n          },\n          {\n            name: \"description\",\n            title: \"描述\",\n            type: \"description\",\n          },\n          {\n            name: \"description2\",\n            title: \"描述(省略)\",\n            type: \"description\",\n            ellipsis: true,\n          },\n          {\n            name: \"other\",\n            title: \"其他\",\n            type: \"other\",\n            hover: true,\n            sort: true,\n          },\n          {\n            name: \"options\",\n            title: \"操作\",\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: \"分配Program及教练\",\n              },\n              {\n                children: \"审核\",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"淘汰\",\n              },\n              {\n                onClick: () => {\n                  console.log(item);\n                },\n                children: \"一键约面\",\n              },\n              {\n                children: \"删除\",\n              },\n            ],\n          },\n        ]}\n        onSortChange={(sort) => {\n          console.log(\">>>>>>\", sort);\n        }}\n      />\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Table\",\n    packageName: \"@components/Table\",\n    component: component_104\n},{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_105\n},{\n    name: \"reactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_106\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_108\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_70 from '@components/InfoPage';\nimport * as component_71 from 'antd';\nconst readmeConfig = {\n    name: `InfoPage`,\n    summary: `<h3><em><code>InfoPage</code></em> 何时使用</h3>\n<p>一般用在复杂的详情展示页面，<code>InfoPage</code> 提供了一个标准的展示信息的格式</p>\n<h3>特点</h3>\n<ul>\n<li>支持 <code>Content</code> 组件 <code>Descriptions</code> 组件的组合</li>\n<li>支持 <code>Collapse</code> 组件组合</li>\n<li><code>InfoPage.Part</code>、<code>InfoPage.Collapse</code> 需要放在 <code>InfoPage</code> 之下，<code>Content</code>、<code>Descriptions</code> 可以任意组合</li>\n</ul>\n<h3><em><code>Content</code></em> 何时使用</h3>\n<p>成组展示多个字段，常见于详情页的信息展示</p>\n<h3>特点</h3>\n<p>labelAlign 不为 auto 时会自动计算 label 的最小宽度使所有 label 的宽度等于最长的 label 宽度，使视觉上更加整齐有秩序感</p>`,\n    \n    \n    api: `<h3>InfoPage</h3>\n<p>同 <a href=\"https://ant.design/components/Card#api\"><code>Ant Design Card</code></a></p>\n<p>新增参数：</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>副标题</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>InfoPage</code> 的 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Part</h4>\n<p>同 <a href=\"https://ant.design/components/Card#api\"><code>Ant Design Card</code></a></p>\n<p>新增参数：</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>subtitle</td>\n<td>副标题</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Part</code> 的 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h4>InfoPage.Collapse</h4>\n<p>同 <a href=\"https://ant.design/components/Collapse#collapse\"><code>Ant Design Collapse</code></a></p>\n<p>新增参数：</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>className</td>\n<td><code>Part</code> 的 <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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>list</td>\n<td><code>Content</code> 的内容列表</td>\n<td><code>listItemProps[]</code></td>\n<td>[]</td>\n</tr>\n<tr>\n<td>labelAlign</td>\n<td><code>label</code> 的对齐方式可以传入的值 <code>left,right,center,auto</code>,为 <code>auto</code> 时 <code>label</code> 不计算最小宽度</td>\n<td>string</td>\n<td>left</td>\n</tr>\n<tr>\n<td>col</td>\n<td>列数</td>\n<td>number</td>\n<td>1</td>\n</tr>\n<tr>\n<td>size</td>\n<td>默认为 <code>14px</code>，可以传值为 <code>small</code>，<code>size</code> 为 <code>small</code> 时字号为 <code>12px</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>gutter</td>\n<td>栅格间隔，可以写成像素值或支持响应式的对象写法来设置水平间隔 <code>{ xs: 8, sm: 16, md: 24}</code>。或者使用数组形式同时设置 [水平间距, 垂直间距]</td>\n<td>number</td>\n<td>0</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>Content</code> 的 <code>className</code></td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>接收 <code>Content Inner</code> 和 <code>Inner</code> 的 <code>label, content, index</code>，可以根据数据信息返回想要渲染的内容</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>数据是否展示，当为 <code>function</code> 时可以接收到 <code>item, list</code> 参数，<code>item</code> 为当前项配置，<code>dataSource</code> 为整个组件的 <code>dataSource</code> 配置</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>block</td>\n<td>是否单行显示该条信息</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>label</td>\n<td>标题</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>内容</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>dataSource</td>\n<td>详情数据源，内部每个数组为一行数据，每行数据中每个对象为一列数据，每行最多包含 <code>2</code> 列内容，多余的会被丢弃</td>\n<td><code>dataSourceItemProps[]</code></td>\n<td>-</td>\n</tr>\n<tr>\n<td>itemRender</td>\n<td>接收 <code>Descriptions Inner</code> 和 <code>Inner</code> 的 <code>label, content, displaty, index</code>，可以根据数据信息返回想要渲染的内容</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>display</td>\n<td>数据是否展示，当为 <code>function</code> 时可以接收到 <code>item, dataSource</code> 参数，<code>item</code> 为当前项配置，<code>dataSource</code> 为整个组件的 <code>dataSource</code> 配置</td>\n<td>boolean | function</td>\n<td>true</td>\n</tr>\n<tr>\n<td>label</td>\n<td>数据展示的标题</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>数据展示的内容</td>\n<td>ReactNode | string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `InfoPage_fb7ea`,\n        style: ``,\n        list: [{\n    title: `InfoPage`,\n    description: `这里填写示例说明`,\n    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=\"我是一个subtitle\"\n        extra={<Button>操作</Button>}\n      >\n        InfoPage.Part\n        <InfoPage.Part\n          title=\"Part Title\"\n          subtitle=\"我是一个subtitle\"\n          extra={<Button>操作</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`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n},{\n    title: `Content`,\n    description: `展示了一个基本内容`,\n    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列</Radio.Button>\n        <Radio.Button value={2}>2列</Radio.Button>\n        <Radio.Button value={3}>3列</Radio.Button>\n      </Radio.Group>\n      <Radio.Group\n        onChange={(e) => onChange(e, \"labelAlign\")}\n        value={listProps.labelAlign}\n      >\n        <Radio.Button value=\"left\">左对齐</Radio.Button>\n        <Radio.Button value=\"center\">中心对齐</Radio.Button>\n        <Radio.Button value=\"right\">右对齐</Radio.Button>\n        <Radio.Button value=\"auto\">自适应</Radio.Button>\n      </Radio.Group>\n      <Radio.Group onChange={(e) => onChange(e, \"size\")} value={listProps.size}>\n        <Radio.Button value=\"default\">默认</Radio.Button>\n        <Radio.Button value=\"small\">small</Radio.Button>\n      </Radio.Group>\n      <Content\n        {...listProps}\n        list={[\n          { label: \"标题\", content: \"内容\" },\n          { label: \"标题标题\", content: \"内容内容\" },\n          {\n            label: \"标题标\",\n            content: \"内容内容内容内容内容内容内容内容内容内容\",\n          },\n          {\n            label: \"标题标题标题\",\n            content:\n              \"内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容\",\n          },\n        ]}\n        itemRender={(inner, other) => {\n          return other?.index === 2 ? \"此处内容额外自定义\" : inner;\n        }}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n},{\n    title: `Descriptions`,\n    description: `展示一个信息详情`,\n    code: `const { Descriptions } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <Descriptions\n      dataSource={[\n        [\n          { label: \"客户名称\", content: \"腾讯\" },\n          {\n            label: \"发票抬头\",\n            content: \"腾讯科技公司\",\n          },\n        ],\n        [\n          { label: \"发票类型\", content: \"增值税专用发票\" },\n          {\n            label: \"发票开具日期\",\n            content: \"2022-08-15\",\n          },\n        ],\n        [{ label: \"退票金额\", content: \"22000.00元\" }],\n        [\n          {\n            label: \"发票号\",\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: \"是否需要重开发票\", content: \"否\" },\n          {\n            label: \"是否涉及金融变动\",\n            content: \"否\",\n          },\n        ],\n        [\n          { label: \"是否造成实质损失\", content: \"否\" },\n          { label: \"责任归属\", content: \"客户原因\" },\n        ],\n        [\n          {\n            label: \"退票原因\",\n            content: \"退票原因的描述退票原因的描述退票原因的描\",\n          },\n        ],\n        [{ label: \"附件\", content: \"附件名称\" }],\n        [\n          { label: \"操作时间\", content: \"2022-08-01 16:32\" },\n          { label: \"操作人\", content: \"西西歪\", display: false },\n        ],\n        [\n          {\n            label: \"超长内容\",\n            content:\n              \"超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容超长内容\",\n          },\n          {\n            label: \"超长英文\",\n            content:\n              \"aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa\",\n          },\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n},{\n    title: `CentralContent`,\n    description: `请尽量使用该组件代替Descriptions组件。该组件比Descriptions组件添加了数据格式化和灵活的空判断和自定义空展示，并且优化了排列，可以实现任何栅格大小的数据项复杂组合。实现了尾行优化，使你不必担心末尾项的宽度问题，程序会自动计算并占满该行。`,\n    code: `const { CentralContent } = _InfoPage;\n\nconst BaseExample = () => {\n  return (\n    <CentralContent\n      dataSource={{\n        id: \"RC00101\",\n        name: \"张三\",\n        birthday: \"2020-03-03\",\n        addTime: new Date(),\n        count: 2000.1322,\n        count2: 0.01234565,\n        count3: 1234523,\n        description: \\`描述描述描述描述描述描述描述描述\\n描述描述描述描述描述描述描述描述\\n描述描述描述描述描述描述描述描述描述描述描述描述描述描述描述\\`,\n        description2: \\`描述描述描述描述描述描述描述描述\\`,\n      }}\n      col={3}\n      columns={[\n        {\n          name: \"id\",\n          title: \"ID\",\n          block: true,\n        },\n        {\n          name: \"name\",\n          title: \"姓名\",\n          span: 10,\n        },\n        {\n          name: \"birthday\",\n          title: \"出生日期\",\n          format: \"date\",\n        },\n        {\n          name: \"addTime\",\n          title: \"添加时间\",\n          format: \"datetime\",\n        },\n        {\n          name: \"count\",\n          title: \"数量\",\n          format: \"number\",\n        },\n        {\n          name: \"count2\",\n          title: \"百分比\",\n          format: \"number-percent money-百分比\",\n        },\n        {\n          name: \"count3\",\n          title: \"万元\",\n          format: \"number--10000\",\n          render: (value) => \\`\\${value}万元\\`,\n        },\n        {\n          name: \"empty\",\n          title: \"空值显示\",\n        },\n        {\n          name: \"empty2\",\n          title: \"空值显示2\",\n          placeholder: \"空\",\n        },\n        {\n          name: \"empty3\",\n          title: \"空值显示3\",\n          emptyIsPlaceholder: false,\n        },\n        {\n          name: \"description\",\n          title: \"描述\",\n        },\n        {\n          name: \"description2\",\n          title: \"描述\",\n        },\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n},{\n    title: `TableView`,\n    description: ``,\n    code: `const { TableView } = _InfoPage;\nconst { Flex } = antd;\nconst { useState } = React;\n\nconst dataSource = [\n  {\n    id: \"RC00101\",\n    name: \"张三\",\n    birthday: \"2020-03-03\",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: \\`描述描述描述描述描述描述描述描述\\`,\n  },\n  {\n    id: \"RC00102\",\n    name: \"李四\",\n    birthday: \"2020-03-03\",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: \\`描述描述描述描述描述描述描述描述\\`,\n  },\n  {\n    id: \"RC00103\",\n    name: \"王五\",\n    birthday: \"2020-03-03\",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: \\`描述描述描述描述描述描述描述描述\\`,\n  },\n  {\n    id: \"RC00104\",\n    name: \"马七\",\n    birthday: \"2020-03-03\",\n    addTime: new Date(),\n    count: 2000.1322,\n    count2: 0.01234565,\n    count3: 1234523,\n    description: \\`描述描述描述描述描述描述描述描述\\`,\n  },\n];\n\nconst columns = [\n  {\n    name: \"id\",\n    title: \"ID\",\n  },\n  {\n    name: \"name\",\n    title: \"姓名\",\n  },\n  {\n    name: \"birthday\",\n    title: \"出生日期\",\n    format: \"date\",\n  },\n  {\n    name: \"addTime\",\n    title: \"添加时间\",\n    format: \"datetime\",\n  },\n  {\n    name: \"count\",\n    title: \"数量\",\n    format: \"number\",\n  },\n  {\n    name: \"description\",\n    title: \"描述\",\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`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n},{\n    title: `Flow`,\n    description: ``,\n    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: \"王建国1\",\n                action: \"添加了备注\",\n                time: \"2023-08-15 10:30\",\n                content: \"test\",\n              },\n              {\n                name: \"王建国2\",\n                action: \"添加了备注\",\n                time: \"2023-08-15 10:31\",\n                content: \"test\",\n              },\n            ],\n          },\n          {\n            title: \"自定义DescriptionContentItem渲染样式\",\n            description: \"This is a description.\",\n            descriptionContent: [\n              {\n                name: \"王建国3\",\n                action: \"添加了备注\",\n                time: \"08-15 10:30\",\n                content: \"test\",\n              },\n              {\n                name: \"王建国4\",\n                action: \"添加了备注\",\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`,\n    scope: [{\n    name: \"_InfoPage\",\n    packageName: \"@components/InfoPage\",\n    component: component_70\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_71\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_18 from '@components/Enum';\nimport * as component_19 from 'antd';\nimport * as component_20 from '@components/Global';\nconst readmeConfig = {\n    name: `Enum`,\n    summary: `<p>枚举值管理和展示组件，用于统一管理应用中的枚举数据，如性别、状态、类型等选项列表。</p>\n<h2>何时使用</h2>\n<ul>\n<li>需要展示枚举值的描述文本时</li>\n<li>需要将枚举列表渲染为下拉框、单选框等表单组件时</li>\n<li>需要统一管理应用中的枚举数据时</li>\n<li>需要支持多语言的枚举描述时</li>\n</ul>\n<h2>特性</h2>\n<ul>\n<li>📦 统一的枚举数据管理</li>\n<li>🔄 支持同步/异步加载</li>\n<li>📡 内置LRU缓存机制</li>\n<li>🌍 支持多语言</li>\n<li>🎨 多种格式化方式</li>\n<li>🔧 灵活的渲染函数</li>\n</ul>`,\n    \n    \n    api: `<h2>Enum 组件 API</h2>\n<h3>Enum（默认导出）</h3>\n<p>用于获取单个或多个枚举值的展示内容。</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>枚举模块名称，对应预设中配置的枚举名称</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>name</td>\n<td>枚举值，当提供时获取单个枚举项；不提供时获取整个枚举列表</td>\n<td>string | number</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>格式化方式：'default'返回描述文本，'origin'返回原始对象，'option'返回{label, value}格式</td>\n<td>'default' | 'origin' | 'option'</td>\n<td>'default'</td>\n</tr>\n<tr>\n<td>force</td>\n<td>是否强制刷新缓存，跳过缓存直接请求</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>children</td>\n<td>子元素或渲染函数。函数接收(data, fetchApi)参数</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>数据加载中时的占位内容</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>加载失败时的展示内容</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>自定义加载中状态的展示</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>EnumResource</h3>\n<p>用于获取完整的枚举列表资源。</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>moduleName</td>\n<td>枚举模块名称，支持数组以同时获取多个枚举</td>\n<td>string | string[]</td>\n<td>-</td>\n</tr>\n<tr>\n<td>format</td>\n<td>格式化方式</td>\n<td>'origin' | 'option' | 'default'</td>\n<td>'origin'</td>\n</tr>\n<tr>\n<td>children</td>\n<td>渲染函数，接收枚举列表作为参数</td>\n<td>Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>数据加载中时的占位内容</td>\n<td>ReactNode</td>\n<td>'--'</td>\n</tr>\n<tr>\n<td>error</td>\n<td>加载失败时的展示内容</td>\n<td>ReactNode | Function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>自定义加载中状态的展示</td>\n<td>ReactNode</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>枚举配置</h3>\n<p>枚举数据通过 <code>preset</code> 函数或 <code>PureGlobal/Global</code> 组件的 <code>preset.enums</code> 配置：</p>\n<pre><code class=\"language-javascript\">// 全局配置\npreset({\n  base: {\n    gender: () =&gt; [\n      { value: 'M', description: '男' },\n      { value: 'F', description: '女' }\n    ]\n  }\n});\n\n// 或通过 Global 组件配置\n&lt;PureGlobal preset={{\n  enums: {\n    status: async ({ language }) =&gt; {\n      // 支持异步加载\n      return [\n        { value: '1', description: '启用' },\n        { value: '0', description: '禁用' }\n      ];\n    }\n  }\n}}&gt;\n</code></pre>\n<h3>枚举项数据结构</h3>\n<table>\n<thead>\n<tr>\n<th>字段名</th>\n<th>说明</th>\n<th>类型</th>\n<th>必填</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>value</td>\n<td>枚举值</td>\n<td>string | number</td>\n<td>是</td>\n</tr>\n<tr>\n<td>description</td>\n<td>枚举描述文本</td>\n<td>string</td>\n<td>是</td>\n</tr>\n<tr>\n<td>translation</td>\n<td>多语言翻译对象</td>\n<td>object</td>\n<td>否</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Enum_cf204`,\n        style: ``,\n        list: [{\n    title: `基础用法`,\n    description: `展示枚举的基本使用，包括获取单个枚举值和枚举列表`,\n    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          // 同步加载的枚举\n          gender: [\n            { value: \"M\", description: \"男\" },\n            { value: \"F\", description: \"女\" },\n          ],\n          // 异步加载的枚举\n          status: async ({ locale }) => {\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: \"1\", description: \"启用\" },\n                  { value: \"0\", description: \"禁用\" },\n                ]);\n              }, 500);\n            });\n          },\n        },\n      }}\n    >\n      <Space direction=\"vertical\" size=\"large\" style={{ width: \"100%\" }}>\n        <div>\n          <h4>获取单个枚举值</h4>\n          <Space>\n            <span>性别：</span>\n            <Enum moduleName=\"gender\" name=\"M\" />\n            <Divider type=\"vertical\" />\n            <span>自定义渲染：</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>获取枚举列表</h4>\n          <Enum moduleName=\"gender\">\n            {(list) => {\n              return (\n                <Space>\n                  <span>可选项：</span>\n                  {list.map((item, index) => (\n                    <span key={item.value}>\n                      {item.description}\n                      {index < list.length - 1 && \"、\"}\n                    </span>\n                  ))}\n                </Space>\n              );\n            }}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>渲染为下拉框</h4>\n          <Enum moduleName=\"status\">\n            {(list) => {\n              return (\n                <Select\n                  style={{ width: 150 }}\n                  placeholder=\"请选择状态\"\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>占位符和加载状态</h4>\n          <Space>\n            <span>状态：</span>\n            <Enum \n              moduleName=\"status\" \n              name=\"1\"\n              placeholder=\"加载中...\"\n            />\n          </Space>\n        </div>\n        \n        <div>\n          <h4>使用format=\"option\"直接获取选项格式</h4>\n          <Enum moduleName=\"gender\" format=\"option\">\n            {(list) => (\n              <Select\n                style={{ width: 150 }}\n                placeholder=\"请选择性别\"\n                options={list}\n              />\n            )}\n          </Enum>\n        </div>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n`,\n    scope: [{\n    name: \"_Enum\",\n    packageName: \"@components/Enum\",\n    component: component_18\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_19\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_20\n}]\n},{\n    title: `异步加载与缓存`,\n    description: `展示异步加载枚举数据、Loading状态和强制刷新缓存`,\n    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          // 异步加载枚举数据\n          userStatus: async ({ language }) => {\n            // 模拟从服务器获取数据\n            return new Promise((resolve) => {\n              setTimeout(() => {\n                resolve([\n                  { value: \"active\", description: \"活跃\" },\n                  { value: \"inactive\", description: \"非活跃\" },\n                  { value: \"pending\", description: \"待审核\" },\n                  { value: \"banned\", description: \"已禁用\" },\n                ]);\n              }, 1500);\n            });\n          },\n          // 同步枚举数据\n          priority: [\n            { value: \"low\", description: \"低优先级\" },\n            { value: \"medium\", description: \"中优先级\" },\n            { value: \"high\", description: \"高优先级\" },\n            { value: \"urgent\", description: \"紧急\" },\n          ],\n        },\n      }}\n    >\n      <Space direction=\"vertical\" size=\"large\" style={{ width: \"100%\" }}>\n        <div>\n          <h4>异步加载枚举（带Loading状态）</h4>\n          <Enum \n            key={refreshKey}\n            moduleName=\"userStatus\" \n            name=\"active\"\n            loading={<span>正在加载用户状态...</span>}\n            placeholder=\"--\"\n          >\n            {(data) => <div>当前状态：{data.description}</div>}\n          </Enum>\n        </div>\n        \n        <div>\n          <h4>强制刷新缓存</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(\"已刷新缓存\");\n              }}\n            >\n              刷新缓存\n            </Button>\n          </Space>\n        </div>\n        \n        <div>\n          <h4>同步枚举数据（立即显示）</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`,\n    scope: [{\n    name: \"_Enum\",\n    packageName: \"@components/Enum\",\n    component: component_18\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_19\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_20\n}]\n},{\n    title: `格式化方式`,\n    description: `展示不同的格式化方式和自定义渲染`,\n    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: \"已创建\", color: \"#666\" },\n            { value: \"paid\", description: \"已支付\", color: \"#1890ff\" },\n            { value: \"shipped\", description: \"已发货\", color: \"#52c41a\" },\n            { value: \"completed\", description: \"已完成\", color: \"#52c41a\" },\n            { value: \"cancelled\", description: \"已取消\", color: \"#f5222d\" },\n          ],\n        },\n      }}\n    >\n      <Space direction=\"vertical\" size=\"large\" style={{ width: \"100%\" }}>\n        <Card title=\"不同格式化方式\" size=\"small\">\n          <Space direction=\"vertical\">\n            <div>\n              <strong>默认格式（format=\"default\"）：</strong>\n              <Enum moduleName=\"orderStatus\" name=\"paid\" format=\"default\" />\n            </div>\n            \n            <Divider />\n            \n            <div>\n              <strong>原始对象（format=\"origin\"）：</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>选项格式（format=\"option\"）：</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=\"自定义渲染\" size=\"small\">\n          <Space>\n            <Enum moduleName=\"orderStatus\" name=\"shipped\" format=\"origin\">\n              {(data) => (\n                <span style={{ color: data.color }}>\n                  ● {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`,\n    scope: [{\n    name: \"_Enum\",\n    packageName: \"@components/Enum\",\n    component: component_18\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_19\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_20\n}]\n},{\n    title: `渲染枚举列表`,\n    description: `将枚举列表渲染为各种表单组件`,\n    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: \"技术部\" },\n            { value: \"product\", description: \"产品部\" },\n            { value: \"design\", description: \"设计部\" },\n            { value: \"marketing\", description: \"市场部\" },\n            { value: \"hr\", description: \"人力资源部\" },\n            { value: \"finance\", description: \"财务部\" },\n          ],\n          role: [\n            { value: \"admin\", description: \"管理员\", level: 1 },\n            { value: \"manager\", description: \"经理\", level: 2 },\n            { value: \"employee\", description: \"员工\", level: 3 },\n            { value: \"intern\", description: \"实习生\", level: 4 },\n          ],\n        },\n      }}\n    >\n      <Space direction=\"vertical\" size=\"large\" style={{ width: \"100%\" }}>\n        <div>\n          <h4>渲染为 Select 下拉框</h4>\n          <Enum moduleName=\"department\">\n            {(list) => (\n              <Select\n                style={{ width: 200 }}\n                placeholder=\"请选择部门\"\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>渲染为 Radio 单选组</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>渲染为 Checkbox 多选组</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>渲染为 Table 表格</h4>\n          <Enum moduleName=\"role\" format=\"origin\">\n            {(list) => (\n              <Table\n                size=\"small\"\n                pagination={false}\n                columns={[\n                  { title: \"编码\", dataIndex: \"value\", key: \"value\" },\n                  { title: \"名称\", dataIndex: \"description\", key: \"description\" },\n                  { title: \"级别\", 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`,\n    scope: [{\n    name: \"_Enum\",\n    packageName: \"@components/Enum\",\n    component: component_18\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_19\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_20\n}]\n},{\n    title: `多枚举模块`,\n    description: `同时获取多个枚举模块和错误处理`,\n    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: \"中国\" },\n            { value: \"US\", description: \"美国\" },\n            { value: \"UK\", description: \"英国\" },\n            { value: \"JP\", description: \"日本\" },\n          ],\n          language: [\n            { value: \"zh-CN\", description: \"简体中文\" },\n            { value: \"en-US\", description: \"英语\" },\n            { value: \"ja-JP\", description: \"日语\" },\n            { value: \"ko-KR\", description: \"韩语\" },\n          ],\n          timezone: [\n            { value: \"UTC+8\", description: \"北京时间\" },\n            { value: \"UTC+0\", description: \"格林威治时间\" },\n            { value: \"UTC-5\", description: \"纽约时间\" },\n            { value: \"UTC+9\", description: \"东京时间\" },\n          ],\n        },\n      }}\n    >\n      <Space direction=\"vertical\" size=\"large\" style={{ width: \"100%\" }}>\n        <Card title=\"同时获取多个枚举模块\" size=\"small\">\n          <Enum moduleName={[\"country\", \"language\", \"timezone\"]}>\n            {([countries, languages, timezones]) => (\n              <Space direction=\"vertical\">\n                <div>\n                  <strong>国家列表：</strong>\n                  <Space>\n                    {countries.map(item => (\n                      <Tag key={item.value}>{item.description}</Tag>\n                    ))}\n                  </Space>\n                </div>\n                <div>\n                  <strong>语言列表：</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>时区列表：</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=\"组合使用多个枚举\" size=\"small\">\n          <Space>\n            <span>用户来自</span>\n            <Enum moduleName=\"country\" name=\"CN\">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>，使用</span>\n            <Enum moduleName=\"language\" name=\"zh-CN\">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n            <span>，时区为</span>\n            <Enum moduleName=\"timezone\" name=\"UTC+8\">\n              {(data) => <strong>{data.description}</strong>}\n            </Enum>\n          </Space>\n        </Card>\n        \n        <Card title=\"错误处理\" size=\"small\">\n          <Space direction=\"vertical\">\n            <div>\n              <strong>不存在的枚举模块：</strong>\n              <Enum \n                moduleName=\"notExist\" \n                name=\"test\"\n                error={<span style={{ color: \"red\" }}>枚举加载失败</span>}\n              />\n            </div>\n            <div>\n              <strong>不存在的枚举值（显示占位符）：</strong>\n              <Enum \n                moduleName=\"country\" \n                name=\"XX\"\n                placeholder=\"未知国家\"\n              />\n            </div>\n          </Space>\n        </Card>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<MultiEnumExample />);\n\n`,\n    scope: [{\n    name: \"_Enum\",\n    packageName: \"@components/Enum\",\n    component: component_18\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_19\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_20\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_39 from '@components/Filter';\nimport * as component_40 from 'antd';\nimport * as component_41 from '@components/Filter/doc/mock/tree-data.json';\nconst readmeConfig = {\n    name: `Filter`,\n    summary: ``,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: true,\n        className: `Filter_d7778`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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=\"姓名\" />}\n      list={[\n        [\n          <InputFilterItem label=\"文字\" name=\"text\" />,\n          <CityFilterItem label=\"城市\" name=\"city\" />,\n          <FilterItemContainer name=\"select\" label=\"高级选择\">\n            {(props) => (\n              <div>\n                <AdvancedSelectFilterItem\n                  {...props}\n                  api={{\n                    loader: () => {\n                      return {\n                        pageData: [\n                          { label: \"第一项\", value: 1 },\n                          {\n                            label: \"第二项\",\n                            value: 2,\n                            disabled: true,\n                          },\n                          {\n                            label: \"第三项\",\n                            value: 3,\n                          },\n                        ],\n                      };\n                    },\n                  }}\n                />\n              </div>\n            )}\n          </FilterItemContainer>,\n          <DatePickerFilterItem label=\"日期\" name=\"date\" picker=\"week\" />,\n          <TypeDateRangePickerFilterItem\n            label=\"复杂日期范围\"\n            name=\"type-data-range\"\n            allowEmpty={[true, true]}\n          />,\n          <DateRangePickerFilterItem label=\"日期范围\" name=\"date-range\" />,\n          <SuperSelectFilterItem\n            label=\"选择信息\"\n            name=\"select-value\"\n            options={[\n              {\n                label: \"用户一\",\n                value: 1,\n                description: \"我是用户描述\",\n              },\n              {\n                label: \"用户二\",\n                value: 2,\n                description: \"我是用户描述\",\n              },\n            ]}\n          />,\n          <SuperSelectUserFilterItem\n            label=\"用户选择\"\n            name=\"user\"\n            api={{\n              loader: () => {\n                return {\n                  pageData: [\n                    {\n                      label: \"用户一\",\n                      value: 1,\n                      description: \"我是用户描述\",\n                    },\n                    {\n                      label: \"用户二\",\n                      value: 2,\n                      description: \"我是用户描述\",\n                    },\n                    {\n                      label: \"用户三\",\n                      value: 3,\n                      description: \"我是用户描述\",\n                    },\n                  ],\n                };\n              },\n            }}\n          />,\n          <FunctionSelectFilterItem\n            label=\"职能选择\"\n            name=\"functionLast\"\n            onlyAllowLastLevel\n          />,\n          <FunctionSelectFilterItem\n            label=\"职能选择\"\n            name=\"function\"\n            selectLevel={3}\n            maxLength={3}\n          />,\n          <FunctionSelectFilterItem\n            label=\"职能选择\"\n            name=\"functionSingle\"\n            single\n          />,\n          <IndustrySelectFilterItem\n            label=\"行业选择\"\n            name=\"industryLast\"\n            onlyAllowLastLevel\n          />,\n          <IndustrySelectFilterItem\n            label=\"行业选择\"\n            name=\"industry\"\n            selectLevel={2}\n            maxLength={3}\n          />,\n          <IndustrySelectFilterItem\n            label=\"行业选择\"\n            name=\"industrySingle\"\n            single\n          />,\n        ],\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Filter\",\n    packageName: \"@components/Filter\",\n    component: component_39\n}]\n},{\n    title: `高级筛选`,\n    description: `高级筛选`,\n    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=\"当前城市\" single />],\n        [<CityAdvancedFilterItem name=\"expectCity\" label=\"期望城市\" />],\n        [\n          <ListFilterItem\n            name=\"experience\"\n            label=\"工作经验\"\n            single\n            items={[\n              {\n                value: [null, 1],\n                label: \"1年以下\",\n              },\n              {\n                value: [1, 5],\n                label: \"1-5年\",\n              },\n              { value: [5, null], label: \"5年以上\" },\n            ]}\n            custom={<NumberRangeFilterItem label=\"自定义\" unit=\"年\" />}\n          />,\n        ],\n        [<InputAdvancedFilterItem name=\"company\" label=\"公司\" />],\n      ]}\n      more={[\n        <InputFilterItem label=\"文字\" name=\"text\" />,\n        <CityFilterItem label=\"城市\" name=\"city\" />,\n        <FilterItemContainer name=\"select\" label=\"高级选择\">\n          {(props) => (\n            <div>\n              <AdvancedSelectFilterItem\n                {...props}\n                api={{\n                  loader: () => {\n                    return {\n                      pageData: [\n                        { label: \"第一项\", value: 1 },\n                        {\n                          label: \"第二项\",\n                          value: 2,\n                          disabled: true,\n                        },\n                        {\n                          label: \"第三项\",\n                          value: 3,\n                        },\n                      ],\n                    };\n                  },\n                }}\n              />\n            </div>\n          )}\n        </FilterItemContainer>,\n        <DatePickerFilterItem label=\"日期\" name=\"date\" picker=\"week\" />,\n        <TypeDateRangePickerFilterItem\n          label=\"复杂日期范围\"\n          name=\"type-data-range\"\n          allowEmpty={[true, true]}\n        />,\n        <DateRangePickerFilterItem label=\"日期范围\" name=\"date-range\" />,\n        <UserFilterItem\n          label=\"用户选择\"\n          name=\"user\"\n          api={{\n            loader: () => {\n              return {\n                pageData: [\n                  {\n                    label: \"用户一\",\n                    value: 1,\n                    description: \"我是用户描述\",\n                  },\n                  {\n                    label: \"用户二\",\n                    value: 2,\n                    description: \"我是用户描述\",\n                  },\n                  {\n                    label: \"用户三\",\n                    value: 3,\n                    description: \"我是用户描述\",\n                  },\n                ],\n              };\n            },\n          }}\n        />,\n        <FunctionSelectFilterItem\n          label=\"职能选择\"\n          name=\"function\"\n          onlyAllowLastLevel\n          single\n        />,\n        <IndustrySelectFilterItem\n          label=\"行业选择\"\n          name=\"industry\"\n          onlyAllowLastLevel\n        />,\n      ]}\n    />\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Filter\",\n    packageName: \"@components/Filter\",\n    component: component_39\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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=\"树组件\"\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=\"树组件\"\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`,\n    scope: [{\n    name: \"_Filter\",\n    packageName: \"@components/Filter\",\n    component: component_39\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_40\n},{\n    name: \"_data\",\n    packageName: \"@components/Filter/doc/mock/tree-data.json\",\n    component: component_41\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \"城市\",\n      name: \"city\",\n      value: [\n        { label: \"上海\", value: \"010\" },\n        { label: \"北京\", value: \"020\" },\n      ],\n    },\n    {\n      label: \"职能\",\n      name: \"function\",\n      value: [\n        { label: \"产品经理\", value: \"010\" },\n        { label: \"销售\", value: \"020\" },\n        {\n          label: \"客户经理\",\n          value: \"030\",\n        },\n      ],\n    },\n  ]);\n  return (\n    <Space direction=\"vertical\">\n      <FilterValueDisplay value={value} onChange={setValue} />\n      <Space>\n        <FilterItem label=\"客户\" />\n        <FilterItem label=\"客户\" active />\n        <FilterItem label=\"客户\" open />\n        <FilterItem label=\"超长超长超长超长超长超长超长超长\" active open />\n      </Space>\n      <FilterLines\n        list={[\n          [\n            <FilterItem label=\"客户\" />,\n            <FilterItem label=\"职位\" />,\n            <FilterItem label=\"职位负责人\" />,\n          ],\n          [\n            <FilterItem label=\"开始时间\" />,\n            <FilterItem label=\"结束时间\" />,\n            <FilterItem label=\"职位BD人\" />,\n          ],\n          [\n            <FilterItem label=\"开始时间\" />,\n            <FilterItem label=\"结束时间\" />,\n            <FilterItem label=\"职位BD人\" />,\n          ],\n          [\n            <FilterItem label=\"开始时间\" />,\n            <FilterItem label=\"结束时间\" />,\n            <FilterItem label=\"职位BD人\" />,\n          ],\n        ]}\n      />\n      <PopoverItem label=\"客户\">\n        {({ value, onChange }) => (\n          <Input value={value} onChange={(e) => onChange(e.target.value)} />\n        )}\n      </PopoverItem>\n      <FilterLines\n        list={[\n          [\n            <InputFilterItem label=\"文字\" />,\n            <CityFilterItem label=\"城市\" />,\n            <AdvancedSelectFilterItem\n              label=\"高级选择\"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      { label: \"第一项\", value: 1 },\n                      { label: \"第二项\", value: 2, disabled: true },\n                      {\n                        label: \"第三项\",\n                        value: 3,\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <UserFilterItem\n              label=\"用户选择\"\n              api={{\n                loader: () => {\n                  return {\n                    pageData: [\n                      {\n                        label: \"用户一\",\n                        value: 1,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户二\",\n                        value: 2,\n                        description: \"我是用户描述\",\n                      },\n                      {\n                        label: \"用户三\",\n                        value: 3,\n                        description: \"我是用户描述\",\n                      },\n                    ],\n                  };\n                },\n              }}\n            />,\n            <FunctionSelectFilterItem label=\"职能选择\" />,\n            <IndustrySelectFilterItem label=\"行业选择\" />,\n          ],\n        ]}\n      />\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Filter\",\n    packageName: \"@components/Filter\",\n    component: component_39\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_40\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_8 from '@components/ConfirmButton';\nimport * as component_9 from 'antd';\nimport * as component_10 from '@components/Global';\nconst readmeConfig = {\n    name: `ConfirmButton`,\n    summary: `<h3>何时使用</h3>\n<p>执行操作前确认后再执行</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>message</td>\n<td>删除提示</td>\n<td>jsx</td>\n<td>确定要删除吗？</td>\n</tr>\n<tr>\n<td>title</td>\n<td>删除提示标题</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>isDelete</td>\n<td>是否为删除操作</td>\n<td>boolean</td>\n<td>true</td>\n</tr>\n<tr>\n<td>onClick</td>\n<td>点击确认后执行的事件</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>onCancel</td>\n<td>点击取消后执行的事件</td>\n<td>function</td>\n<td>-</td>\n</tr>\n<tr>\n<td>disabled</td>\n<td>按钮是否禁用</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showCancel</td>\n<td>是否显示取消按钮</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>cancelText</td>\n<td>取消按钮文案</td>\n<td>string</td>\n<td>取消</td>\n</tr>\n<tr>\n<td>okText</td>\n<td>确认按钮文案</td>\n<td>string</td>\n<td>确认</td>\n</tr>\n<tr>\n<td>isModal</td>\n<td>是否以弹窗方式展示，默认为Popconfirm</td>\n<td>boolean</td>\n<td>false</td>\n</tr>\n<tr>\n<td>placement</td>\n<td>当isModal为false时生效，指定Popconfirm的弹出方向</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>getContainer</td>\n<td>指定Popconfirm或Modal弹出位置，一般不需要指定</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>ConfirmLink</h3>\n<p>另外的一种按钮形式参数同ConfirmButton</p>\n<h3>withConfirm</h3>\n<p>高阶组件可以自定义按钮</p>`,\n    example: {\n        isFull: false,\n        className: `ConfirmButton_5f815`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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=\"确定要删除吗\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          非警告-气泡-正文\n        </ConfirmButton>\n        <ConfirmButton\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          警告-气泡-正文\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          title=\"确定要删除吗？\"\n          isDelete={false}\n          message=\"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          非警告-气泡-标题正文\n        </ConfirmButton>\n        <ConfirmButton\n          title=\"确定要删除吗？\"\n          message=\"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          警告-气泡-标题正文\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          isDelete={false}\n          message=\"确定提交XX吗？\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          非警告-modal-正文\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          警告-modal-正文\n        </ConfirmButton>\n      </Space>\n      <Space>\n        <ConfirmButton\n          isModal\n          title=\"确定提交XX吗？\"\n          isDelete={false}\n          message=\"这里显示详情说明这里显示详情说明这里显示详情说明这里显示详情说明这里显示详情说明\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          非警告-modal-标题正文\n        </ConfirmButton>\n        <ConfirmButton\n          isModal\n          title=\"确定要删除吗？\"\n          message=\"确定要删除确定要删除确定要删除确定要删除确定要删除确定要删除\"\n          onClick={() => {\n            console.log(\"执行删除\");\n          }}\n        >\n          有title的Modal确认删除\n        </ConfirmButton>\n      </Space>\n      <ConfirmLink\n        onClick={() => {\n          console.log(\"执行删除\");\n        }}\n      >\n        Link-警告-气泡-正文\n      </ConfirmLink>\n    </Space>\n  );\n};\n\nrender(\n  <PureGlobal>\n    <BaseExample />\n  </PureGlobal>\n);\n\n`,\n    scope: [{\n    name: \"_ConfirmButton\",\n    packageName: \"@components/ConfirmButton\",\n    component: component_8\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_9\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_10\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_67 from '@components/Image';\nimport * as component_68 from '@components/Global';\nimport * as component_69 from 'antd';\nconst readmeConfig = {\n    name: `Image`,\n    summary: `<p>用于展示一张图片，和img标签不同的是，可以展示一张普通图片，也可以通过id加载一张oss图片，在加载oss地址和图片数据的时候会显示loading状态</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>src</td>\n<td>图片的src地址</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>id</td>\n<td>oss的id</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>loading</td>\n<td>加载时显示的组件</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>error</td>\n<td>加载错误时显示的组件</td>\n<td>jsx</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>Image.Avatar</h3>\n<p>用antd的Avatar来显示图片，可以显示默认的男女头像，其他参数参考antd的Avatar组件</p>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>gender</td>\n<td>性别 F，female，f为女其他为男</td>\n<td>string</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Image_be53a`,\n        style: ``,\n        list: [{\n    title: `通过src加载一个普通图片`,\n    description: `通过src加载一个普通图片`,\n    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`,\n    scope: [{\n    name: \"_Image\",\n    packageName: \"@components/Image\",\n    component: component_67\n}]\n},{\n    title: `通过id加载一个oss图片`,\n    description: `图片一加载成功，图片二加载中，图片三加载失败`,\n    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`,\n    scope: [{\n    name: \"_Image\",\n    packageName: \"@components/Image\",\n    component: component_67\n},{\n    name: \"global\",\n    packageName: \"@components/Global\",\n    component: component_68\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_69\n}]\n},{\n    title: `显示一个头像`,\n    description: `显示图片头像和默认头像`,\n    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`,\n    scope: [{\n    name: \"_Image\",\n    packageName: \"@components/Image\",\n    component: component_67\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_69\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_56 from '@components/Global';\nimport * as component_57 from 'antd';\nimport * as component_58 from '@components/Icon';\nconst readmeConfig = {\n    name: `Global`,\n    summary: `<h3>何时使用</h3>\n<p>在使用components-core的任何组件的业务系统，需要将该组件放置于最外层，并且按照要求正确设置preset。</p>\n<p>以下是components-core组件系统中需要设置的preset值，及使用这些值的组件</p>\n<table>\n<thead>\n<tr>\n<th>名称</th>\n<th>说明</th>\n<th>类型</th>\n<th>使用组件</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>permissions</td>\n<td>配置功能权限列表，Permissions根据该列表里面是否存在某权限名称判断用户是否具有该功能权限，来控制对应操作行为</td>\n<td>array</td>\n<td>Permissions</td>\n</tr>\n<tr>\n<td>ajax</td>\n<td>用于发送ajax请求的方法，一般情况下其应该是一个axios对象</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>用于和后端进行一些交互行为的接口集合</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.oss</td>\n<td>用于通过一个ossId向后端oss服务获取一个可以访问到指定文件的url</td>\n<td>object</td>\n<td>Image</td>\n</tr>\n<tr>\n<td>apis.ossUpload</td>\n<td>用于向oss服务上传一个文件</td>\n<td>object</td>\n<td>FormInfo.Upload,FormInfo.Avatar</td>\n</tr>\n<tr>\n<td>features</td>\n<td>用于配置系统的特性参数</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.profile</td>\n<td>系统的特性列表参考组件Features</td>\n<td>object</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>features.debug</td>\n<td>特性的调试模式，可以在控制台打印Features的id和状态</td>\n<td>boolean</td>\n<td>Features</td>\n</tr>\n<tr>\n<td>enums</td>\n<td>公共枚举值，详情参看Enum组件</td>\n<td>object</td>\n<td>Enum</td>\n</tr>\n<tr>\n<td>enums.helperGuide</td>\n<td>帮助文档枚举配置</td>\n<td>function</td>\n<td>HelperGuide</td>\n</tr>\n<tr>\n<td>formInfo</td>\n<td>表单配置</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n<tr>\n<td>formInfo.rules</td>\n<td>表单规则配置</td>\n<td>object</td>\n<td>FormInfo.formModule</td>\n</tr>\n</tbody>\n</table>\n<p>全局context管理设置及默认样式</p>\n<ul>\n<li>请将全局覆盖性的样式放在此组件中</li>\n<li>请将字体文件的引用放在此组件中</li>\n<li>请将antd的覆盖性样式放在此组件中</li>\n<li>该组件需要放置在应用根位置</li>\n</ul>\n<p>更新字体文件:</p>\n<ul>\n<li>将iconfont上下载的字体包解压后放在public文件夹下面</li>\n<li>更新src/common/params.js 中的变量 iconfontBase</li>\n<li>修改后构建该项目发布到对应环境</li>\n</ul>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>preset</td>\n<td>全局预设参数，可以通过usePreset获取，由业务系统设置</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>themeToken</td>\n<td>设置主题，参看antd的themeToken，一般只需要设置{colorPrimary}</td>\n<td>object</td>\n<td>{}</td>\n</tr>\n<tr>\n<td>init</td>\n<td>初始化方法，在系统首次加载时执行，可以返回Promise。用来放置系统显示之前的异步操作</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>\n<h3>PureGlobal</h3>\n<p>api同Global，但是少了页面错误捕获和className:container-body带来的默认最小宽度等样式设置，主要用在组件库的演示环境和弹窗中</p>\n<h3>usePreset</h3>\n<p>获取预设的preset，已经确定为系统需要使用的key值:permissions,apis,formOptions,modalOptions</p>\n<h3>useGlobalContext</h3>\n<p>获取和设置全局状态，该状态保存在Global组件一级，不会随着内部组件本身的销毁而销毁。\n主要给组件内部使用，业务应该避免使用该api设置新的global变量。业务如果有需要应当自行在顶级组件中设置context。</p>\n<h4>params:useGlobalContext(globalKey)</h4>\n<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>globalKey</td>\n<td>全局参数的key，当存在globalKey时，默认获取和设置都是global[key]，当不存在globalKey获取和设置的都是global，除非存在多个获取和设置global的key-value，否则不推荐直接使用不存在globalKey的情况</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>global</td>\n<td>当前的global值</td>\n<td>any</td>\n</tr>\n<tr>\n<td>setGlobal</td>\n<td>设置当前的global值</td>\n<td>function</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Global_4cc66`,\n        style: `.Global_4cc66 .label {\n  font-weight: bold;\n}`,\n        list: [{\n    title: `基本示例`,\n    description: `展示了文字大小颜色行高的设置`,\n    code: `const { PureGlobal } = _Global;\nconst { Space, Divider } = antd;\nconst BaseExample = () => {\n    return (\n        <PureGlobal>\n            <Space direction=\"vertical\">\n                <div className=\"label\">文字大小:</div>\n                <div style={{ fontSize: 'var(--font-size-large)' }}>大号文字</div>\n                <div>默认大小文字</div>\n                <div style={{ fontSize: 'var(--font-size-small)' }}>小号文字</div>\n                <Divider />\n                <div className=\"label\">文字颜色:</div>\n                <div style={{ color: 'var(--font-color)' }}>默认颜色</div>\n                <div style={{ color: 'var(--font-color-grey)' }}>灰色</div>\n                <div style={{ color: 'var(--font-color-grey-1)' }}>灰色1</div>\n                <div style={{ color: 'var(--font-color-grey-2)' }}>灰色2</div>\n                <Divider />\n                <div className=\"label\">行高:</div>\n                <div style={{ lineHeight: 'var(--line-height-large)' }}>\n                    宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高宽松行高\n                </div>\n                <div>\n                    默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高默认行高\n                </div>\n                <div style={{ lineHeight: 'var(--line-height-small)' }}>\n                    紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高紧凑行高\n                </div>\n            </Space>\n        </PureGlobal>\n    );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_56\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_57\n}]\n},{\n    title: `警告提示`,\n    description: `展示了警告提示的覆盖样式`,\n    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=\"这是一条操作成功的状态反馈\" type=\"success\" showIcon />\n        <Alert message=\"这是一条普通的信息说明\" type=\"info\" showIcon />\n        <Alert message=\"这是一条提示信息\" type=\"warning\" showIcon />\n        <Alert message=\"这是一条请求失败的状态反馈\" type=\"error\" showIcon />\n        <Alert\n          message=\"这是一条警示信息\"\n          type=\"error\"\n          showIcon\n          icon={<Icon colorful type=\"icon-color-caisejingshi\" />}\n        />\n\n        <Alert\n          message=\"这是一条操作成功的状态反馈\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"success\"\n          showIcon\n        />\n        <Alert\n          message=\"这是一条普通的信息说明\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"info\"\n          showIcon\n        />\n        <Alert\n          message=\"这是一条提示信息\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"warning\"\n          showIcon\n        />\n        <Alert\n          message=\"这是一条请求失败的状态反馈\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"error\"\n          showIcon\n        />\n        <Alert\n          message=\"这是一条警示信息\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"error\"\n          showIcon\n          icon={<Icon colorful type=\"icon-color-caisejingshi\" />}\n        />\n\n        <Alert\n          message=\"这是一条操作成功的状态反馈\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"success\"\n          showIcon\n          closable\n        />\n        <Alert\n          message=\"这是一条普通的信息说明\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"info\"\n          showIcon\n          closable\n        />\n        <Alert\n          message=\"这是一条提示信息\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"warning\"\n          showIcon\n          closable\n        />\n        <Alert\n          message=\"这是一条请求失败的状态反馈\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\n          type=\"error\"\n          showIcon\n          closable\n        />\n        <Alert\n          message=\"这是一条警示信息\"\n          description=\"提示提示提示提示提示提示提示提示提示\"\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`,\n    scope: [{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_56\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_57\n},{\n    name: \"icon\",\n    packageName: \"@components/Icon\",\n    component: component_58\n}]\n},{\n    title: `按钮`,\n    description: `展示了按钮的覆盖样式`,\n    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\">大按钮</Button>\n          <Button>默认按钮</Button>\n          <Button size=\"small\">小按钮</Button>\n        </Space>\n        <Space>\n          <Button type=\"primary\">按钮</Button>\n          <Button type=\"link\">按钮</Button>\n          <Button type=\"text\">按钮</Button>\n        </Space>\n        <Space>\n          <Button danger>危险按钮</Button>\n          <Button type=\"primary\" danger>\n            危险按钮\n          </Button>\n          <Button type=\"link\" danger>\n            危险按钮\n          </Button>\n          <Button type=\"text\" danger>\n            危险按钮\n          </Button>\n        </Space>\n        <Space>\n          <Button disabled>禁用按钮</Button>\n          <Button type=\"primary\" danger disabled>\n            禁用危险按钮\n          </Button>\n          <Button type=\"link\" disabled>\n            禁用Link按钮\n          </Button>\n          <Button type=\"text\" disabled>\n            禁用Text按钮\n          </Button>\n        </Space>\n        <Space>\n          <Button type=\"text\" icon={<Icon type=\"icon-tianjia\" />}>\n            图标按钮\n          </Button>\n          <Button type=\"text\">\n            图标按钮右\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文字</Typography.Link>\n          <Typography.Text className=\"ant-btn\">文字</Typography.Text>\n          <Typography.Link>\n            <Icon type=\"icon-tianjia\" />\n            Link文字\n          </Typography.Link>\n          <Typography.Text className=\"ant-btn\">\n            <Icon type=\"icon-tianjia\" />\n            文字\n          </Typography.Text>\n          <Typography.Link className=\"ant-btn-dangerous\">\n            Link文字\n          </Typography.Link>\n        </Space>\n        <Space>\n          <Button className=\"btn-no-padding\" type=\"link\" size=\"large\">\n            大按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"link\">\n            默认按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"link\" size=\"small\">\n            小按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"text\" size=\"large\">\n            大按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"text\">\n            默认按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"text\" size=\"small\">\n            小按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"link\" size=\"large\" danger>\n            大按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"link\" danger>\n            默认按钮\n          </Button>\n          <Button className=\"btn-no-padding\" type=\"link\" size=\"small\" danger>\n            小按钮\n          </Button>\n        </Space>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_56\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_57\n},{\n    name: \"icon\",\n    packageName: \"@components/Icon\",\n    component: component_58\n}]\n},{\n    title: `无边框标签`,\n    description: `展示了无边框标签`,\n    code: `const { PureGlobal } = _Global;\nconst { Tag, Space } = antd;\n\nconst BasicExample = () => {\n  return (\n    <PureGlobal>\n      <Space>\n        <Tag className=\"no-border\" closable>\n          标签1\n        </Tag>\n        <Tag className=\"no-border\" closable>\n          标签2\n        </Tag>\n        <Tag className=\"no-border\" closable>\n          标签3\n        </Tag>\n      </Space>\n    </PureGlobal>\n  );\n};\n\nrender(<BasicExample />);\n\n`,\n    scope: [{\n    name: \"_Global\",\n    packageName: \"@components/Global\",\n    component: component_56\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_57\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_109 from '@components/Tooltip';\nimport * as component_110 from 'antd/lib/space';\nimport * as component_111 from '@components/FormInfo';\nimport * as component_112 from '@kne/react-fetch';\nimport * as component_113 from '@components/Descriptions';\nimport * as component_114 from '@components/StateTag';\nconst readmeConfig = {\n    name: `Tooltip`,\n    summary: `<p>简单的文字提示气泡框</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>默认宽度 360，small 宽度 240</td>\n<td>string</td>\n<td>-</td>\n</tr>\n<tr>\n<td>title</td>\n<td>标题内容</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>showInfo</td>\n<td>展示标题旁的提示按钮</td>\n<td>boolean</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfo</td>\n<td>重要内容</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>subtitle</td>\n<td>副标题</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>content</td>\n<td>内容</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>importantInfoType</td>\n<td>重要内容类型，success,error,warning</td>\n<td>string,jsx</td>\n<td>-</td>\n</tr>\n<tr>\n<td>moreInfo</td>\n<td>其他内容</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>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>api</td>\n<td>获取数据的接口，参考@kne/react-fetch</td>\n<td>object</td>\n<td>-</td>\n</tr>\n<tr>\n<td>fetchContent</td>\n<td>当api接口返回值的时候调用，可以获取到接口参数，返回值会更新到Tootip的参数中</td>\n<td>function</td>\n<td>-</td>\n</tr>\n</tbody>\n</table>`,\n    example: {\n        isFull: false,\n        className: `Tooltip_c9830`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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=\"姓名\" name=\"name\" rule=\"REQ\" />,\n          <TypeDateRangePicker\n            name=\"type_date\"\n            label=\"日期时间段\"\n            rule=\"REQ\"\n          />,\n          <Space\n            style={{\n              width: \"100%\",\n              justifyContent: \"end\",\n            }}\n          >\n            <CancelButton>取消</CancelButton>\n            <SubmitButton>确定</SubmitButton>\n          </Space>,\n        ]}\n      />\n    </Form>\n  );\n};\n\nconst BaseExample = () => {\n  return (\n    <Space>\n      <Tooltip content=\"这里显示完整的信息\">小段信息</Tooltip>\n      <Tooltip\n        size=\"small\"\n        content=\"这里显示完整的信息完整的信息，这里显示完整的信息完整的信息这里显示完整的信息完整的信息这里显示完整的信息完整的信息，这里显示完整的信息。\"\n      >\n        大段信息\n      </Tooltip>\n      <Tooltip title=\"标题\" content=\"内容描述内容描述内容。\">\n        带有标题的小段信息\n      </Tooltip>\n      <Tooltip\n        title=\"标题\"\n        content=\"内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述\"\n      >\n        带有标题的大段信息\n      </Tooltip>\n      <Tooltip\n        importantInfo=\"筛选日期范围内，职位上安排顾问面试的候选人总数。根据所填写的顾问【面试面试】时间来进行统计，而非在系统的操作时间。\"\n        subtitle=\"示例:\"\n        content=\"2022.10.21在系统操作顾问面试，但填写的顾问面试时间为2022.10.20，则数据会统计在2022.10.20，而非2022.10.21 。\"\n      >\n        带有重要信息\n      </Tooltip>\n      <TooltipInfoLabel\n        title=\"带有Info信息\"\n        tooltipTitle={{\n          importantInfo:\n            \"筛选日期范围内，职位上安排顾问面试的候选人总数。根据所填写的顾问【面试面试】时间来进行统计，而非在系统的操作时间。\",\n          subtitle: \"示例:\",\n          content:\n            \"2022.10.21在系统操作顾问面试，但填写的顾问面试时间为2022.10.20，则数据会统计在2022.10.20，而非2022.10.21 。\",\n        }}\n      />\n      <Tooltip\n        trigger=\"click\"\n        title=\"标题\"\n        content=\"辅助信息描述内容辅助信息描述内容辅助信息描述内容辅助信息描述内容辅助信息描述内容\"\n        moreInfo={<MoreInfo />}\n      >\n        带有表单信息\n      </Tooltip>\n    </Space>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Tooltip\",\n    packageName: \"@components/Tooltip\",\n    component: component_109\n},{\n    name: \"space\",\n    packageName: \"antd/lib/space\",\n    component: component_110\n},{\n    name: \"formInfo\",\n    packageName: \"@components/FormInfo\",\n    component: component_111\n}]\n},{\n    title: `带有远程数据加载的提示`,\n    description: `展示带有远程数据加载的提示`,\n    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: \"腾讯\",\n              title: \"腾讯科技公司\",\n              type: \"增值税专用发票\",\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: \"客户名称\", content: data.clientName },\n                  { label: \"发票抬头\", content: data.title },\n                ],\n                [\n                  { label: \"发票类型\", content: data.type },\n                  { label: \"发票日期\", content: data.date },\n                ],\n              ]}\n            />\n          ),\n        };\n      }}\n    >\n      <StateTag text=\"哈哈哈\" />\n    </TooltipFetch>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_Tooltip\",\n    packageName: \"@components/Tooltip\",\n    component: component_109\n},{\n    name: \"reactFetch\",\n    packageName: \"@kne/react-fetch\",\n    component: component_112\n},{\n    name: \"_Descriptions\",\n    packageName: \"@components/Descriptions\",\n    component: component_113\n},{\n    name: \"_StateTag\",\n    packageName: \"@components/StateTag\",\n    component: component_114\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_42 from '@components/FlexBox';\nimport * as component_43 from 'antd';\nimport * as component_44 from 'lodash';\nconst readmeConfig = {\n    name: `FlexBox`,\n    summary: `<p>用于根据盒子大小响应式展示不同列</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: true,\n        className: `FlexBox_51df0`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_FlexBox\",\n    packageName: \"@components/FlexBox\",\n    component: component_42\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_43\n}]\n},{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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: \\`第\\${index}项\\`,\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        获取FetchApi\n      </Button>\n    </div>\n  );\n};\n\nrender(<BaseExample />);\n\n`,\n    scope: [{\n    name: \"_FlexBox\",\n    packageName: \"@components/FlexBox\",\n    component: component_42\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_43\n},{\n    name: \"lodash\",\n    packageName: \"lodash\",\n    component: component_44\n}]\n}]\n    }\n};\nexport default readmeConfig;\n","import * as component_59 from '@components/HistoryStore';\nimport * as component_60 from 'antd';\nconst readmeConfig = {\n    name: `HistoryStore`,\n    summary: `<p>历史记录提示</p>`,\n    \n    \n    api: `<table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n</tr>\n</thead>\n</table>`,\n    example: {\n        isFull: false,\n        className: `HistoryStore_a963f`,\n        style: ``,\n        list: [{\n    title: `这里填写示例标题`,\n    description: `这里填写示例说明`,\n    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`,\n    scope: [{\n    name: \"_HistoryStore\",\n    packageName: \"@components/HistoryStore\",\n    component: component_59\n},{\n    name: \"antd\",\n    packageName: \"antd\",\n    component: component_60\n}]\n}]\n    }\n};\nexport default readmeConfig;\n"],"names":["name","summary","api","example","isFull","className","style","list","title","description","code","scope","packageName","component","_ref","overlayClassName","storeName","maxLength","label","children","onSelect","zIndex","getPopupContainer","setList","useState","localStorage","getItem","open","setOpen","openHistory","useCallback","length","storeNameRef","useRef","current","useEffect","setItem","appendHistory","item","value","newList","dropWhile","splice","uniqBy","slice","close","outerRef","useClickOutside","popoverChildrenRef","popoverContentRef","contains","target","onSelectRef","width","setWidth","useLayoutEffect","callback","clientWidth","resizeObserver","ResizeObserver","observe","mutationObserver","MutationObserver","subtree","childList","disconnect","_jsx","Popover","placement","transitionName","arrow","classnames","content","ref","_jsxs","Space","direction","wrap","map","StateTag","text","type","onClick","setOnSelect","ButtonText"],"ignoreList":[],"sourceRoot":""}