@uiw/doc 4.11.6 → 4.12.2

package/web/static/js/581.264f67be.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/581.264f67be.chunk.js","mappings":"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","sources":["../../node_modules/@babel/standalone|sync|nonrecursive","components/Markdown/Code.tsx","components/Markdown/Footer.tsx","webpack://website/./src/components/Markdown/index.module.less?6e49","components/Markdown/index.tsx","routes/components/breadcrumb/index.tsx"],"sourcesContent":["function webpackEmptyContext(req) {\n\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\te.code = 'MODULE_NOT_FOUND';\n\tthrow e;\n}\nwebpackEmptyContext.keys = function() { return []; };\nwebpackEmptyContext.resolve = webpackEmptyContext;\nwebpackEmptyContext.id = 84934;\nmodule.exports = webpackEmptyContext;","import CodePreview, { CodePreviewProps } from '@uiw/react-code-preview';\n\nexport interface CodeProps extends CodePreviewProps {\n  code: string;\n  version: string;\n  codePen: boolean;\n  codeSandbox?: boolean;\n  dependencies: any;\n}\n\nexport default function Code({ version, dependencies, codePen, codeSandbox, ...other }: CodeProps) {\n  const props: CodePreviewProps = { ...other };\n  if (codePen) {\n    props.codePenOption = {\n      title: `uiw${version} - demo`,\n      includeModule: ['uiw'],\n      js: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n      html: '<div id=\"container\" style=\"padding: 24px\"></div>',\n      css_external: `https://unpkg.com/uiw@${version}/dist/uiw.min.css`,\n      js_external: `https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@${version}/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js`,\n    };\n  }\n  if (codeSandbox) {\n    props.codeSandboxOption = {\n      files: {\n        'sandbox.config.json': {\n          content: `{\n            \"template\": \"node\",\n            \"container\": {\n              \"startScript\": \"start\",\n              \"node\": \"14\"\n            }\n          }`,\n        },\n        'public/index.html': {\n          content: `<div id=\"container\"></div>`,\n        },\n        'src/index.js': {\n          content: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n        },\n        '.kktrc.js': {\n          content: `import lessModules from \"@kkt/less-modules\";\\nexport default (conf, env, options) => {\\nconf = lessModules(conf, env, options);\\nreturn conf;\\n};`,\n        },\n        'package.json': {\n          content: {\n            name: 'uiw-demo',\n            description: `uiw v${version} - demo`,\n            dependencies: {\n              react: '^17.0.2',\n              'react-dom': '^17.0.2',\n              uiw: 'latest',\n            },\n            devDependencies: {\n              '@kkt/less-modules': '~7.1.1',\n              kkt: '~7.1.5',\n            },\n            license: 'MIT',\n            scripts: {\n              start: 'kkt start',\n              build: 'kkt build',\n              test: 'kkt test --env=jsdom',\n            },\n            browserslist: ['>0.2%', 'not dead', 'not ie <= 11', 'not op_mini all'],\n          },\n        },\n      },\n    };\n  }\n  return <CodePreview {...props} dependencies={dependencies} style={{ marginBottom: 0 }} />;\n}\n","import React, { Fragment } from 'react';\nimport { Divider } from 'uiw';\n\nexport type FooterProps = {\n  path?: string;\n};\n\nexport default function (props: FooterProps = {}) {\n  const { path } = props;\n  const url = /^http/.test(path || '') ? path : `https://github.com/uiwjs/uiw/blob/master/${path}`;\n  return (\n    <Fragment>\n      犯了错误还是想对文件做出贡献？\n      {url && (\n        <a href={url} target=\"_blank\" rel=\"noopener noreferrer\">\n          在Github上编辑本页！\n        </a>\n      )}\n      <br />\n      <a href=\"https://github.com/uiwjs/uiw/issues\" target=\"_blank\" rel=\"noopener noreferrer\">\n        反馈建议\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw/issues/new\">\n        提交bug\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw\">\n        Github\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt\">\n        kkt\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt-ssr\">\n        @kkt/ssr\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"http://uiw.gitee.io\">\n        国内镜像\n      </a>\n    </Fragment>\n  );\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"docinfo\":\"index_docinfo__3Vx8S\",\"markdown\":\"index_markdown__hcQCp\"};","import { useEffect, useState } from 'react';\nimport MarkdownPreview from '@uiw/react-markdown-preview';\nimport pkg from 'uiw/package.json';\nimport Code from './Code';\nimport Footer from './Footer';\nimport styles from './index.module.less';\n\nexport type CreatePageProps<T> = {\n  dependencies?: T;\n  path: string;\n  renderPage?: () => Promise<string>;\n};\n\nconst getCodeStr = (data: any[] = [], code: string = '') => {\n  data.forEach((node) => {\n    if (node.type === 'text') {\n      code += node.value;\n    } else if (node.children && Array.isArray(node.children)) {\n      code += getCodeStr(node.children);\n    }\n  });\n  return code;\n};\n\nexport default function CreatePage<T>(props: CreatePageProps<T>) {\n  const { renderPage, dependencies, path } = props;\n  const [mdStr, setMdStr] = useState('');\n\n  const version = pkg.version || '2.0.0';\n  useEffect(() => {\n    if (renderPage) {\n      renderPage()\n        .then((str) => {\n          setMdStr(str);\n        })\n        .catch(() => {});\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  if (!mdStr) {\n    return null;\n  }\n\n  return (\n    <div>\n      <MarkdownPreview\n        source={mdStr}\n        className={styles.markdown}\n        components={{\n          /**\n           * bordered 边框\n           * bgWhite 设置代码预览背景白色，否则为格子背景。\n           * noCode 不显示代码编辑器。\n           * noPreview 不显示代码预览效果。\n           * noScroll 预览区域不显示滚动条。\n           * codePen 显示 Codepen 按钮，要特别注意 包导入的问题，实例中的 import 主要用于 Codepen 使用。\n           */\n          code: ({ inline, node, ...props }) => {\n            const { noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox } = props as any;\n            if (inline) {\n              return <code {...props} />;\n            }\n            const config = {\n              noPreview,\n              bordered,\n              noScroll,\n              bgWhite,\n              noCode,\n              codePen,\n              codeSandbox,\n            } as any;\n            if (Object.keys(config).filter((name) => config[name] !== undefined).length === 0) {\n              return <code {...props} />;\n            }\n            return (\n              <Code\n                version={version}\n                code={getCodeStr(node.children)}\n                dependencies={dependencies}\n                {...{ noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox }}\n              />\n            );\n          },\n        }}\n      />\n      <div className={styles.docinfo}>\n        <Footer path={path} />\n      </div>\n    </div>\n  );\n}\n","import React from 'react';\nimport { Breadcrumb, Icon, Divider } from 'uiw';\nimport Markdown from '../../../components/Markdown';\n\nexport default function Page() {\n  return (\n    <Markdown\n      path=\"https://github.com/uiwjs/uiw/tree/master/packages/react-breadcrumb/README.md\"\n      dependencies={{ Breadcrumb, Icon, Divider }}\n      renderPage={async () => {\n        const md = await import('uiw/node_modules/@uiw/react-breadcrumb/README.md');\n        return md.default || md;\n      }}\n    />\n  );\n}\n"],"names":["webpackEmptyContext","req","e","Error","code","keys","resolve","id","module","exports","Code","version","dependencies","codePen","codeSandbox","other","props","codePenOption","title","includeModule","js","replace","html","css_external","js_external","codeSandboxOption","files","content","name","description","react","uiw","devDependencies","kkt","license","scripts","start","build","test","browserslist","style","marginBottom","path","url","Fragment","href","target","rel","type","getCodeStr","data","forEach","node","value","children","Array","isArray","CreatePage","renderPage","useState","mdStr","setMdStr","pkg","useEffect","then","str","catch","source","className","styles","components","inline","noPreview","bordered","noScroll","bgWhite","noCode","config","Object","filter","undefined","length","Footer","Page","Breadcrumb","Icon","Divider","md","default"],"sourceRoot":""}

package/web/static/js/5821.41b747c6.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[5821],{95821:function(n,t,e){e.r(t),t.default='Alert \u786e\u8ba4\u5bf9\u8bdd\u6846\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-alert/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-alert.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-alert)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-alert.svg?label=@uiw/react-alert)](https://npmjs.com/@uiw/react-alert)\n\n\u5f39\u51fa\u5bf9\u8bdd\u6846\u4f1a\u5728\u7ee7\u7eed\u4e4b\u524d\uff0c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\uff0c\u70b9\u51fb\u786e\u5b9a\u540e\u5f02\u6b65\u5173\u95ed\u5bf9\u8bdd\u6846\u3002\n\n```jsx\nimport { Alert } from \'uiw\';\n// or\nimport Alert from \'@uiw/react-alert\';\n```\n\n## \u57fa\u672c\u7528\u6cd5\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, ButtonGroup, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible1: false,\n      visible2: false,\n    }\n  }\n  onClick(type) {\n    this.setState({ [type]: !this.state[type] });\n  }\n  onClosed(type) {\n    this.setState({ [type]: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          isOpen={this.state.visible1}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          onClosed={this.onClosed.bind(this, \'visible1\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible2}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="danger"\n          onConfirm={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\')}\n          onCancel={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\')}\n          onClosed={this.onClosed.bind(this, \'visible2\')}\n        >\n          \u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u6216 \u201c<b>\u53d6\u6d88\u6309\u94ae</b>\u201d \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u89e6\u53d1 \u201c<b>onConfirm</b>\u201d \u6216 \u201c<b>onCancel</b>\u201d \u4e8b\u4ef6\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002\n        </Alert>\n        <ButtonGroup>\n          <Button onClick={this.onClick.bind(this, \'visible1\')}>\u5355\u4e2a\u6309\u94ae\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n          <Button onClick={this.onClick.bind(this, \'visible2\')}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n        </ButtonGroup>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## \u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846\n\n\u8fd9\u91cc\u662f\u5229\u7528 `Promise` \u7b49\u5b83\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible: false,\n    }\n  }\n  onClick() {\n    this.setState({ visible: !this.statevisible });\n  }\n  onClosed() {\n    this.setState({ visible: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          icon="delete"\n          isOpen={this.state.visible}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          type="danger"\n          onConfirm={() => {\n            console.log(\'\u786e\u5b9a\u56de\u8c03\uff01, \u8fd9\u91cc\u662f\u5229\u7528Promise\u7b49\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3\');\n            return new Promise((resolve, reject) => {\n              const random = Math.random();\n              console.log(\'\u6d4b\u8bd5\uff0c\u968f\u673a\u503c\u5927\u4e8e 0.5 \u6267\u884c resolve \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c reject \u89e6\u53d1 catch \u9519\u8bef\', random, random > 0.5)\n              setTimeout(random > 0.5 ? resolve : reject, 3000);\n            }).catch(() => {\n              // \u53ef\u4ee5\u901a\u8fc7\u4e0b\u9762\u65b9\u5f0f\uff0c\u963b\u6b62\u5f39\u6846\u6d88\u5931\n              // throw new Error();\n            });\n          }}\n          onClosed={this.onClosed.bind(this, \'visible\')}\n        >\n          \u8fd9\u91cc\u662f\u5229\u7528 <b>Promise</b> \u7684\u7279\u6027\uff0c\u7b49\u5b83\u6267\u884c\u5b8c\u6210\u540e\uff0c\u518d\u53bb\u5173\u95ed\u7a97\u53e3\uff0c\u8fbe\u5230\u5ef6\u8fdf\u5173\u95ed\u7684\u6548\u679c\u3002<br /><br />\n          \u8fd9\u4e2a\u6d4b\u8bd5\u4f8b\u5b50\uff0c\u751f\u6210\u968f\u673a\u503c\u5224\u65ad\u662f\u5426\u5927\u4e8e <b>0.5</b> \u6267\u884c <b>resolve</b> \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c <b>reject</b> \u89e6\u53d1 <b>catch</b> \u9519\u8bef\u3002\n        </Alert>\n        <Button onClick={this.onClick.bind(this, \'visible\')}>\u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846</Button>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## \u5e26\u56fe\u6807\u7684\u5f39\u51fa\u6846\n\n\u901a\u8fc7\u8bbe\u7f6e `icon` \u548c `type` \u53c2\u6570\u8bbe\u7f6e\u5e26\u72b6\u6001\u7684\u5f39\u51fa\u5bf9\u8bdd\u6846\u3002\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, ButtonGroup, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible1: false,\n      visible2: false,\n    }\n  }\n  onClick(type) {\n    this.setState({ [type]: !this.state[type] });\n  }\n  onClosed(type) {\n    this.setState({ [type]: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          isOpen={this.state.visible1}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="information"\n          type="primary"\n          onClosed={this.onClosed.bind(this, \'visible1\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible2}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="circle-check"\n          type="success"\n          onClosed={this.onClosed.bind(this, \'visible2\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible3}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="warning"\n          type="warning"\n          onClosed={this.onClosed.bind(this, \'visible3\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible4}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="circle-close"\n          type="danger"\n          onClosed={this.onClosed.bind(this, \'visible4\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible5}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="light"\n          onClosed={this.onClosed.bind(this, \'visible5\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          isOpen={this.state.visible6}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="dark"\n          onClosed={this.onClosed.bind(this, \'visible6\')}\n        >\n          \u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u6216 \u201c<b>\u53d6\u6d88\u6309\u94ae</b>\u201d \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u89e6\u53d1 \u201c<b>onConfirm</b>\u201d \u6216 \u201c<b>onCancel</b>\u201d \u4e8b\u4ef6\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002\n        </Alert>\n        <ButtonGroup>\n          <Button onClick={this.onClick.bind(this, \'visible1\')} type="primary">\u4e3b\u8981</Button>\n          <Button onClick={this.onClick.bind(this, \'visible2\')} type="success">\u6210\u529f</Button>\n          <Button onClick={this.onClick.bind(this, \'visible3\')} type="warning">\u8b66\u544a</Button>\n          <Button onClick={this.onClick.bind(this, \'visible4\')} type="danger">\u9519\u8bef</Button>\n          <Button onClick={this.onClick.bind(this, \'visible5\')} type="light">\u4eae\u6309\u94ae</Button>\n          <Button onClick={this.onClick.bind(this, \'visible6\')} type="dark">\u6697\u6309\u94ae</Button>\n        </ButtonGroup>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n\n## \u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, ButtonGroup, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible1: false,\n      visible2: false,\n    }\n  }\n  onClick(type) {\n    this.setState({ [type]: !this.state[type] });\n  }\n  onClosed(type) {\n    this.setState({ [type]: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible1}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="information"\n          type="primary"\n          onClosed={this.onClosed.bind(this, \'visible1\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible2}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="success"\n          onClosed={this.onClosed.bind(this, \'visible2\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible3}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="warning"\n          type="warning"\n          onClosed={this.onClosed.bind(this, \'visible3\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible4}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          icon="circle-close"\n          type="danger"\n          onClosed={this.onClosed.bind(this, \'visible4\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible5}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="light"\n          onClosed={this.onClosed.bind(this, \'visible5\')}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        />\n        <Alert\n          title="\u5e26\u6807\u9898\u7684\u5f39\u51fa\u6846"\n          isOpen={this.state.visible6}\n          confirmText="\u786e\u5b9a\u6309\u94ae"\n          cancelText="\u53d6\u6d88\u6309\u94ae"\n          type="dark"\n          onClosed={this.onClosed.bind(this, \'visible6\')}\n        >\n          \u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u6216 \u201c<b>\u53d6\u6d88\u6309\u94ae</b>\u201d \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u89e6\u53d1 \u201c<b>onConfirm</b>\u201d \u6216 \u201c<b>onCancel</b>\u201d \u4e8b\u4ef6\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002\n        </Alert>\n        <ButtonGroup>\n          <Button onClick={this.onClick.bind(this, \'visible1\')} type="primary">\u4e3b\u8981</Button>\n          <Button onClick={this.onClick.bind(this, \'visible2\')} type="success">\u6210\u529f</Button>\n          <Button onClick={this.onClick.bind(this, \'visible3\')} type="warning">\u8b66\u544a</Button>\n          <Button onClick={this.onClick.bind(this, \'visible4\')} type="danger">\u9519\u8bef</Button>\n          <Button onClick={this.onClick.bind(this, \'visible5\')} type="light">\u4eae\u6309\u94ae</Button>\n          <Button onClick={this.onClick.bind(this, \'visible6\')} type="dark">\u6697\u6309\u94ae</Button>\n        </ButtonGroup>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n### \u81ea\u5b9a\u4e49\u6309\u94ae\n\n\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb **`\u786e\u5b9a\u6309\u94ae`** \u6216 **`\u53d6\u6d88\u6309\u94ae`** \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u5c06\u4e0d\u89e6\u53d1 ~~`onConfirm`~~ \u6216 ~~`onCancel`~~ \u4e8b\u4ef6\u3002\u56e0\u4e3a\u8fd9\u4fe9\u6309\u94ae\u662f\u81ea\u5b9a\u4e49\u6309\u94ae\u3002\u4f60\u53ef\u4ee5\u6b63\u5bf9\u81ea\u5b9a\u4e49\u6309\u94ae\u5916\u9762\u7684\u5bf9\u8c61\u5b9a\u4e49 `className="w-alert-footer"` \u5c06\u663e\u793a\u9ed8\u8ba4\u6837\u5f0f\u3002\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, ButtonGroup, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible: false,\n    }\n  }\n  onClick(type) {\n    this.setState({ visible: !this.state.visible });\n  }\n  onClosed(type) {\n    this.setState({ visible: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          isOpen={this.state.visible}\n          type="danger"\n          useButton={false}\n          maskClosable={true}\n          onClose={this.onClosed.bind(this)}\n          // onClosed={this.onClosed.bind(this)}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        >\n          \u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u6216 \u201c<b>\u53d6\u6d88\u6309\u94ae</b>\u201d \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u5c06\u4e0d\u89e6\u53d1 \u201c<del>onConfirm</del>\u201d \u6216 \u201c<del>onCancel</del>\u201d \u4e8b\u4ef6\u3002\u56e0\u4e3a\u8fd9\u4fe9\u6309\u94ae\u662f\u81ea\u5b9a\u4e49\u6309\u94ae\u3002\n          <br /><br />\n          <div className="w-alert-footer">\n            <Button type="danger" onClick={this.onClosed.bind(this)} >\u786e\u5b9a\u6309\u94ae</Button>\n            <Button onClick={this.onClosed.bind(this)} >\u53d6\u6d88\u6309\u94ae</Button>\n          </div>\n        </Alert>\n        <ButtonGroup>\n          <Button onClick={this.onClick.bind(this)}>\u5355\u4e2a\u6309\u94ae\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n        </ButtonGroup>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n### \u4e0d\u663e\u793a\u906e\u7f69\u5c42\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Alert, ButtonGroup, Button } from \'uiw\';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      visible: false,\n    }\n  }\n  onClick(type) {\n    this.setState({ visible: !this.state.visible });\n  }\n  onClosed(type) {\n    this.setState({ visible: false });\n  }\n  render() {\n    return (\n      <div>\n        <Alert\n          isOpen={this.state.visible}\n          type="danger"\n          maskClosable={true}\n          hasBackdrop={false}\n          onClose={this.onClosed.bind(this)}\n          onClosed={this.onClosed.bind(this)}\n          content="\u8fd9\u4e2a\u5bf9\u8bdd\u6846\u53ea\u6709\u4e24\u4e2a\u4e2a\u6309\u94ae\uff0c\u5355\u51fb\u201c\u786e\u5b9a\u6309\u94ae\u201d\u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u7528\u4f5c\u901a\u77e5\u7528\u6237\u91cd\u8981\u4fe1\u606f\u3002"\n        >\n          \u8fd9\u4e2a\u5bf9\u8bdd\u6846\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u6216 \u201c<b>\u53d6\u6d88\u6309\u94ae</b>\u201d \u540e\uff0c\u6b64\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\uff0c\u5c06\u4e0d\u89e6\u53d1 \u201c<del>onConfirm</del>\u201d \u6216 \u201c<del>onCancel</del>\u201d \u4e8b\u4ef6\u3002\u56e0\u4e3a\u8fd9\u4fe9\u6309\u94ae\u662f\u81ea\u5b9a\u4e49\u6309\u94ae\u3002\n        </Alert>\n        <ButtonGroup>\n          <Button onClick={this.onClick.bind(this)}>\u5355\u4e2a\u6309\u94ae\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n        </ButtonGroup>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## Props\n\n\u867d\u7136\u7c7b\u4f3c\u4e8e\u5bf9 `<Modal>`\uff0c\u4f46 `<Alert>` \u66f4\u5177\u9650\u5236\u6027\uff0c\u53ea\u5e94\u7528\u4e8e\u91cd\u8981\u4fe1\u606f\u3002\u6b64\u7ec4\u4ef6\u7ee7\u627f [`<Modal>`](#/components/modal) \u7684\u5c5e\u6027\uff0c\u6240\u4ee5\u90e8\u5206\u53c2\u6570\u53ef\u4ee5\u53c2\u8003 `<Modal>` \u7ec4\u4ef6\u3002\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| onCancel | \u53d6\u6d88\u6309\u94ae\u7684\u56de\u8c03\u51fd\u6570 | Function(e) | - |\n| onConfirm | \u70b9\u51fb\u786e\u5b9a\u6309\u94ae\u56de\u8c03 | Function(e) | - |\n| cancelText | \u53d6\u6d88\u6309\u94ae\u6587\u5b57\uff0c | String | - |\n| confirmText | \u786e\u8ba4\u6309\u94ae\u6587\u5b57 | String | `\u786e\u8ba4` |\n| type | \u6309\u94ae\u7c7b\u578b\u8ddf `<Button>` \u7ec4\u4ef6\u7684 `type` \u53c2\u6570\u4e00\u81f4\uff0c\u540c\u65f6\u4f1a\u5f71\u54cd\u6309\u94ae\u989c\u8272\u3002 | String | `light` |\n| icon[`<Modal>`](#/components/modal) | \u8bbe\u7f6e\u5bf9\u8bdd\u6846\u53f3\u4e0a\u89d2\u56fe\u6807\uff0c\uff0c\u8bbe\u7f6e `type` \u5c06\u56fe\u6807\u8bbe\u7f6e\u4e0d\u540c\u7684\u989c\u8272\u3002\u5f53\u524d\u5c5e\u6027\u4e3a [`<Icon>`](#/components/icon) \u7ec4\u4ef6\u7684 `type` \u5c5e\u6027\uff0c\u6240\u4ee5\u53ef\u4ee5\u53c2\u8003\u8be5\u7ec4\u4ef6\u81ea\u5b9a\u4e49\u56fe\u6807\u3002 | String/ReactNode | - |\n| title[`<Modal>`](#/components/modal)  | \u8bbe\u7f6e\u6807\u9898 | Function(e) | - |\n| useButton[`<Modal>`](#/components/modal) | \u662f\u5426\u4f7f\u7528\u9ed8\u8ba4\u6309\u94ae\uff0c\u5982\u679c\u8bbe\u7f6e `false` \u9700\u8981\u81ea\u5b9a\u4e49\u6309\u94ae\u5173\u95ed | Boolean | `true` |\n| isOpen[`<Modal>`](#/components/modal) | \u5bf9\u8bdd\u6846\u662f\u5426\u53ef\u89c1 | Boolean | `false` |\n| maskClosable[`<Modal>`](#/components/modal) | \u70b9\u51fb\u906e\u7f69\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed | boolean | `true` |\n\n\u66f4\u591a\u5c5e\u6027\u6587\u6863\u8bf7\u53c2\u8003 [Modal](#/components/modal)\u3002'}}]);
+//# sourceMappingURL=5821.41b747c6.chunk.js.map

package/web/static/js/5821.41b747c6.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/5821.41b747c6.chunk.js","mappings":"gHAAA","sources":["../../packages/react-alert/README.md"],"sourcesContent":["export default \"Alert 确认对话框\\n===\\n\\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-alert/file/README.md)\\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-alert.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-alert)\\n[![npm version](https://img.shields.io/npm/v/@uiw/react-alert.svg?label=@uiw/react-alert)](https://npmjs.com/@uiw/react-alert)\\n\\n弹出对话框会在继续之前，通知用户重要信息，点击确定后异步关闭对话框。\\n\\n```jsx\\nimport { Alert } from 'uiw';\\n// or\\nimport Alert from '@uiw/react-alert';\\n```\\n\\n## 基本用法\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, ButtonGroup, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible1: false,\\n      visible2: false,\\n    }\\n  }\\n  onClick(type) {\\n    this.setState({ [type]: !this.state[type] });\\n  }\\n  onClosed(type) {\\n    this.setState({ [type]: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          isOpen={this.state.visible1}\\n          confirmText=\\\"确定按钮\\\"\\n          onClosed={this.onClosed.bind(this, 'visible1')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible2}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"danger\\\"\\n          onConfirm={() => console.log('您点击了确定按钮！')}\\n          onCancel={() => console.log('您点击了取消按钮！')}\\n          onClosed={this.onClosed.bind(this, 'visible2')}\\n        >\\n          这个对话框有两个按钮，单击 “<b>确定按钮</b>” 或 “<b>取消按钮</b>” 后，此对话框将关闭，触发 “<b>onConfirm</b>” 或 “<b>onCancel</b>” 事件。用作通知用户重要信息。\\n        </Alert>\\n        <ButtonGroup>\\n          <Button onClick={this.onClick.bind(this, 'visible1')}>单个按钮确认对话框</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible2')}>确认对话框</Button>\\n        </ButtonGroup>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## 延迟关闭对话框\\n\\n这里是利用 `Promise` 等它执行完成再去关闭窗口\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible: false,\\n    }\\n  }\\n  onClick() {\\n    this.setState({ visible: !this.statevisible });\\n  }\\n  onClosed() {\\n    this.setState({ visible: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          icon=\\\"delete\\\"\\n          isOpen={this.state.visible}\\n          confirmText=\\\"确定按钮\\\"\\n          type=\\\"danger\\\"\\n          onConfirm={() => {\\n            console.log('确定回调！, 这里是利用Promise等执行完成再去关闭窗口');\\n            return new Promise((resolve, reject) => {\\n              const random = Math.random();\\n              console.log('测试，随机值大于 0.5 执行 resolve 事件，否则 执行 reject 触发 catch 错误', random, random > 0.5)\\n              setTimeout(random > 0.5 ? resolve : reject, 3000);\\n            }).catch(() => {\\n              // 可以通过下面方式，阻止弹框消失\\n              // throw new Error();\\n            });\\n          }}\\n          onClosed={this.onClosed.bind(this, 'visible')}\\n        >\\n          这里是利用 <b>Promise</b> 的特性，等它执行完成后，再去关闭窗口，达到延迟关闭的效果。<br /><br />\\n          这个测试例子，生成随机值判断是否大于 <b>0.5</b> 执行 <b>resolve</b> 事件，否则 执行 <b>reject</b> 触发 <b>catch</b> 错误。\\n        </Alert>\\n        <Button onClick={this.onClick.bind(this, 'visible')}>延迟关闭对话框</Button>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## 带图标的弹出框\\n\\n通过设置 `icon` 和 `type` 参数设置带状态的弹出对话框。\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, ButtonGroup, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible1: false,\\n      visible2: false,\\n    }\\n  }\\n  onClick(type) {\\n    this.setState({ [type]: !this.state[type] });\\n  }\\n  onClosed(type) {\\n    this.setState({ [type]: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          isOpen={this.state.visible1}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"information\\\"\\n          type=\\\"primary\\\"\\n          onClosed={this.onClosed.bind(this, 'visible1')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible2}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"circle-check\\\"\\n          type=\\\"success\\\"\\n          onClosed={this.onClosed.bind(this, 'visible2')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible3}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"warning\\\"\\n          type=\\\"warning\\\"\\n          onClosed={this.onClosed.bind(this, 'visible3')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible4}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"circle-close\\\"\\n          type=\\\"danger\\\"\\n          onClosed={this.onClosed.bind(this, 'visible4')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible5}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"light\\\"\\n          onClosed={this.onClosed.bind(this, 'visible5')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          isOpen={this.state.visible6}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"dark\\\"\\n          onClosed={this.onClosed.bind(this, 'visible6')}\\n        >\\n          这个对话框有两个按钮，单击 “<b>确定按钮</b>” 或 “<b>取消按钮</b>” 后，此对话框将关闭，触发 “<b>onConfirm</b>” 或 “<b>onCancel</b>” 事件。用作通知用户重要信息。\\n        </Alert>\\n        <ButtonGroup>\\n          <Button onClick={this.onClick.bind(this, 'visible1')} type=\\\"primary\\\">主要</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible2')} type=\\\"success\\\">成功</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible3')} type=\\\"warning\\\">警告</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible4')} type=\\\"danger\\\">错误</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible5')} type=\\\"light\\\">亮按钮</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible6')} type=\\\"dark\\\">暗按钮</Button>\\n        </ButtonGroup>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n\\n## 带标题的弹出框\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, ButtonGroup, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible1: false,\\n      visible2: false,\\n    }\\n  }\\n  onClick(type) {\\n    this.setState({ [type]: !this.state[type] });\\n  }\\n  onClosed(type) {\\n    this.setState({ [type]: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible1}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"information\\\"\\n          type=\\\"primary\\\"\\n          onClosed={this.onClosed.bind(this, 'visible1')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible2}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"success\\\"\\n          onClosed={this.onClosed.bind(this, 'visible2')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible3}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"warning\\\"\\n          type=\\\"warning\\\"\\n          onClosed={this.onClosed.bind(this, 'visible3')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible4}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          icon=\\\"circle-close\\\"\\n          type=\\\"danger\\\"\\n          onClosed={this.onClosed.bind(this, 'visible4')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible5}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"light\\\"\\n          onClosed={this.onClosed.bind(this, 'visible5')}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        />\\n        <Alert\\n          title=\\\"带标题的弹出框\\\"\\n          isOpen={this.state.visible6}\\n          confirmText=\\\"确定按钮\\\"\\n          cancelText=\\\"取消按钮\\\"\\n          type=\\\"dark\\\"\\n          onClosed={this.onClosed.bind(this, 'visible6')}\\n        >\\n          这个对话框有两个按钮，单击 “<b>确定按钮</b>” 或 “<b>取消按钮</b>” 后，此对话框将关闭，触发 “<b>onConfirm</b>” 或 “<b>onCancel</b>” 事件。用作通知用户重要信息。\\n        </Alert>\\n        <ButtonGroup>\\n          <Button onClick={this.onClick.bind(this, 'visible1')} type=\\\"primary\\\">主要</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible2')} type=\\\"success\\\">成功</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible3')} type=\\\"warning\\\">警告</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible4')} type=\\\"danger\\\">错误</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible5')} type=\\\"light\\\">亮按钮</Button>\\n          <Button onClick={this.onClick.bind(this, 'visible6')} type=\\\"dark\\\">暗按钮</Button>\\n        </ButtonGroup>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 自定义按钮\\n\\n这个对话框有两个按钮，单击 **`确定按钮`** 或 **`取消按钮`** 后，此对话框将关闭，将不触发 ~~`onConfirm`~~ 或 ~~`onCancel`~~ 事件。因为这俩按钮是自定义按钮。你可以正对自定义按钮外面的对象定义 `className=\\\"w-alert-footer\\\"` 将显示默认样式。\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, ButtonGroup, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible: false,\\n    }\\n  }\\n  onClick(type) {\\n    this.setState({ visible: !this.state.visible });\\n  }\\n  onClosed(type) {\\n    this.setState({ visible: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          isOpen={this.state.visible}\\n          type=\\\"danger\\\"\\n          useButton={false}\\n          maskClosable={true}\\n          onClose={this.onClosed.bind(this)}\\n          // onClosed={this.onClosed.bind(this)}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        >\\n          这个对话框有两个按钮，单击 “<b>确定按钮</b>” 或 “<b>取消按钮</b>” 后，此对话框将关闭，将不触发 “<del>onConfirm</del>” 或 “<del>onCancel</del>” 事件。因为这俩按钮是自定义按钮。\\n          <br /><br />\\n          <div className=\\\"w-alert-footer\\\">\\n            <Button type=\\\"danger\\\" onClick={this.onClosed.bind(this)} >确定按钮</Button>\\n            <Button onClick={this.onClosed.bind(this)} >取消按钮</Button>\\n          </div>\\n        </Alert>\\n        <ButtonGroup>\\n          <Button onClick={this.onClick.bind(this)}>单个按钮确认对话框</Button>\\n        </ButtonGroup>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 不显示遮罩层\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Alert, ButtonGroup, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      visible: false,\\n    }\\n  }\\n  onClick(type) {\\n    this.setState({ visible: !this.state.visible });\\n  }\\n  onClosed(type) {\\n    this.setState({ visible: false });\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <Alert\\n          isOpen={this.state.visible}\\n          type=\\\"danger\\\"\\n          maskClosable={true}\\n          hasBackdrop={false}\\n          onClose={this.onClosed.bind(this)}\\n          onClosed={this.onClosed.bind(this)}\\n          content=\\\"这个对话框只有两个个按钮，单击“确定按钮”后，此对话框将关闭。用作通知用户重要信息。\\\"\\n        >\\n          这个对话框有两个按钮，单击 “<b>确定按钮</b>” 或 “<b>取消按钮</b>” 后，此对话框将关闭，将不触发 “<del>onConfirm</del>” 或 “<del>onCancel</del>” 事件。因为这俩按钮是自定义按钮。\\n        </Alert>\\n        <ButtonGroup>\\n          <Button onClick={this.onClick.bind(this)}>单个按钮确认对话框</Button>\\n        </ButtonGroup>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## Props\\n\\n虽然类似于对 `<Modal>`，但 `<Alert>` 更具限制性，只应用于重要信息。此组件继承 [`<Modal>`](#/components/modal) 的属性，所以部分参数可以参考 `<Modal>` 组件。\\n\\n| 参数 | 说明 | 类型 | 默认值 |\\n|--------- |-------- |--------- |-------- |\\n| onCancel | 取消按钮的回调函数 | Function(e) | - |\\n| onConfirm | 点击确定按钮回调 | Function(e) | - |\\n| cancelText | 取消按钮文字， | String | - |\\n| confirmText | 确认按钮文字 | String | `确认` |\\n| type | 按钮类型跟 `<Button>` 组件的 `type` 参数一致，同时会影响按钮颜色。 | String | `light` |\\n| icon[`<Modal>`](#/components/modal) | 设置对话框右上角图标，，设置 `type` 将图标设置不同的颜色。当前属性为 [`<Icon>`](#/components/icon) 组件的 `type` 属性，所以可以参考该组件自定义图标。 | String/ReactNode | - |\\n| title[`<Modal>`](#/components/modal)  | 设置标题 | Function(e) | - |\\n| useButton[`<Modal>`](#/components/modal) | 是否使用默认按钮，如果设置 `false` 需要自定义按钮关闭 | Boolean | `true` |\\n| isOpen[`<Modal>`](#/components/modal) | 对话框是否可见 | Boolean | `false` |\\n| maskClosable[`<Modal>`](#/components/modal) | 点击遮罩层是否允许关闭 | boolean | `true` |\\n\\n更多属性文档请参考 [Modal](#/components/modal)。\";"],"names":[],"sourceRoot":""}

package/web/static/js/5930.65ea3787.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[5930],{45930:function(n,t,e){e.r(t),t.default="CopyToClipboard \u590d\u5236\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-copy-to-clipboard/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-copy-to-clipboard.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-copy-to-clipboard)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-copy-to-clipboard.svg?label=@uiw/react-copy-to-clipboard)](https://npmjs.com/@uiw/react-copy-to-clipboard)\n\n\u5c06\u6587\u672c\u5230\u526a\u5207\u677f\uff0c\u590d\u5236\u5230\u526a\u8d34\u677f\u529f\u80fd\u53ef\u4ee5\u5e94\u7528\u4e8e\u5404\u79cd\u5143\u7d20\uff0c\u57fa\u4e8e [@uiwjs/copy-to-clipboard](https://github.com/uiwjs/copy-to-clipboard) \u5c01\u88c5\u3002\n\n```jsx\nimport { CopyToClipboard } from 'uiw';\n// or\nimport CopyToClipboard from '@uiw/react-copy-to-clipboard';\n```\n\n### \u57fa\u7840\u5b9e\u4f8b\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { CopyToClipboard } from 'uiw';\n\nclass Demo extends React.Component {\n  constructor() {\n    super();\n    this.state = {\n      message: ''\n    }\n  }\n  render() {\n    return (\n      <div>\n        <CopyToClipboard\n          text=\"\u6211\u88ab\u4e00\u4e2a\u8fde\u63a5\u590d\u5236\u4e86\uff01\"\n          onClick={() => {\n            this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n              setTimeout(() => {\n                this.setState({ message: '' });\n              }, 2000);\n            });\n          }}\n        >\n          \u70b9\u51fb\u6211\u590d\u5236\n        </CopyToClipboard>\n        <div style={{color: '#28a745'}}>{this.state.message}</div>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## \u590d\u5236\u8f93\u5165\u6846\u5185\u5bb9\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { CopyToClipboard, Input, Button } from 'uiw';\n\nclass Demo extends React.Component {\n  constructor(props){\n    super(props);\n    this.state = {\n      copyText: \"\u751f\u4ea6\u4f55\u6b22\uff0c\u6b7b\u4ea6\u4f55\u82e6\"\n    };\n    this.input = React.createRef();\n  }\n  onChange(e){\n    // this.setState({\n    //   copyText: e.target.value\n    // })\n  }\n  render() {\n    const { copyText } = this.state;\n    return (\n      <div>\n        <div>\n          <Input\n            type=\"text\"\n            ref={this.input}\n            value={copyText}\n            onChange={this.onChange.bind(this)}\n          />\n        </div>\n        <CopyToClipboard \n          style={{ marginTop:10, display:'inline-block' }} \n          text={copyText}\n          onClick={() => {\n            // \u590d\u5236\u63d0\u793a\n            this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n              setTimeout(() => {\n                this.setState({ message: '' });\n              }, 2000);\n            });\n            this.input.current.select();\n          }}\n        >\n          <Button type=\"primary\">\u70b9\u51fb\u590d\u5236</Button>\n          <span style={{color: '#28a745'}}>{this.state.message}</span>\n        </CopyToClipboard>\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## CopyToClipboard\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| text | \u62f7\u8d1d\u7684\u6587\u672c | String | - |\n| onClick | \u70b9\u51fb\u4e8b\u4ef6 | Function(text,isCopy,event) | - |\n"}}]);
+//# sourceMappingURL=5930.65ea3787.chunk.js.map

package/web/static/js/5930.65ea3787.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/5930.65ea3787.chunk.js","mappings":"gHAAA","sources":["../../packages/react-copy-to-clipboard/README.md"],"sourcesContent":["export default \"CopyToClipboard 复制\\n===\\n\\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-copy-to-clipboard/file/README.md)\\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-copy-to-clipboard.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-copy-to-clipboard)\\n[![npm version](https://img.shields.io/npm/v/@uiw/react-copy-to-clipboard.svg?label=@uiw/react-copy-to-clipboard)](https://npmjs.com/@uiw/react-copy-to-clipboard)\\n\\n将文本到剪切板，复制到剪贴板功能可以应用于各种元素，基于 [@uiwjs/copy-to-clipboard](https://github.com/uiwjs/copy-to-clipboard) 封装。\\n\\n```jsx\\nimport { CopyToClipboard } from 'uiw';\\n// or\\nimport CopyToClipboard from '@uiw/react-copy-to-clipboard';\\n```\\n\\n### 基础实例\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { CopyToClipboard } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor() {\\n    super();\\n    this.state = {\\n      message: ''\\n    }\\n  }\\n  render() {\\n    return (\\n      <div>\\n        <CopyToClipboard\\n          text=\\\"我被一个连接复制了！\\\"\\n          onClick={() => {\\n            this.setState({ message: '复制成功！你可以粘贴了。' }, () => {\\n              setTimeout(() => {\\n                this.setState({ message: '' });\\n              }, 2000);\\n            });\\n          }}\\n        >\\n          点击我复制\\n        </CopyToClipboard>\\n        <div style={{color: '#28a745'}}>{this.state.message}</div>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## 复制输入框内容\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { CopyToClipboard, Input, Button } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  constructor(props){\\n    super(props);\\n    this.state = {\\n      copyText: \\\"生亦何欢，死亦何苦\\\"\\n    };\\n    this.input = React.createRef();\\n  }\\n  onChange(e){\\n    // this.setState({\\n    //   copyText: e.target.value\\n    // })\\n  }\\n  render() {\\n    const { copyText } = this.state;\\n    return (\\n      <div>\\n        <div>\\n          <Input\\n            type=\\\"text\\\"\\n            ref={this.input}\\n            value={copyText}\\n            onChange={this.onChange.bind(this)}\\n          />\\n        </div>\\n        <CopyToClipboard \\n          style={{ marginTop:10, display:'inline-block' }} \\n          text={copyText}\\n          onClick={() => {\\n            // 复制提示\\n            this.setState({ message: '复制成功！你可以粘贴了。' }, () => {\\n              setTimeout(() => {\\n                this.setState({ message: '' });\\n              }, 2000);\\n            });\\n            this.input.current.select();\\n          }}\\n        >\\n          <Button type=\\\"primary\\\">点击复制</Button>\\n          <span style={{color: '#28a745'}}>{this.state.message}</span>\\n        </CopyToClipboard>\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## CopyToClipboard\\n\\n| 参数 | 说明 | 类型 | 默认值 |\\n|--------- |-------- |--------- |-------- |\\n| text | 拷贝的文本 | String | - |\\n| onClick | 点击事件 | Function(text,isCopy,event) | - |\\n\";"],"names":[],"sourceRoot":""}

package/web/static/js/6019.add10037.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[6019],{66019:function(n,e,t){t.r(e),e.default="Icon \u56fe\u6807\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-icon/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-icon.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-icon)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-icon.svg?label=@uiw/react-icon)](https://npmjs.com/@uiw/react-icon)\n\n\u8bed\u4e49\u5316\u7684\u77e2\u91cf\u56fe\u5f62\uff0c\u5185\u7f6e\u7684\u56fe\u6807\u5c5e\u4e8eUI\u6846\u67b6\u5e38\u7528\u56fe\u5f62\u5b57\u4f53\u3002icon\u5b57\u4f53\u4ee5\u53ca\u6837\u5f0f\uff0c\u88ab\u62bd\u79bb\u5230\u4e00\u4e2a\u65b0\u7684\u4ed3\u5e93 [uiw icon](https://uiwjs.github.io/icons/) \uff0c`uiw`\u53bb\u4f9d\u8d56 [uiw-iconfont](https://github.com/uiwjs/icons)\uff0c\u8fd9\u4e2a\u4ed3\u5e93\u4e3b\u8981\u662f\u7ef4\u62a4\u4e00\u5957svg\u56fe\u7247\uff0c\u5e76\u5c06svg\u56fe\u7247\u8f6c\u6362\u4e3a `*.symbol.svg` `*.ttf` `*.woff` `*.woff2` `*.eot` `svgPaths.json` \u7b49\u5b57\u4f53\u53ca\u76f8\u5173\u6587\u4ef6\u5e76\u53d1\u5e03\u5230 [npm](https://www.npmjs.com/package/uiw-iconfont) \u4e0a\u53bb\u3002\n\n```jsx\nimport { Icon } from 'uiw';\n// or\nimport Icon from '@uiw/react-icon';\n```\n\n### \u641c\u7d22\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { Input, CopyToClipboard, Icon, Notify } from 'uiw';\n\nconst icons = [\"adobe\", \"alipay\", \"aliwangwang\", \"android-o\", \"android\", \"apple\", \"appstore-o\", \"appstore\", \"area-chart\", \"down\", \"left\", \"right\", \"up\", \"arrow-down\", \"arrow-left\", \"arrow-right\", \"arrow-up\", \"arrows-alt\", \"asterisk\", \"backward\", \"baidu\", \"bar-chart\", \"barcode\", \"bell\", \"camera-o\", \"caret-down\", \"caret-left\", \"caret-right\", \"caret-up\", \"check-square-o\", \"check-square\", \"check\", \"chrome\", \"circle-check-o\", \"circle-check\", \"circle-close-o\", \"circle-close\", \"close-square-o\", \"close-square\", \"close\", \"cloud-download-o\", \"cloud-download\", \"cloud-upload-o\", \"cloud-upload\", \"coffee\", \"component\", \"copy\", \"copyright\", \"css3\", \"cut\", \"d-arrow-left\", \"d-arrow-right\", \"d-caret\", \"dashboard\", \"date\", \"delete\", \"dingding\", \"dislike-o\", \"document\", \"dot-chart\", \"circle-o\", \"down-circle-o\", \"down-circle\", \"down-square-o\", \"down-square\", \"square-o\", \"download\", \"edit\", \"enter\", \"environment-o\", \"environment\", \"eye-o\", \"eye\", \"facebook\", \"file-add\", \"file-excel\", \"file-jpg\", \"file-pdf\", \"file-text\", \"file-unknown\", \"filter\", \"firefox\", \"folder-add\", \"folder-open\", \"folder\", \"forward\", \"foursquare\", \"frown-o\", \"frown\", \"github-o\", \"github\", \"global\", \"heart-off\", \"heart-on\", \"home\", \"html5\", \"ie\", \"inbox\", \"information-o\", \"information\", \"laptop\", \"left-circle-o\", \"left-circle\", \"left-square-o\", \"left-square\", \"like-o\", \"link\", \"linkedin\", \"linux\", \"loading\", \"lock\", \"login\", \"logout\", \"man\", \"map\", \"meh-o\", \"meh\", \"menu-fold\", \"menu-unfold\", \"menu\", \"mail\", \"mail-o\", \"message\", \"minus-circle-o\", \"minus-circle\", \"minus-square-o\", \"minus-square\", \"minus\", \"mobile\", \"more\", \"notification\", \"opera\", \"paper-clip\", \"pause-circle-o\", \"pause-circle\", \"pause\", \"pay-circle-o\", \"pay\", \"picasa\", \"picture\", \"pie-chart\", \"pinterest\", \"play-circle-o\", \"play-circle\", \"plus-circle-o\", \"plus-circle\", \"plus-square-o\", \"plus-square\", \"plus\", \"poweroff\", \"printer\", \"qq\", \"qrcode\", \"question-circle-o\", \"question-circle\", \"reddit\", \"reload\", \"right-circle-o\", \"right-circle\", \"right-square-o\", \"right-square\", \"rollback\", \"safari\", \"safety\", \"save\", \"search\", \"setting-o\", \"setting\", \"share\", \"shopping-cart\", \"shrink\", \"smile-o\", \"smile\", \"star-off\", \"star-on\", \"swap-left\", \"swap-right\", \"swap\", \"table\", \"tag-o\", \"tag\", \"tags-o\", \"tags\", \"taobao\", \"time-o\", \"time\", \"twitter\", \"uiw\", \"unlock\", \"up-circle-o\", \"up-circle\", \"up-square-o\", \"up-square\", \"upload\", \"user-add\", \"user-delete\", \"user\", \"usergroup-add\", \"usergroup-delete\", \"verification\", \"verticle-left\", \"verticle-right\", \"video-camera\", \"warning-o\", \"warning\", \"weibo\", \"weixin\", \"wifi\", \"windows\", \"woman\", \"zoom-in\", \"zoom-out\", 'stop-o', 'stop'];\nconst itemStyl = {\n  fontSize: 26, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center', justifyContent: 'center', fill: '#525252',\n}\nclass Demo extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      len: 0,\n      result: [],\n    }\n  }\n  onChange(env) {\n    const value = env.target.value;\n    const data = value ? icons.filter((item) => item.indexOf(value) > -1) : [];\n    const len = data.length;\n    const result = data.splice(0, 15);\n    this.setState({ len, result });\n  }\n  render() {\n    const { len, result } = this.state;\n    return (\n      <div>\n        <Input preIcon=\"search\" placeholder=\"\u8bf7\u8f93\u5165\u56fe\u6807\u540d\u79f0\" type=\"text\" style={{ maxWidth: 200 }} onChange={this.onChange.bind(this)} />\n        <div style={{ padding: '10px 0' }}>\n          \u641c\u7d22\u5230 {this.state.len} \u4e2a\u7ed3\u679c{len > 0 && <span>\uff0c\u4e0b\u9762\u5c55\u793a {len > 15 ? '15' : len} \u4e2a\u56fe\u6807\uff0c\u53ef\u4ee5\u70b9\u51fb\u590d\u5236\u56fe\u6807\u4ee3\u7801: </span>}\n        </div>\n        <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n          {result.map((type, idx) => {\n            const iconTxt = `<Icon type=\"${type}\" />`;\n            return (\n              <CopyToClipboard\n                key={idx}\n                style={itemStyl}\n                text={iconTxt}\n                onClick={() => {\n                  Notify.success({\n                    title: '\u4f60\u5df2\u590d\u5236\u5185\u5bb9\uff01',\n                    description: (\n                      <span>\n                        \u5df2\u590d\u5236 <b style={{ color: 'red' }}>{iconTxt}</b> \u53ef\u4ee5\u53bb\u7c98\u8d34\u4e86\uff01\n                      </span>\n                    ),\n                  });\n                }}\n              >\n                <div key={idx}>\n                  <Icon type={type} />\n                  <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n                </div>\n              </CopyToClipboard>\n            )\n          })}\n        </div>\n      </div>\n    );\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## \u5982\u4f55\u4f7f\u7528\n\n\u4f7f\u7528`<Icon />`\u7ec4\u4ef6\uff0c\u6307\u5b9a\u56fe\u6807\u5bf9\u5e94\u7684`type`\u5c5e\u6027\uff0c\u793a\u4f8b\u4ee3\u7801\uff1a\n\n```jsx\nimport { Icon } from 'uiw';\n```\n\n```jsx\n<Icon type=\"minus\" />\n```\n\n\u6e32\u67d3\u4e3a\n\n```jsx\n<span class=\"w-icon w-icon-middle\">\n  <svg viewBox=\"0 0 24 24\">\n    <path d=\"M16.038 3.176c2.313-.551 4.58.248 5.648 1.603.985 1.25 1.433 2.55 1.287 4.468-.105 1.383-.55 2.408-1.428 3.536-.162.208-.34.421-.563.68-.13.153-.628.72-.602.692-.88 1.008-3.471 3.535-7.814 7.62a.83.83 0 0 1-1.139-.003c-3.728-3.55-6.141-5.888-7.248-7.022-2.043-2.094-2.82-3.31-3.102-5.276-.295-2.055.27-3.742 1.538-5.053 1.19-1.229 3.319-1.684 5.42-1.25 1.231.254 2.542 1.072 3.961 2.436 1.21-1.261 2.56-2.077 4.042-2.43z\" fill-rule=\"evenodd\">\n    </path>\n  </svg>\n</span>\n```\n\n\u793a\u4f8b\u5982\u4e0b:\n\n```jsx\nconst Demo = () => (\n  <div>\n    <Icon type=\"arrow-down\" />\n    <Icon type=\"minus\" />\n    <Icon type=\"plus\" />\n    <Icon type=\"check\" />\n    <Icon type=\"close\" />\n  </div>\n)\n```\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div style={{ fontSize: 18, lineHeight: '12px' }}>\n    <Icon type=\"heart-on\" />\n    <Icon type=\"pie-chart\" />\n    <Icon type=\"tag\" />\n  </div>,\n  _mount_\n);\n```\n\n### \u56fe\u6807\u5c3a\u5bf8\n\n\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u56fe\u6807\u975e\u5e38\u5c0f\uff0c\u5b83\u4eec\u7ee7\u627f\u4e86\u7236\u7ea7\u7684\u5b57\u4f53\u5927\u5c0f\u3002 \u5982\u679c\u6ca1\u6709\u8bbe\u7f6e\u5b57\u4f53\u5927\u5c0f\uff0c\u53ef\u4ee5\u901a\u8fc7 `size` \u6765\u8bbe\u7f6e\u5c3a\u5bf8\u3002\u901a\u5e38\u60c5\u51b5 `size` \u4f1a\u5f88\u7d2f\u8d58\u6ca1\u6709\u4ec0\u4e48\u7528\u3002\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div style={{ fontSize: '28px' }}>\n    <Icon type=\"heart-on\" />\n    <Icon type=\"pie-chart\" />\n    <Icon type=\"tag\" />\n  </div>,\n  _mount_\n);\n```\n\n### \u56fe\u6807\u989c\u8272\n\n\u9ed8\u8ba4\u7eaf\u9ed1\u8272\u56fe\u6807\uff0c\u5f53\u524d\u56fe\u6807\u662f svg \u683c\u5f0f\u5c55\u793a\uff0c\u5728\u4e3aSVG\u8bbe\u7f6e\u6837\u5f0f\u65f6\uff0c\u8bf7\u4f7f\u7528 `fill` \u6216 `stroke` \u5c5e\u6027\u800c\u4e0d\u662f `color`\u3002 \u8fd9\u4e9b\u53ef\u4ee5\u76f4\u63a5\u5728 `Icon` \u4e0a\u8bbe\u7f6e\u4e3a `style` \u6216\u901a\u8fc7 `CSS` \u8bbe\u7f6e\u3002\n\n> \u4e00\u4e2a\u6709\u7528\u7684\u6280\u5de7\u662f\u5c06 `fill` \u8bbe\u7f6e\u4e3a `currentColor`\uff0c\u4ee5\u4fbf\u4ece\u56fe\u6807\u5bb9\u5668\u7684\u6587\u672c\u989c\u8272\u7ee7\u627f\u586b\u5145\u989c\u8272\u3002\n\x3c!--rehype:style=border-left: 8px solid #ffe564;background-color: #ffe56440;padding: 12px 16px;--\x3e\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div style={{ fontSize: '28px',color: 'green' }}>\n    <Icon type=\"apple\" color=\"red\" />\n    <Icon type=\"pie-chart\" style={{fill: 'currentColor'}} />\n    <Icon type=\"frown\" style={{fill: 'blue'}} />\n    <Icon type=\"uiw\" style={{stroke: 'red',fill: '#ffef00'}} />\n  </div>,\n  _mount_\n);\n```\n\n### \u4e0e\u6587\u672c\u5bf9\u9f50\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div>\n    <h3 style={{ margin: 0 }}>Exit <Icon verticalAlign=\"baseline\" type=\"baidu\" /></h3>\n    <span>uiw</span><Icon type=\"uiw\" verticalAlign=\"baseline\" style={{ fill: '#009688', fontSize: 21 }} />\n  </div>,\n  _mount_\n);\n```\n\n### \u56fe\u6807\u7684\u547d\u540d\u89c4\u8303\n\n\u6211\u4eec\u4e3a\u6bcf\u4e2a\u56fe\u6807\u8d4b\u4e88\u4e86\u8bed\u4e49\u5316\u7684\u547d\u540d\uff0c\u547d\u540d\u89c4\u5219\u5982\u4e0b:\n\n> \\[\u5f62\u72b6?\\]-\\[\u56fe\u6807\u540d\\]-\\[\u63cf\u7ebf?\\]-\\[\u65b9\u5411?\\]  \n> \u65b9\u5411\uff1a`down`\u3001`up`\u3001`left`\u3001`right`  \n> \u63cf\u7ebf\uff1a`-o` \u56fe\u6807\u6dfb\u52a0\u8fb9\u6846\u63cf\u7ebf  \n> \u9ed8\u8ba4\uff1a`w-icon-` \u9ed8\u8ba4\u5f15\u7528\u7684\u5b57\u4f53\u6587\u4ef6\u4f5c\u7528\u57df  \n> \u81ea\u5b9a\u5b9a\u4e49\uff1a`w-icon-uiw-` \u81ea\u5b9a\u5b9a\u4e49\u4f5c\u7528\u57df  \n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div>\n    <Icon type=\"circle-close\" verticalAlign=\"baseline\" />  \u56fe\u6807\u540d\u79f0\uff1acircle-close\uff0c[circle\u5708]-[\u5173\u95edclose]\n    <br/>\n    <Icon type=\"circle-close-o\" verticalAlign=\"baseline\" /> \u56fe\u6807\u540d\u79f0\uff1acircle-close-o\uff0c[circle\u5708]-[\u5173\u95edclose]-[o\u63cf\u7ebf]\n  </div>,\n  _mount_\n);\n```\n\n### \u56fe\u6807\u65cb\u8f6c\u5b9e\u4f8b\n\n\u901a\u8fc7\u8bbe\u7f6e\u53c2\u6570 `spin={true}` \u6765\u8bbe\u7f6e\u56fe\u6807\u65cb\u8f6c\u3002\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nReactDOM.render(\n  <div style={{ fontSize: 21, color: 'green' }}>\n    <Icon type=\"loading\" spin={true} color=\"red\" />\n    <Icon type=\"reload\" spin={true} />\n    <Icon type=\"picasa\" spin={true} style={{fill: 'blue'}} />\n    <Icon type=\"smile-o\" spin={true} style={{fill: 'blue'}} />\n  </div>,\n  _mount_\n);\n```\n\n### \u81ea\u5b9a\u4e49\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst chat = (\n  <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\">\n    <path d=\"M19 0H7c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h5.59l3.71 3.71c.17.18.42.29.7.29.55 0 1-.45 1-1v-3h1c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1zM7 13c-1.1 0-2-.9-2-2V4H1c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h1v3a1.003 1.003 0 0 0 1.71.71L7.41 16H13c.55 0 1-.45 1-1v-.17L12.17 13H7z\" fillRule=\"evenodd\" />\n  </svg>\n)\nconst contrast = (\n  <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\">\n    <path d=\"M19 8h-1.26c-.19-.73-.48-1.42-.85-2.06l.94-.94a.996.996 0 0 0 0-1.41l-1.41-1.41a.996.996 0 0 0-1.41 0l-.94.94c-.65-.38-1.34-.67-2.07-.86V1c0-.55-.45-1-1-1H9c-.55 0-1 .45-1 1v1.26c-.76.2-1.47.5-2.13.89L5 2.28a.972.972 0 0 0-1.36 0L2.28 3.64c-.37.38-.37.98 0 1.36l.87.87c-.39.66-.69 1.37-.89 2.13H1c-.55 0-1 .45-1 1v2c0 .55.45 1 1 1h1.26c.19.73.48 1.42.85 2.06l-.94.94a.996.996 0 0 0 0 1.41l1.41 1.41c.39.39 1.02.39 1.41 0l.94-.94c.64.38 1.33.66 2.06.85V19c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1.26c.76-.2 1.47-.5 2.13-.89l.88.87c.37.37.98.37 1.36 0l1.36-1.36c.37-.38.37-.98 0-1.36l-.87-.87c.4-.65.7-1.37.89-2.13H19c.55 0 1-.45 1-1V9c0-.55-.45-1-1-1zm-9 7c-2.76 0-5-2.24-5-5s2.24-5 5-5v10z\" fillRule=\"evenodd\" />\n  </svg>\n)\nconst styl = { marginRight: 10 };\n\nReactDOM.render(\n  <div style={{ fontSize: 21, color: 'green' }}>\n    <Icon style={styl} type={chat} color=\"red\" />\n    <Icon style={styl} type={contrast} spin={true} />\n  </div>,\n  _mount_\n);\n```\n\n## \u5b57\u4f53\u56fe\u6807\n\n\u901a\u8fc7\u5f15\u5165 [uiw-iconfont](https://github.com/uiwjs/icons) \u5b57\u4f53\u6837\u5f0f\uff0c\u5728 [uiw-iconfont\u5b98\u7f51](https://uiwjs.github.io/icons) \u627e\u5230\u5bf9\u5e94\u7684\u56fe\u6807\u540d\u79f0\uff0c\u5c31\u53ef\u4ee5\u4f7f\u7528\u4e86\uff0c`uiw` \u5df2\u7ecf\u4f9d\u8d56 `uiw-iconfont` \u4f60\u65e0\u9700\u5b89\u88c5\u5373\u53ef\u4f7f\u7528\uff0c\u66f4\u591a\u4f7f\u7528\u65b9\u6cd5[\u67e5\u770b\u5b98\u65b9\u6587\u6863](https://github.com/uiwjs/icons)\u3002\n\n```bash\n# \u5982\u679c\u4f60\u6ca1\u6709\u5b89\u88c5\uff0c\u53ef\u5355\u72ec\u4f7f\u7528\uff0c\u5b89\u88c5\nnpm i uiw-iconfont --save\n```\n\n\u5f15\u5165\u5b57\u4f53\u6837\u5f0f\n\n```jsx\nimport 'uiw-iconfont/fonts/w-icon.css';\n```\n\n\u5728 HTML \u4e2d\u4f7f\u7528\uff1a\n\n```html\n<i className=\"w-icon-apple\"></i>\n```\n\n\u5728 React \u4e2d\u4f7f\u7528\uff1a\n\n```jsx\nconst Demo = () => (\n  <div style={{ color: 'green' }}>\n    <i className=\"w-icon-apple\" />\n    <i className=\"w-icon-appstore\" />\n  </div>\n)\n```\n\n## API\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| type | \u56fe\u6807\u7684\u540d\u79f0 | String/ReactNode | - |\n| spin | \u662f\u5426\u6709\u65cb\u8f6c\u52a8\u753b |  Boolean | `false` |\n| verticalAlign | \u662f\u5426\u6709\u65cb\u8f6c\u52a8\u753b | Enum {baseline, middle} | `baseline` |\n| style | \u8bbe\u7f6e\u56fe\u6807\u7684\u6837\u5f0f\uff0c\u4f8b\u5982 `fill` \u548c `stroke` | Object | - |\n\n\n## \u6240\u6709\u56fe\u6807\n\n### \u65b9\u5411\u6027\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'circle-o', 'down-square-o','down-square','up-square-o', 'up-square','left-square-o','left-square', 'right-square-o', 'right-square',\n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n\u5706\u5708\u65b9\u5411\u6027\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'square-o', 'down-circle-o', 'down-circle','up-circle-o','up-circle','left-circle-o', 'left-circle','right-circle-o', 'right-circle','play-circle-o',  'play-circle',\n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n\u5176\u5b83\u65b9\u5411\u6027\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'down', 'up', 'left', 'right', 'caret-down', 'caret-up', 'caret-left', 'caret-right', 'arrow-down', 'arrow-up', 'arrow-left', 'arrow-right',\n  'shrink','arrows-alt','d-arrow-left','d-arrow-right','enter',\n  'rollback', 'd-caret','backward','forward',  'logout', 'login', 'swap-left', 'swap-right', 'swap',\n  'verticle-left', 'verticle-right', 'menu','menu-fold', 'menu-unfold',\n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n### \u63d0\u793a\u5efa\u8bae\u6027\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'smile-o', 'smile','frown-o', 'frown', 'meh-o', 'meh', \n  'pause-circle-o', 'pause', 'pause-circle', 'information-o', 'information', 'warning-o', 'warning',\n  'question-circle-o', 'question-circle', 'stop-o', 'stop',\n];\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n## \u7b26\u53f7\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n 'plus', 'plus-circle-o','plus-circle', 'plus-square', 'plus-square-o',\n 'minus', 'minus-circle-o', 'minus-circle', 'minus-square', 'minus-square-o', \n 'close','circle-close-o', 'circle-close','close-square', 'close-square-o', 'asterisk',\n  'check', 'circle-check-o', 'circle-check','check-square','check-square-o', 'copyright',\n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n### \u6587\u4ef6\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'file-text', 'file-jpg', 'file-unknown', 'file-add', 'file-excel', 'file-pdf',\n  'folder-add', 'folder-open', 'paper-clip', \n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n### \u5176\u5b83\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [\n  'heart-off', 'heart-on', 'star-on', 'star-off','lock', 'unlock','dashboard',\n  'area-chart', 'bar-chart', 'dot-chart','pie-chart',\n  'dislike-o', 'like-o','loading', 'reload','appstore', 'appstore-o',\n  'tag', 'tag-o','tags','tags-o', 'setting','setting-o','map','table','qrcode','barcode','printer',\n  'cloud-upload','cloud-upload-o', 'cloud-download','cloud-download-o', 'download','message', 'mail', 'mail-o',\n  'user', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'zoom-in', 'zoom-out','time', 'time-o',\n  'bell', 'camera-o', 'coffee', 'document', 'delete', 'date', 'edit',  'eye-o', 'environment-o', 'filter', 'global', 'inbox', 'home', 'laptop', 'link', 'copy', 'more', 'shopping-cart', 'search', 'save', 'safety', 'poweroff', 'picasa', 'notification',\n  'pay-circle-o', 'pay', 'picture', 'woman', 'man', 'verification', 'wifi', 'video-camera', 'mobile'\n]\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n### \u54c1\u724c\u6807\u8bc6\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = ['uiw', 'windows', 'linux', 'apple', 'facebook', 'twitter', 'adobe', 'baidu', 'alipay', 'android-o', 'android','reddit', 'github', 'github-o', 'aliwangwang',   'dingding', 'foursquare', 'linkedin', 'pinterest', 'qq',  'weibo', 'taobao', 'weixin', 'css3', 'html5'];\n\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n\n### \u6d4f\u89c8\u5668\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true--\x3e\n```js\nimport ReactDOM from 'react-dom';\nimport { Icon } from 'uiw';\n\nconst iconList = [ \"chrome\", \"safari\", \"firefox\", \"opera\", \"ie\", ];\nconst itemStyl = {\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\n}\n\nReactDOM.render(\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\n    {iconList.map((type, idx) => {\n      return (\n        <div key={idx} style={itemStyl}>\n          <Icon type={type} />\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\n        </div>\n      )\n    })}\n  </div>,\n  _mount_\n);\n```\n"}}]);
+//# sourceMappingURL=6019.add10037.chunk.js.map

package/web/static/js/6019.add10037.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/6019.add10037.chunk.js","mappings":"gHAAA","sources":["../../packages/react-icon/README.md"],"sourcesContent":["export default \"Icon 图标\\n===\\n\\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-icon/file/README.md)\\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-icon.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-icon)\\n[![npm version](https://img.shields.io/npm/v/@uiw/react-icon.svg?label=@uiw/react-icon)](https://npmjs.com/@uiw/react-icon)\\n\\n语义化的矢量图形，内置的图标属于UI框架常用图形字体。icon字体以及样式，被抽离到一个新的仓库 [uiw icon](https://uiwjs.github.io/icons/) ，`uiw`去依赖 [uiw-iconfont](https://github.com/uiwjs/icons)，这个仓库主要是维护一套svg图片，并将svg图片转换为 `*.symbol.svg` `*.ttf` `*.woff` `*.woff2` `*.eot` `svgPaths.json` 等字体及相关文件并发布到 [npm](https://www.npmjs.com/package/uiw-iconfont) 上去。\\n\\n```jsx\\nimport { Icon } from 'uiw';\\n// or\\nimport Icon from '@uiw/react-icon';\\n```\\n\\n### 搜索图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Input, CopyToClipboard, Icon, Notify } from 'uiw';\\n\\nconst icons = [\\\"adobe\\\", \\\"alipay\\\", \\\"aliwangwang\\\", \\\"android-o\\\", \\\"android\\\", \\\"apple\\\", \\\"appstore-o\\\", \\\"appstore\\\", \\\"area-chart\\\", \\\"down\\\", \\\"left\\\", \\\"right\\\", \\\"up\\\", \\\"arrow-down\\\", \\\"arrow-left\\\", \\\"arrow-right\\\", \\\"arrow-up\\\", \\\"arrows-alt\\\", \\\"asterisk\\\", \\\"backward\\\", \\\"baidu\\\", \\\"bar-chart\\\", \\\"barcode\\\", \\\"bell\\\", \\\"camera-o\\\", \\\"caret-down\\\", \\\"caret-left\\\", \\\"caret-right\\\", \\\"caret-up\\\", \\\"check-square-o\\\", \\\"check-square\\\", \\\"check\\\", \\\"chrome\\\", \\\"circle-check-o\\\", \\\"circle-check\\\", \\\"circle-close-o\\\", \\\"circle-close\\\", \\\"close-square-o\\\", \\\"close-square\\\", \\\"close\\\", \\\"cloud-download-o\\\", \\\"cloud-download\\\", \\\"cloud-upload-o\\\", \\\"cloud-upload\\\", \\\"coffee\\\", \\\"component\\\", \\\"copy\\\", \\\"copyright\\\", \\\"css3\\\", \\\"cut\\\", \\\"d-arrow-left\\\", \\\"d-arrow-right\\\", \\\"d-caret\\\", \\\"dashboard\\\", \\\"date\\\", \\\"delete\\\", \\\"dingding\\\", \\\"dislike-o\\\", \\\"document\\\", \\\"dot-chart\\\", \\\"circle-o\\\", \\\"down-circle-o\\\", \\\"down-circle\\\", \\\"down-square-o\\\", \\\"down-square\\\", \\\"square-o\\\", \\\"download\\\", \\\"edit\\\", \\\"enter\\\", \\\"environment-o\\\", \\\"environment\\\", \\\"eye-o\\\", \\\"eye\\\", \\\"facebook\\\", \\\"file-add\\\", \\\"file-excel\\\", \\\"file-jpg\\\", \\\"file-pdf\\\", \\\"file-text\\\", \\\"file-unknown\\\", \\\"filter\\\", \\\"firefox\\\", \\\"folder-add\\\", \\\"folder-open\\\", \\\"folder\\\", \\\"forward\\\", \\\"foursquare\\\", \\\"frown-o\\\", \\\"frown\\\", \\\"github-o\\\", \\\"github\\\", \\\"global\\\", \\\"heart-off\\\", \\\"heart-on\\\", \\\"home\\\", \\\"html5\\\", \\\"ie\\\", \\\"inbox\\\", \\\"information-o\\\", \\\"information\\\", \\\"laptop\\\", \\\"left-circle-o\\\", \\\"left-circle\\\", \\\"left-square-o\\\", \\\"left-square\\\", \\\"like-o\\\", \\\"link\\\", \\\"linkedin\\\", \\\"linux\\\", \\\"loading\\\", \\\"lock\\\", \\\"login\\\", \\\"logout\\\", \\\"man\\\", \\\"map\\\", \\\"meh-o\\\", \\\"meh\\\", \\\"menu-fold\\\", \\\"menu-unfold\\\", \\\"menu\\\", \\\"mail\\\", \\\"mail-o\\\", \\\"message\\\", \\\"minus-circle-o\\\", \\\"minus-circle\\\", \\\"minus-square-o\\\", \\\"minus-square\\\", \\\"minus\\\", \\\"mobile\\\", \\\"more\\\", \\\"notification\\\", \\\"opera\\\", \\\"paper-clip\\\", \\\"pause-circle-o\\\", \\\"pause-circle\\\", \\\"pause\\\", \\\"pay-circle-o\\\", \\\"pay\\\", \\\"picasa\\\", \\\"picture\\\", \\\"pie-chart\\\", \\\"pinterest\\\", \\\"play-circle-o\\\", \\\"play-circle\\\", \\\"plus-circle-o\\\", \\\"plus-circle\\\", \\\"plus-square-o\\\", \\\"plus-square\\\", \\\"plus\\\", \\\"poweroff\\\", \\\"printer\\\", \\\"qq\\\", \\\"qrcode\\\", \\\"question-circle-o\\\", \\\"question-circle\\\", \\\"reddit\\\", \\\"reload\\\", \\\"right-circle-o\\\", \\\"right-circle\\\", \\\"right-square-o\\\", \\\"right-square\\\", \\\"rollback\\\", \\\"safari\\\", \\\"safety\\\", \\\"save\\\", \\\"search\\\", \\\"setting-o\\\", \\\"setting\\\", \\\"share\\\", \\\"shopping-cart\\\", \\\"shrink\\\", \\\"smile-o\\\", \\\"smile\\\", \\\"star-off\\\", \\\"star-on\\\", \\\"swap-left\\\", \\\"swap-right\\\", \\\"swap\\\", \\\"table\\\", \\\"tag-o\\\", \\\"tag\\\", \\\"tags-o\\\", \\\"tags\\\", \\\"taobao\\\", \\\"time-o\\\", \\\"time\\\", \\\"twitter\\\", \\\"uiw\\\", \\\"unlock\\\", \\\"up-circle-o\\\", \\\"up-circle\\\", \\\"up-square-o\\\", \\\"up-square\\\", \\\"upload\\\", \\\"user-add\\\", \\\"user-delete\\\", \\\"user\\\", \\\"usergroup-add\\\", \\\"usergroup-delete\\\", \\\"verification\\\", \\\"verticle-left\\\", \\\"verticle-right\\\", \\\"video-camera\\\", \\\"warning-o\\\", \\\"warning\\\", \\\"weibo\\\", \\\"weixin\\\", \\\"wifi\\\", \\\"windows\\\", \\\"woman\\\", \\\"zoom-in\\\", \\\"zoom-out\\\", 'stop-o', 'stop'];\\nconst itemStyl = {\\n  fontSize: 26, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center', justifyContent: 'center', fill: '#525252',\\n}\\nclass Demo extends React.Component {\\n  constructor(props) {\\n    super(props);\\n    this.state = {\\n      len: 0,\\n      result: [],\\n    }\\n  }\\n  onChange(env) {\\n    const value = env.target.value;\\n    const data = value ? icons.filter((item) => item.indexOf(value) > -1) : [];\\n    const len = data.length;\\n    const result = data.splice(0, 15);\\n    this.setState({ len, result });\\n  }\\n  render() {\\n    const { len, result } = this.state;\\n    return (\\n      <div>\\n        <Input preIcon=\\\"search\\\" placeholder=\\\"请输入图标名称\\\" type=\\\"text\\\" style={{ maxWidth: 200 }} onChange={this.onChange.bind(this)} />\\n        <div style={{ padding: '10px 0' }}>\\n          搜索到 {this.state.len} 个结果{len > 0 && <span>，下面展示 {len > 15 ? '15' : len} 个图标，可以点击复制图标代码: </span>}\\n        </div>\\n        <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n          {result.map((type, idx) => {\\n            const iconTxt = `<Icon type=\\\"${type}\\\" />`;\\n            return (\\n              <CopyToClipboard\\n                key={idx}\\n                style={itemStyl}\\n                text={iconTxt}\\n                onClick={() => {\\n                  Notify.success({\\n                    title: '你已复制内容！',\\n                    description: (\\n                      <span>\\n                        已复制 <b style={{ color: 'red' }}>{iconTxt}</b> 可以去粘贴了！\\n                      </span>\\n                    ),\\n                  });\\n                }}\\n              >\\n                <div key={idx}>\\n                  <Icon type={type} />\\n                  <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n                </div>\\n              </CopyToClipboard>\\n            )\\n          })}\\n        </div>\\n      </div>\\n    );\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## 如何使用\\n\\n使用`<Icon />`组件，指定图标对应的`type`属性，示例代码：\\n\\n```jsx\\nimport { Icon } from 'uiw';\\n```\\n\\n```jsx\\n<Icon type=\\\"minus\\\" />\\n```\\n\\n渲染为\\n\\n```jsx\\n<span class=\\\"w-icon w-icon-middle\\\">\\n  <svg viewBox=\\\"0 0 24 24\\\">\\n    <path d=\\\"M16.038 3.176c2.313-.551 4.58.248 5.648 1.603.985 1.25 1.433 2.55 1.287 4.468-.105 1.383-.55 2.408-1.428 3.536-.162.208-.34.421-.563.68-.13.153-.628.72-.602.692-.88 1.008-3.471 3.535-7.814 7.62a.83.83 0 0 1-1.139-.003c-3.728-3.55-6.141-5.888-7.248-7.022-2.043-2.094-2.82-3.31-3.102-5.276-.295-2.055.27-3.742 1.538-5.053 1.19-1.229 3.319-1.684 5.42-1.25 1.231.254 2.542 1.072 3.961 2.436 1.21-1.261 2.56-2.077 4.042-2.43z\\\" fill-rule=\\\"evenodd\\\">\\n    </path>\\n  </svg>\\n</span>\\n```\\n\\n示例如下:\\n\\n```jsx\\nconst Demo = () => (\\n  <div>\\n    <Icon type=\\\"arrow-down\\\" />\\n    <Icon type=\\\"minus\\\" />\\n    <Icon type=\\\"plus\\\" />\\n    <Icon type=\\\"check\\\" />\\n    <Icon type=\\\"close\\\" />\\n  </div>\\n)\\n```\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div style={{ fontSize: 18, lineHeight: '12px' }}>\\n    <Icon type=\\\"heart-on\\\" />\\n    <Icon type=\\\"pie-chart\\\" />\\n    <Icon type=\\\"tag\\\" />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 图标尺寸\\n\\n默认情况下，图标非常小，它们继承了父级的字体大小。 如果没有设置字体大小，可以通过 `size` 来设置尺寸。通常情况 `size` 会很累赘没有什么用。\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div style={{ fontSize: '28px' }}>\\n    <Icon type=\\\"heart-on\\\" />\\n    <Icon type=\\\"pie-chart\\\" />\\n    <Icon type=\\\"tag\\\" />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 图标颜色\\n\\n默认纯黑色图标，当前图标是 svg 格式展示，在为SVG设置样式时，请使用 `fill` 或 `stroke` 属性而不是 `color`。 这些可以直接在 `Icon` 上设置为 `style` 或通过 `CSS` 设置。\\n\\n> 一个有用的技巧是将 `fill` 设置为 `currentColor`，以便从图标容器的文本颜色继承填充颜色。\\n<!--rehype:style=border-left: 8px solid #ffe564;background-color: #ffe56440;padding: 12px 16px;-->\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div style={{ fontSize: '28px',color: 'green' }}>\\n    <Icon type=\\\"apple\\\" color=\\\"red\\\" />\\n    <Icon type=\\\"pie-chart\\\" style={{fill: 'currentColor'}} />\\n    <Icon type=\\\"frown\\\" style={{fill: 'blue'}} />\\n    <Icon type=\\\"uiw\\\" style={{stroke: 'red',fill: '#ffef00'}} />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 与文本对齐\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div>\\n    <h3 style={{ margin: 0 }}>Exit <Icon verticalAlign=\\\"baseline\\\" type=\\\"baidu\\\" /></h3>\\n    <span>uiw</span><Icon type=\\\"uiw\\\" verticalAlign=\\\"baseline\\\" style={{ fill: '#009688', fontSize: 21 }} />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 图标的命名规范\\n\\n我们为每个图标赋予了语义化的命名，命名规则如下:\\n\\n> \\\\[形状?\\\\]-\\\\[图标名\\\\]-\\\\[描线?\\\\]-\\\\[方向?\\\\]  \\n> 方向：`down`、`up`、`left`、`right`  \\n> 描线：`-o` 图标添加边框描线  \\n> 默认：`w-icon-` 默认引用的字体文件作用域  \\n> 自定定义：`w-icon-uiw-` 自定定义作用域  \\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div>\\n    <Icon type=\\\"circle-close\\\" verticalAlign=\\\"baseline\\\" />  图标名称：circle-close，[circle圈]-[关闭close]\\n    <br/>\\n    <Icon type=\\\"circle-close-o\\\" verticalAlign=\\\"baseline\\\" /> 图标名称：circle-close-o，[circle圈]-[关闭close]-[o描线]\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 图标旋转实例\\n\\n通过设置参数 `spin={true}` 来设置图标旋转。\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nReactDOM.render(\\n  <div style={{ fontSize: 21, color: 'green' }}>\\n    <Icon type=\\\"loading\\\" spin={true} color=\\\"red\\\" />\\n    <Icon type=\\\"reload\\\" spin={true} />\\n    <Icon type=\\\"picasa\\\" spin={true} style={{fill: 'blue'}} />\\n    <Icon type=\\\"smile-o\\\" spin={true} style={{fill: 'blue'}} />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 自定义图标\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst chat = (\\n  <svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\">\\n    <path d=\\\"M19 0H7c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h5.59l3.71 3.71c.17.18.42.29.7.29.55 0 1-.45 1-1v-3h1c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1zM7 13c-1.1 0-2-.9-2-2V4H1c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h1v3a1.003 1.003 0 0 0 1.71.71L7.41 16H13c.55 0 1-.45 1-1v-.17L12.17 13H7z\\\" fillRule=\\\"evenodd\\\" />\\n  </svg>\\n)\\nconst contrast = (\\n  <svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\">\\n    <path d=\\\"M19 8h-1.26c-.19-.73-.48-1.42-.85-2.06l.94-.94a.996.996 0 0 0 0-1.41l-1.41-1.41a.996.996 0 0 0-1.41 0l-.94.94c-.65-.38-1.34-.67-2.07-.86V1c0-.55-.45-1-1-1H9c-.55 0-1 .45-1 1v1.26c-.76.2-1.47.5-2.13.89L5 2.28a.972.972 0 0 0-1.36 0L2.28 3.64c-.37.38-.37.98 0 1.36l.87.87c-.39.66-.69 1.37-.89 2.13H1c-.55 0-1 .45-1 1v2c0 .55.45 1 1 1h1.26c.19.73.48 1.42.85 2.06l-.94.94a.996.996 0 0 0 0 1.41l1.41 1.41c.39.39 1.02.39 1.41 0l.94-.94c.64.38 1.33.66 2.06.85V19c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1.26c.76-.2 1.47-.5 2.13-.89l.88.87c.37.37.98.37 1.36 0l1.36-1.36c.37-.38.37-.98 0-1.36l-.87-.87c.4-.65.7-1.37.89-2.13H19c.55 0 1-.45 1-1V9c0-.55-.45-1-1-1zm-9 7c-2.76 0-5-2.24-5-5s2.24-5 5-5v10z\\\" fillRule=\\\"evenodd\\\" />\\n  </svg>\\n)\\nconst styl = { marginRight: 10 };\\n\\nReactDOM.render(\\n  <div style={{ fontSize: 21, color: 'green' }}>\\n    <Icon style={styl} type={chat} color=\\\"red\\\" />\\n    <Icon style={styl} type={contrast} spin={true} />\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n## 字体图标\\n\\n通过引入 [uiw-iconfont](https://github.com/uiwjs/icons) 字体样式，在 [uiw-iconfont官网](https://uiwjs.github.io/icons) 找到对应的图标名称，就可以使用了，`uiw` 已经依赖 `uiw-iconfont` 你无需安装即可使用，更多使用方法[查看官方文档](https://github.com/uiwjs/icons)。\\n\\n```bash\\n# 如果你没有安装，可单独使用，安装\\nnpm i uiw-iconfont --save\\n```\\n\\n引入字体样式\\n\\n```jsx\\nimport 'uiw-iconfont/fonts/w-icon.css';\\n```\\n\\n在 HTML 中使用：\\n\\n```html\\n<i className=\\\"w-icon-apple\\\"></i>\\n```\\n\\n在 React 中使用：\\n\\n```jsx\\nconst Demo = () => (\\n  <div style={{ color: 'green' }}>\\n    <i className=\\\"w-icon-apple\\\" />\\n    <i className=\\\"w-icon-appstore\\\" />\\n  </div>\\n)\\n```\\n\\n## API\\n\\n| 参数 | 说明 | 类型 | 默认值 |\\n|--------- |-------- |--------- |-------- |\\n| type | 图标的名称 | String/ReactNode | - |\\n| spin | 是否有旋转动画 |  Boolean | `false` |\\n| verticalAlign | 是否有旋转动画 | Enum {baseline, middle} | `baseline` |\\n| style | 设置图标的样式，例如 `fill` 和 `stroke` | Object | - |\\n\\n\\n## 所有图标\\n\\n### 方向性图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'circle-o', 'down-square-o','down-square','up-square-o', 'up-square','left-square-o','left-square', 'right-square-o', 'right-square',\\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n圆圈方向性图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'square-o', 'down-circle-o', 'down-circle','up-circle-o','up-circle','left-circle-o', 'left-circle','right-circle-o', 'right-circle','play-circle-o',  'play-circle',\\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n其它方向性图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'down', 'up', 'left', 'right', 'caret-down', 'caret-up', 'caret-left', 'caret-right', 'arrow-down', 'arrow-up', 'arrow-left', 'arrow-right',\\n  'shrink','arrows-alt','d-arrow-left','d-arrow-right','enter',\\n  'rollback', 'd-caret','backward','forward',  'logout', 'login', 'swap-left', 'swap-right', 'swap',\\n  'verticle-left', 'verticle-right', 'menu','menu-fold', 'menu-unfold',\\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 提示建议性图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'smile-o', 'smile','frown-o', 'frown', 'meh-o', 'meh', \\n  'pause-circle-o', 'pause', 'pause-circle', 'information-o', 'information', 'warning-o', 'warning',\\n  'question-circle-o', 'question-circle', 'stop-o', 'stop',\\n];\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n## 符号\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n 'plus', 'plus-circle-o','plus-circle', 'plus-square', 'plus-square-o',\\n 'minus', 'minus-circle-o', 'minus-circle', 'minus-square', 'minus-square-o', \\n 'close','circle-close-o', 'circle-close','close-square', 'close-square-o', 'asterisk',\\n  'check', 'circle-check-o', 'circle-check','check-square','check-square-o', 'copyright',\\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 文件\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'file-text', 'file-jpg', 'file-unknown', 'file-add', 'file-excel', 'file-pdf',\\n  'folder-add', 'folder-open', 'paper-clip', \\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 其它\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [\\n  'heart-off', 'heart-on', 'star-on', 'star-off','lock', 'unlock','dashboard',\\n  'area-chart', 'bar-chart', 'dot-chart','pie-chart',\\n  'dislike-o', 'like-o','loading', 'reload','appstore', 'appstore-o',\\n  'tag', 'tag-o','tags','tags-o', 'setting','setting-o','map','table','qrcode','barcode','printer',\\n  'cloud-upload','cloud-upload-o', 'cloud-download','cloud-download-o', 'download','message', 'mail', 'mail-o',\\n  'user', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'zoom-in', 'zoom-out','time', 'time-o',\\n  'bell', 'camera-o', 'coffee', 'document', 'delete', 'date', 'edit',  'eye-o', 'environment-o', 'filter', 'global', 'inbox', 'home', 'laptop', 'link', 'copy', 'more', 'shopping-cart', 'search', 'save', 'safety', 'poweroff', 'picasa', 'notification',\\n  'pay-circle-o', 'pay', 'picture', 'woman', 'man', 'verification', 'wifi', 'video-camera', 'mobile'\\n]\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 品牌标识\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = ['uiw', 'windows', 'linux', 'apple', 'facebook', 'twitter', 'adobe', 'baidu', 'alipay', 'android-o', 'android','reddit', 'github', 'github-o', 'aliwangwang',   'dingding', 'foursquare', 'linkedin', 'pinterest', 'qq',  'weibo', 'taobao', 'weixin', 'css3', 'html5'];\\n\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\\n### 浏览器图标\\n\\n<!--rehype:bgWhite=true&noCode=true&codeSandbox=true&codePen=true-->\\n```js\\nimport ReactDOM from 'react-dom';\\nimport { Icon } from 'uiw';\\n\\nconst iconList = [ \\\"chrome\\\", \\\"safari\\\", \\\"firefox\\\", \\\"opera\\\", \\\"ie\\\", ];\\nconst itemStyl = {\\n  fontSize: 18, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',\\n  display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fill: '#525252',\\n}\\n\\nReactDOM.render(\\n  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: -10, marginRight: -10 }}>\\n    {iconList.map((type, idx) => {\\n      return (\\n        <div key={idx} style={itemStyl}>\\n          <Icon type={type} />\\n          <div style={{ color: '#525252', fontSize: 12, paddingTop: 8 }}>{type}</div>\\n        </div>\\n      )\\n    })}\\n  </div>,\\n  _mount_\\n);\\n```\\n\";"],"names":[],"sourceRoot":""}

package/web/static/js/6036.289c2eb8.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[6036],{6036:function(e,n,t){t.r(n),n.default='Message \u8b66\u544a\u63d0\u793a\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-message/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-message.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-message)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-message.svg?label=@uiw/react-message)](https://npmjs.com/@uiw/react-message)\n\n\u8b66\u544a\u63d0\u793a\uff0c\u7528\u4e8e\u9875\u9762\u4e2d\u5c55\u793a\u91cd\u8981\u7684\u63d0\u793a\u4fe1\u606f\u3002\n\n```jsx\nimport { Message } from \'uiw\';\n// or\nimport Message from \'@uiw/react-message\';\n```\n\n### \u57fa\u7840\u7528\u6cd5\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from \'react-dom\';\nimport { Message, Divider } from \'uiw\';\n\nclass Demo extends React.Component {\n  render() {\n    return (\n      <div>\n        <Message type="success" title="\u6210\u529f\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u6210\u529f\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n        <Message\n          type="warning"\n          title={<div>\u8b66\u544a\u63d0\u793a\u6807\u9898</div>}\n          description="\u8fd9\u91cc\u662f\u8b66\u544a\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002"\n        />\n        <Message type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u8bf4\u660e\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n        <Message type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u9519\u8bef\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n\n        <Divider />\n        <Message type="success" title="\u6210\u529f\u63d0\u793a\u6807\u9898" />\n        <Message type="warning" title="\u8b66\u544a\u63d0\u793a\u6807\u9898" />\n        <Message type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898" />\n        <Message type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898" />\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n### \u663e\u793a\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport ReactDOM from \'react-dom\';\nimport { Message, Divider } from \'uiw\';\n\nfunction Demo() {\n  return (\n    <div>\n      <Message showIcon type="success" title="\u6210\u529f\u63d0\u793a\u6807\u9898" />\n      <Message showIcon type="warning" title="\u8b66\u544a\u63d0\u793a\u6807\u9898" />\n      <Message showIcon type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898" />\n      <Message showIcon type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898" />\n      <Divider />\n      <Message showIcon type="success" description="\u8fd9\u91cc\u662f\u6210\u529f\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n      <Message showIcon type="warning" description="\u8fd9\u91cc\u662f\u8b66\u544a\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002\u8fd9\u91cc\u5e76\u6ca1\u6709\u8bbe\u7f6e title\uff0c\u53ea\u8bbe\u7f6e description \u540c\u65f6\u8bbe\u7f6e\u663e\u793a\u56fe\u6807\u3002" />\n      <Message showIcon type="info" description="\u8fd9\u91cc\u662f\u8bf4\u660e\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n      <Message showIcon type="error" description="\u8fd9\u91cc\u662f\u9519\u8bef\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n      <Divider />\n      <Message showIcon type="success" title="\u6210\u529f\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u6210\u529f\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n      <Message\n        showIcon\n        type="warning"\n        title="\u8b66\u544a\u63d0\u793a\u6807\u9898"\n      >\n        \u8fd9\u91cc\u662f\u8b66\u544a\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002\n      </Message>\n      <Message showIcon type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u8bf4\u660e\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n      <Message showIcon type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898" description="\u8fd9\u91cc\u662f\u9519\u8bef\u63d0\u793a\u8be6\u60c5\u63cf\u8ff0\u3002" />\n    </div>\n  )\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n### \u81ea\u5b9a\u4e49\u56fe\u6807\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Message, Divider } from \'uiw\';\n\nconst chat = ( <svg width="20" height="20" viewBox="0 0 20 20"> <path d="M19 0H7c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h5.59l3.71 3.71c.17.18.42.29.7.29.55 0 1-.45 1-1v-3h1c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1zM7 13c-1.1 0-2-.9-2-2V4H1c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h1v3a1.003 1.003 0 0 0 1.71.71L7.41 16H13c.55 0 1-.45 1-1v-.17L12.17 13H7z" fillRule="evenodd" /> </svg> );\nconst closed = <svg viewBox="0 0 16 16" width="16" height="16"> <path fillRule="evenodd" d="M7 10h2v2H7v-2zm2-6H7v5h2V4zm1.5 1.5l-1 1L12 9l4-4.5-1-1L12 7l-1.5-1.5zM8 13.7A5.71 5.71 0 0 1 2.3 8c0-3.14 2.56-5.7 5.7-5.7 1.83 0 3.45.88 4.5 2.2l.92-.92A6.947 6.947 0 0 0 8 1C4.14 1 1 4.14 1 8s3.14 7 7 7 7-3.14 7-7l-1.52 1.52c-.66 2.41-2.86 4.19-5.48 4.19v-.01z" /> </svg>;\nclass Demo extends React.Component {\n  render() {\n    return (\n      <div>\n        <Message showIcon icon="apple" type="error" title="\u81ea\u5b9a\u4e49\u56fe\u6807" description="\u8fd9\u91cc\u81ea\u5b9a\u4e49Icon\u7ec4\u4ef6\u56fe\u6807\u3002" />\n        <Message showIcon icon={chat} type="info" title="\u81ea\u5b9a\u4e49\u56fe\u6807" description="\u8fd9\u91cc\u81ea\u5b9a\u4e49 SVG \u56fe\u6807\u3002" />\n        <Message showIcon icon={closed} type="success" title="\u81ea\u5b9a\u4e49\u56fe\u6807" description="\u8fd9\u91cc\u81ea\u5b9a\u4e49 SVG \u56fe\u6807\u3002" />\n        <Divider />\n        <Message showIcon icon={chat} type="success" title="\u6210\u529f\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n        <Message showIcon icon={closed} type="warning" title="\u8b66\u544a\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n        <Message showIcon icon="apple" type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n        <Message showIcon icon="file-jpg" type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n### \u5173\u95ed\u6309\u94ae\n\n\x3c!--rehype:bgWhite=true&codeSandbox=true&codePen=true--\x3e\n```jsx\nimport React from \'react\';\nimport ReactDOM from \'react-dom\';\nimport { Message, Divider } from \'uiw\';\n\nclass Demo extends React.Component {\n  render() {\n    return (\n      <div>\n        <Message\n          showIcon\n          isCloseButtonShown\n          type="success"\n          title="\u81ea\u5b9a\u4e49\u56fe\u6807"\n          description="\u8fd9\u91cc\u8bbe\u7f6e\u53c2\u6570 isCloseButtonShown \u663e\u793a\u5173\u95ed\u6309\u94ae\u3002\u8fd9\u91cc\u8bbe\u7f6e title \u548c description \u540c\u65f6\u8bbe\u7f6e\u663e\u793a\u56fe\u6807\u3002"\n        />\n        <Divider />\n        <Message showIcon isCloseButtonShown type="info" title="\u8bf4\u660e\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n        <Message isCloseButtonShown type="error" title="\u9519\u8bef\u63d0\u793a\u6807\u9898\uff0c\u81ea\u5b9a\u4e49\u56fe\u6807\u3002" />\n      </div>\n    )\n  }\n}\nReactDOM.render(<Demo />, _mount_);\n```\n\n## Props\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| type | \u6307\u5b9a\u8b66\u544a\u63d0\u793a\u7684\u6837\u5f0f | Enum{`success`, `warning`, `info`, `error`} | - |\n| title | \u8b66\u544a\u63d0\u793a\u6807\u9898 | String/ReactNode | - |\n| description | \u8b66\u544a\u63d0\u793a\u63cf\u8ff0\u8be6\u60c5 | String/ReactNode | - |\n| rounded | \u662f\u5426\u663e\u793a\u5706\u89d2 | Boolean | - |\n| showIcon | \u8bbe\u5b9a\u663e\u793a\u56fe\u6807 | Boolean | - |\n| isCloseButtonShown | \u663e\u793a\u5173\u95ed\u6309\u94ae | Boolean | - |\n| icon | \u81ea\u5b9a\u4e49\u56fe\u6807\uff0c\u8bbe\u7f6e `showIcon=true` \u624d\u4f1a\u8d77\u4f5c\u7528\u3002 | String/ReactNode | - |\n| onClose | \u70b9\u51fb\u9ed8\u8ba4\u5173\u95ed\u6309\u94ae\u65f6\u89e6\u53d1\u7684\u56de\u8c03\u51fd\u6570\t | Function | - |'}}]);
+//# sourceMappingURL=6036.289c2eb8.chunk.js.map

package/web/static/js/6036.289c2eb8.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/6036.289c2eb8.chunk.js","mappings":"+GAAA","sources":["../../packages/react-message/README.md"],"sourcesContent":["export default \"Message 警告提示\\n===\\n\\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-message/file/README.md)\\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-message.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-message)\\n[![npm version](https://img.shields.io/npm/v/@uiw/react-message.svg?label=@uiw/react-message)](https://npmjs.com/@uiw/react-message)\\n\\n警告提示，用于页面中展示重要的提示信息。\\n\\n```jsx\\nimport { Message } from 'uiw';\\n// or\\nimport Message from '@uiw/react-message';\\n```\\n\\n### 基础用法\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Message, Divider } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  render() {\\n    return (\\n      <div>\\n        <Message type=\\\"success\\\" title=\\\"成功提示标题\\\" description=\\\"这里是成功提示详情描述。\\\" />\\n        <Message\\n          type=\\\"warning\\\"\\n          title={<div>警告提示标题</div>}\\n          description=\\\"这里是警告提示详情描述。\\\"\\n        />\\n        <Message type=\\\"info\\\" title=\\\"说明提示标题\\\" description=\\\"这里是说明提示详情描述。\\\" />\\n        <Message type=\\\"error\\\" title=\\\"错误提示标题\\\" description=\\\"这里是错误提示详情描述。\\\" />\\n\\n        <Divider />\\n        <Message type=\\\"success\\\" title=\\\"成功提示标题\\\" />\\n        <Message type=\\\"warning\\\" title=\\\"警告提示标题\\\" />\\n        <Message type=\\\"info\\\" title=\\\"说明提示标题\\\" />\\n        <Message type=\\\"error\\\" title=\\\"错误提示标题\\\" />\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 显示图标\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Message, Divider } from 'uiw';\\n\\nfunction Demo() {\\n  return (\\n    <div>\\n      <Message showIcon type=\\\"success\\\" title=\\\"成功提示标题\\\" />\\n      <Message showIcon type=\\\"warning\\\" title=\\\"警告提示标题\\\" />\\n      <Message showIcon type=\\\"info\\\" title=\\\"说明提示标题\\\" />\\n      <Message showIcon type=\\\"error\\\" title=\\\"错误提示标题\\\" />\\n      <Divider />\\n      <Message showIcon type=\\\"success\\\" description=\\\"这里是成功提示详情描述。\\\" />\\n      <Message showIcon type=\\\"warning\\\" description=\\\"这里是警告提示详情描述。这里并没有设置 title，只设置 description 同时设置显示图标。\\\" />\\n      <Message showIcon type=\\\"info\\\" description=\\\"这里是说明提示详情描述。\\\" />\\n      <Message showIcon type=\\\"error\\\" description=\\\"这里是错误提示详情描述。\\\" />\\n      <Divider />\\n      <Message showIcon type=\\\"success\\\" title=\\\"成功提示标题\\\" description=\\\"这里是成功提示详情描述。\\\" />\\n      <Message\\n        showIcon\\n        type=\\\"warning\\\"\\n        title=\\\"警告提示标题\\\"\\n      >\\n        这里是警告提示详情描述。\\n      </Message>\\n      <Message showIcon type=\\\"info\\\" title=\\\"说明提示标题\\\" description=\\\"这里是说明提示详情描述。\\\" />\\n      <Message showIcon type=\\\"error\\\" title=\\\"错误提示标题\\\" description=\\\"这里是错误提示详情描述。\\\" />\\n    </div>\\n  )\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 自定义图标\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Message, Divider } from 'uiw';\\n\\nconst chat = ( <svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\"> <path d=\\\"M19 0H7c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h5.59l3.71 3.71c.17.18.42.29.7.29.55 0 1-.45 1-1v-3h1c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1zM7 13c-1.1 0-2-.9-2-2V4H1c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h1v3a1.003 1.003 0 0 0 1.71.71L7.41 16H13c.55 0 1-.45 1-1v-.17L12.17 13H7z\\\" fillRule=\\\"evenodd\\\" /> </svg> );\\nconst closed = <svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\"> <path fillRule=\\\"evenodd\\\" d=\\\"M7 10h2v2H7v-2zm2-6H7v5h2V4zm1.5 1.5l-1 1L12 9l4-4.5-1-1L12 7l-1.5-1.5zM8 13.7A5.71 5.71 0 0 1 2.3 8c0-3.14 2.56-5.7 5.7-5.7 1.83 0 3.45.88 4.5 2.2l.92-.92A6.947 6.947 0 0 0 8 1C4.14 1 1 4.14 1 8s3.14 7 7 7 7-3.14 7-7l-1.52 1.52c-.66 2.41-2.86 4.19-5.48 4.19v-.01z\\\" /> </svg>;\\nclass Demo extends React.Component {\\n  render() {\\n    return (\\n      <div>\\n        <Message showIcon icon=\\\"apple\\\" type=\\\"error\\\" title=\\\"自定义图标\\\" description=\\\"这里自定义Icon组件图标。\\\" />\\n        <Message showIcon icon={chat} type=\\\"info\\\" title=\\\"自定义图标\\\" description=\\\"这里自定义 SVG 图标。\\\" />\\n        <Message showIcon icon={closed} type=\\\"success\\\" title=\\\"自定义图标\\\" description=\\\"这里自定义 SVG 图标。\\\" />\\n        <Divider />\\n        <Message showIcon icon={chat} type=\\\"success\\\" title=\\\"成功提示标题，自定义图标。\\\" />\\n        <Message showIcon icon={closed} type=\\\"warning\\\" title=\\\"警告提示标题，自定义图标。\\\" />\\n        <Message showIcon icon=\\\"apple\\\" type=\\\"info\\\" title=\\\"说明提示标题，自定义图标。\\\" />\\n        <Message showIcon icon=\\\"file-jpg\\\" type=\\\"error\\\" title=\\\"错误提示标题，自定义图标。\\\" />\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 关闭按钮\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport React from 'react';\\nimport ReactDOM from 'react-dom';\\nimport { Message, Divider } from 'uiw';\\n\\nclass Demo extends React.Component {\\n  render() {\\n    return (\\n      <div>\\n        <Message\\n          showIcon\\n          isCloseButtonShown\\n          type=\\\"success\\\"\\n          title=\\\"自定义图标\\\"\\n          description=\\\"这里设置参数 isCloseButtonShown 显示关闭按钮。这里设置 title 和 description 同时设置显示图标。\\\"\\n        />\\n        <Divider />\\n        <Message showIcon isCloseButtonShown type=\\\"info\\\" title=\\\"说明提示标题，自定义图标。\\\" />\\n        <Message isCloseButtonShown type=\\\"error\\\" title=\\\"错误提示标题，自定义图标。\\\" />\\n      </div>\\n    )\\n  }\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## Props\\n\\n| 参数 | 说明 | 类型 | 默认值 |\\n|--------- |-------- |--------- |-------- |\\n| type | 指定警告提示的样式 | Enum{`success`, `warning`, `info`, `error`} | - |\\n| title | 警告提示标题 | String/ReactNode | - |\\n| description | 警告提示描述详情 | String/ReactNode | - |\\n| rounded | 是否显示圆角 | Boolean | - |\\n| showIcon | 设定显示图标 | Boolean | - |\\n| isCloseButtonShown | 显示关闭按钮 | Boolean | - |\\n| icon | 自定义图标，设置 `showIcon=true` 才会起作用。 | String/ReactNode | - |\\n| onClose | 点击默认关闭按钮时触发的回调函数\\t | Function | - |\";"],"names":[],"sourceRoot":""}

package/web/static/js/6216.93b30f41.chunk.js

@@ -0,0 +1,2 @@
+(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[6216],{84934:function(e){function n(e){var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}n.keys=function(){return[]},n.resolve=n,n.id=84934,e.exports=n},86082:function(e,n,t){"use strict";t.d(n,{Z:function(){return j}});var r=t(50189),o=t(53782),i=t(11026),s=t(41473),c=t(89171),d=t(75752),a=t(2642),u=t(69286),l=["version","dependencies","codePen","codeSandbox"];function p(e){var n=e.version,t=e.dependencies,i=e.codePen,s=e.codeSandbox,c=(0,o.Z)(e,l),d=(0,r.Z)({},c);return i&&(d.codePenOption={title:"uiw".concat(n," - demo"),includeModule:["uiw"],js:(d.code||"").replace("_mount_",'document.getElementById("container")'),html:'<div id="container" style="padding: 24px"></div>',css_external:"https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.css"),js_external:"https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js")}),s&&(d.codeSandboxOption={files:{"sandbox.config.json":{content:'{\n            "template": "node",\n            "container": {\n              "startScript": "start",\n              "node": "14"\n            }\n          }'},"public/index.html":{content:'<div id="container"></div>'},"src/index.js":{content:(d.code||"").replace("_mount_",'document.getElementById("container")')},".kktrc.js":{content:'import lessModules from "@kkt/less-modules";\nexport default (conf, env, options) => {\nconf = lessModules(conf, env, options);\nreturn conf;\n};'},"package.json":{content:{name:"uiw-demo",description:"uiw v".concat(n," - demo"),dependencies:{react:"^17.0.2","react-dom":"^17.0.2",uiw:"latest"},devDependencies:{"@kkt/less-modules":"~7.1.1",kkt:"~7.1.5"},license:"MIT",scripts:{start:"kkt start",build:"kkt build",test:"kkt test --env=jsdom"},browserslist:[">0.2%","not dead","not ie <= 11","not op_mini all"]}}}}),(0,u.jsx)(a.Z,(0,r.Z)((0,r.Z)({},d),{},{dependencies:t,style:{marginBottom:0}}))}var h=t(53864);function m(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.path,t=/^http/.test(n||"")?n:"https://github.com/uiwjs/uiw/blob/master/".concat(n);return(0,u.jsxs)(s.Fragment,{children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",t&&(0,u.jsx)("a",{href:t,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,u.jsx)("br",{}),(0,u.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}var f="index_docinfo__3Vx8S",k="index_markdown__hcQCp",x=["inline","node"],b=function e(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return n.forEach((function(n){"text"===n.type?t+=n.value:n.children&&Array.isArray(n.children)&&(t+=e(n.children))})),t};function j(e){var n=e.renderPage,t=e.dependencies,a=e.path,l=(0,s.useState)(""),h=(0,i.Z)(l,2),j=h[0],v=h[1],g=d.i8||"2.0.0";return(0,s.useEffect)((function(){n&&n().then((function(e){v(e)})).catch((function(){}))}),[]),j?(0,u.jsxs)("div",{children:[(0,u.jsx)(c.Z,{source:j,className:k,components:{code:function(e){var n=e.inline,i=e.node,s=(0,o.Z)(e,x),c=s,d=c.noPreview,a=c.bordered,l=c.noScroll,h=c.bgWhite,m=c.noCode,f=c.codePen,k=c.codeSandbox;if(n)return(0,u.jsx)("code",(0,r.Z)({},s));var j={noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:m,codePen:f,codeSandbox:k};return 0===Object.keys(j).filter((function(e){return void 0!==j[e]})).length?(0,u.jsx)("code",(0,r.Z)({},s)):(0,u.jsx)(p,{version:g,code:b(i.children),dependencies:t,noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:m,codePen:f,codeSandbox:k})}}}),(0,u.jsx)("div",{className:f,children:(0,u.jsx)(m,{path:a})})]}):null}},56238:function(e,n,t){"use strict";t.r(n);var r=t(27791),o=t(57135),i=t.n(o),s=(t(41473),t(86082)),c=t(69286);n.default=function(){return(0,c.jsx)(s.Z,{path:"https://github.com/uiwjs/uiw/tree/master/website/src/routes/guide/import/README.md",renderPage:(0,r.Z)(i().mark((function e(){var n;return i().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,t.e(1358).then(t.bind(t,71358));case 2:return n=e.sent,e.abrupt("return",n.default||n);case 4:case"end":return e.stop()}}),e)})))})}}}]);
+//# sourceMappingURL=6216.93b30f41.chunk.js.map

package/web/static/js/6216.93b30f41.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/6216.93b30f41.chunk.js","mappings":"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","sources":["../../node_modules/@babel/standalone|sync|nonrecursive","components/Markdown/Code.tsx","components/Markdown/Footer.tsx","webpack://website/./src/components/Markdown/index.module.less?6e49","components/Markdown/index.tsx","routes/guide/import/index.tsx"],"sourcesContent":["function webpackEmptyContext(req) {\n\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\te.code = 'MODULE_NOT_FOUND';\n\tthrow e;\n}\nwebpackEmptyContext.keys = function() { return []; };\nwebpackEmptyContext.resolve = webpackEmptyContext;\nwebpackEmptyContext.id = 84934;\nmodule.exports = webpackEmptyContext;","import CodePreview, { CodePreviewProps } from '@uiw/react-code-preview';\n\nexport interface CodeProps extends CodePreviewProps {\n  code: string;\n  version: string;\n  codePen: boolean;\n  codeSandbox?: boolean;\n  dependencies: any;\n}\n\nexport default function Code({ version, dependencies, codePen, codeSandbox, ...other }: CodeProps) {\n  const props: CodePreviewProps = { ...other };\n  if (codePen) {\n    props.codePenOption = {\n      title: `uiw${version} - demo`,\n      includeModule: ['uiw'],\n      js: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n      html: '<div id=\"container\" style=\"padding: 24px\"></div>',\n      css_external: `https://unpkg.com/uiw@${version}/dist/uiw.min.css`,\n      js_external: `https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@${version}/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js`,\n    };\n  }\n  if (codeSandbox) {\n    props.codeSandboxOption = {\n      files: {\n        'sandbox.config.json': {\n          content: `{\n            \"template\": \"node\",\n            \"container\": {\n              \"startScript\": \"start\",\n              \"node\": \"14\"\n            }\n          }`,\n        },\n        'public/index.html': {\n          content: `<div id=\"container\"></div>`,\n        },\n        'src/index.js': {\n          content: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n        },\n        '.kktrc.js': {\n          content: `import lessModules from \"@kkt/less-modules\";\\nexport default (conf, env, options) => {\\nconf = lessModules(conf, env, options);\\nreturn conf;\\n};`,\n        },\n        'package.json': {\n          content: {\n            name: 'uiw-demo',\n            description: `uiw v${version} - demo`,\n            dependencies: {\n              react: '^17.0.2',\n              'react-dom': '^17.0.2',\n              uiw: 'latest',\n            },\n            devDependencies: {\n              '@kkt/less-modules': '~7.1.1',\n              kkt: '~7.1.5',\n            },\n            license: 'MIT',\n            scripts: {\n              start: 'kkt start',\n              build: 'kkt build',\n              test: 'kkt test --env=jsdom',\n            },\n            browserslist: ['>0.2%', 'not dead', 'not ie <= 11', 'not op_mini all'],\n          },\n        },\n      },\n    };\n  }\n  return <CodePreview {...props} dependencies={dependencies} style={{ marginBottom: 0 }} />;\n}\n","import React, { Fragment } from 'react';\nimport { Divider } from 'uiw';\n\nexport type FooterProps = {\n  path?: string;\n};\n\nexport default function (props: FooterProps = {}) {\n  const { path } = props;\n  const url = /^http/.test(path || '') ? path : `https://github.com/uiwjs/uiw/blob/master/${path}`;\n  return (\n    <Fragment>\n      犯了错误还是想对文件做出贡献？\n      {url && (\n        <a href={url} target=\"_blank\" rel=\"noopener noreferrer\">\n          在Github上编辑本页！\n        </a>\n      )}\n      <br />\n      <a href=\"https://github.com/uiwjs/uiw/issues\" target=\"_blank\" rel=\"noopener noreferrer\">\n        反馈建议\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw/issues/new\">\n        提交bug\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw\">\n        Github\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt\">\n        kkt\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt-ssr\">\n        @kkt/ssr\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"http://uiw.gitee.io\">\n        国内镜像\n      </a>\n    </Fragment>\n  );\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"docinfo\":\"index_docinfo__3Vx8S\",\"markdown\":\"index_markdown__hcQCp\"};","import { useEffect, useState } from 'react';\nimport MarkdownPreview from '@uiw/react-markdown-preview';\nimport pkg from 'uiw/package.json';\nimport Code from './Code';\nimport Footer from './Footer';\nimport styles from './index.module.less';\n\nexport type CreatePageProps<T> = {\n  dependencies?: T;\n  path: string;\n  renderPage?: () => Promise<string>;\n};\n\nconst getCodeStr = (data: any[] = [], code: string = '') => {\n  data.forEach((node) => {\n    if (node.type === 'text') {\n      code += node.value;\n    } else if (node.children && Array.isArray(node.children)) {\n      code += getCodeStr(node.children);\n    }\n  });\n  return code;\n};\n\nexport default function CreatePage<T>(props: CreatePageProps<T>) {\n  const { renderPage, dependencies, path } = props;\n  const [mdStr, setMdStr] = useState('');\n\n  const version = pkg.version || '2.0.0';\n  useEffect(() => {\n    if (renderPage) {\n      renderPage()\n        .then((str) => {\n          setMdStr(str);\n        })\n        .catch(() => {});\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  if (!mdStr) {\n    return null;\n  }\n\n  return (\n    <div>\n      <MarkdownPreview\n        source={mdStr}\n        className={styles.markdown}\n        components={{\n          /**\n           * bordered 边框\n           * bgWhite 设置代码预览背景白色，否则为格子背景。\n           * noCode 不显示代码编辑器。\n           * noPreview 不显示代码预览效果。\n           * noScroll 预览区域不显示滚动条。\n           * codePen 显示 Codepen 按钮，要特别注意 包导入的问题，实例中的 import 主要用于 Codepen 使用。\n           */\n          code: ({ inline, node, ...props }) => {\n            const { noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox } = props as any;\n            if (inline) {\n              return <code {...props} />;\n            }\n            const config = {\n              noPreview,\n              bordered,\n              noScroll,\n              bgWhite,\n              noCode,\n              codePen,\n              codeSandbox,\n            } as any;\n            if (Object.keys(config).filter((name) => config[name] !== undefined).length === 0) {\n              return <code {...props} />;\n            }\n            return (\n              <Code\n                version={version}\n                code={getCodeStr(node.children)}\n                dependencies={dependencies}\n                {...{ noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox }}\n              />\n            );\n          },\n        }}\n      />\n      <div className={styles.docinfo}>\n        <Footer path={path} />\n      </div>\n    </div>\n  );\n}\n","import React from 'react';\nimport Markdown from '../../../components/Markdown';\n\nexport default () => (\n  <Markdown\n    path=\"https://github.com/uiwjs/uiw/tree/master/website/src/routes/guide/import/README.md\"\n    renderPage={async () => {\n      const md = await import('./README.md');\n      return md.default || md;\n    }}\n  />\n);\n"],"names":["webpackEmptyContext","req","e","Error","code","keys","resolve","id","module","exports","Code","version","dependencies","codePen","codeSandbox","other","props","codePenOption","title","includeModule","js","replace","html","css_external","js_external","codeSandboxOption","files","content","name","description","react","uiw","devDependencies","kkt","license","scripts","start","build","test","browserslist","style","marginBottom","path","url","Fragment","href","target","rel","type","getCodeStr","data","forEach","node","value","children","Array","isArray","CreatePage","renderPage","useState","mdStr","setMdStr","pkg","useEffect","then","str","catch","source","className","styles","components","inline","noPreview","bordered","noScroll","bgWhite","noCode","config","Object","filter","undefined","length","Footer","md","default"],"sourceRoot":""}

package/web/static/js/6221.0b909b28.chunk.js

@@ -0,0 +1,2 @@
+(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[6221],{84934:function(e){function n(e){var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}n.keys=function(){return[]},n.resolve=n,n.id=84934,e.exports=n},86082:function(e,n,t){"use strict";t.d(n,{Z:function(){return j}});var r=t(50189),o=t(53782),i=t(11026),s=t(41473),c=t(89171),d=t(75752),a=t(2642),u=t(69286),l=["version","dependencies","codePen","codeSandbox"];function p(e){var n=e.version,t=e.dependencies,i=e.codePen,s=e.codeSandbox,c=(0,o.Z)(e,l),d=(0,r.Z)({},c);return i&&(d.codePenOption={title:"uiw".concat(n," - demo"),includeModule:["uiw"],js:(d.code||"").replace("_mount_",'document.getElementById("container")'),html:'<div id="container" style="padding: 24px"></div>',css_external:"https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.css"),js_external:"https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js")}),s&&(d.codeSandboxOption={files:{"sandbox.config.json":{content:'{\n            "template": "node",\n            "container": {\n              "startScript": "start",\n              "node": "14"\n            }\n          }'},"public/index.html":{content:'<div id="container"></div>'},"src/index.js":{content:(d.code||"").replace("_mount_",'document.getElementById("container")')},".kktrc.js":{content:'import lessModules from "@kkt/less-modules";\nexport default (conf, env, options) => {\nconf = lessModules(conf, env, options);\nreturn conf;\n};'},"package.json":{content:{name:"uiw-demo",description:"uiw v".concat(n," - demo"),dependencies:{react:"^17.0.2","react-dom":"^17.0.2",uiw:"latest"},devDependencies:{"@kkt/less-modules":"~7.1.1",kkt:"~7.1.5"},license:"MIT",scripts:{start:"kkt start",build:"kkt build",test:"kkt test --env=jsdom"},browserslist:[">0.2%","not dead","not ie <= 11","not op_mini all"]}}}}),(0,u.jsx)(a.Z,(0,r.Z)((0,r.Z)({},d),{},{dependencies:t,style:{marginBottom:0}}))}var h=t(53864);function f(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.path,t=/^http/.test(n||"")?n:"https://github.com/uiwjs/uiw/blob/master/".concat(n);return(0,u.jsxs)(s.Fragment,{children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",t&&(0,u.jsx)("a",{href:t,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,u.jsx)("br",{}),(0,u.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}var m="index_docinfo__3Vx8S",k="index_markdown__hcQCp",x=["inline","node"],b=function e(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return n.forEach((function(n){"text"===n.type?t+=n.value:n.children&&Array.isArray(n.children)&&(t+=e(n.children))})),t};function j(e){var n=e.renderPage,t=e.dependencies,a=e.path,l=(0,s.useState)(""),h=(0,i.Z)(l,2),j=h[0],v=h[1],g=d.i8||"2.0.0";return(0,s.useEffect)((function(){n&&n().then((function(e){v(e)})).catch((function(){}))}),[]),j?(0,u.jsxs)("div",{children:[(0,u.jsx)(c.Z,{source:j,className:k,components:{code:function(e){var n=e.inline,i=e.node,s=(0,o.Z)(e,x),c=s,d=c.noPreview,a=c.bordered,l=c.noScroll,h=c.bgWhite,f=c.noCode,m=c.codePen,k=c.codeSandbox;if(n)return(0,u.jsx)("code",(0,r.Z)({},s));var j={noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k};return 0===Object.keys(j).filter((function(e){return void 0!==j[e]})).length?(0,u.jsx)("code",(0,r.Z)({},s)):(0,u.jsx)(p,{version:g,code:b(i.children),dependencies:t,noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k})}}}),(0,u.jsx)("div",{className:m,children:(0,u.jsx)(f,{path:a})})]}):null}},17068:function(e,n,t){"use strict";t.r(n);var r=t(27791),o=t(57135),i=t.n(o),s=(t(41473),t(86082)),c=t(69286);n.default=function(){return(0,c.jsx)(s.Z,{path:"https://github.com/uiwjs/reset-css/blob/master/README.md",renderPage:(0,r.Z)(i().mark((function e(){var n;return i().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,t.e(3259).then(t.bind(t,83259));case 2:return n=e.sent,e.abrupt("return",n.default||n);case 4:case"end":return e.stop()}}),e)})))})}}}]);
+//# sourceMappingURL=6221.0b909b28.chunk.js.map

package/web/static/js/6221.0b909b28.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/6221.0b909b28.chunk.js","mappings":"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","sources":["../../node_modules/@babel/standalone|sync|nonrecursive","components/Markdown/Code.tsx","components/Markdown/Footer.tsx","webpack://website/./src/components/Markdown/index.module.less?6e49","components/Markdown/index.tsx","routes/components/reset-css/index.tsx"],"sourcesContent":["function webpackEmptyContext(req) {\n\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\te.code = 'MODULE_NOT_FOUND';\n\tthrow e;\n}\nwebpackEmptyContext.keys = function() { return []; };\nwebpackEmptyContext.resolve = webpackEmptyContext;\nwebpackEmptyContext.id = 84934;\nmodule.exports = webpackEmptyContext;","import CodePreview, { CodePreviewProps } from '@uiw/react-code-preview';\n\nexport interface CodeProps extends CodePreviewProps {\n  code: string;\n  version: string;\n  codePen: boolean;\n  codeSandbox?: boolean;\n  dependencies: any;\n}\n\nexport default function Code({ version, dependencies, codePen, codeSandbox, ...other }: CodeProps) {\n  const props: CodePreviewProps = { ...other };\n  if (codePen) {\n    props.codePenOption = {\n      title: `uiw${version} - demo`,\n      includeModule: ['uiw'],\n      js: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n      html: '<div id=\"container\" style=\"padding: 24px\"></div>',\n      css_external: `https://unpkg.com/uiw@${version}/dist/uiw.min.css`,\n      js_external: `https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@${version}/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js`,\n    };\n  }\n  if (codeSandbox) {\n    props.codeSandboxOption = {\n      files: {\n        'sandbox.config.json': {\n          content: `{\n            \"template\": \"node\",\n            \"container\": {\n              \"startScript\": \"start\",\n              \"node\": \"14\"\n            }\n          }`,\n        },\n        'public/index.html': {\n          content: `<div id=\"container\"></div>`,\n        },\n        'src/index.js': {\n          content: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n        },\n        '.kktrc.js': {\n          content: `import lessModules from \"@kkt/less-modules\";\\nexport default (conf, env, options) => {\\nconf = lessModules(conf, env, options);\\nreturn conf;\\n};`,\n        },\n        'package.json': {\n          content: {\n            name: 'uiw-demo',\n            description: `uiw v${version} - demo`,\n            dependencies: {\n              react: '^17.0.2',\n              'react-dom': '^17.0.2',\n              uiw: 'latest',\n            },\n            devDependencies: {\n              '@kkt/less-modules': '~7.1.1',\n              kkt: '~7.1.5',\n            },\n            license: 'MIT',\n            scripts: {\n              start: 'kkt start',\n              build: 'kkt build',\n              test: 'kkt test --env=jsdom',\n            },\n            browserslist: ['>0.2%', 'not dead', 'not ie <= 11', 'not op_mini all'],\n          },\n        },\n      },\n    };\n  }\n  return <CodePreview {...props} dependencies={dependencies} style={{ marginBottom: 0 }} />;\n}\n","import React, { Fragment } from 'react';\nimport { Divider } from 'uiw';\n\nexport type FooterProps = {\n  path?: string;\n};\n\nexport default function (props: FooterProps = {}) {\n  const { path } = props;\n  const url = /^http/.test(path || '') ? path : `https://github.com/uiwjs/uiw/blob/master/${path}`;\n  return (\n    <Fragment>\n      犯了错误还是想对文件做出贡献？\n      {url && (\n        <a href={url} target=\"_blank\" rel=\"noopener noreferrer\">\n          在Github上编辑本页！\n        </a>\n      )}\n      <br />\n      <a href=\"https://github.com/uiwjs/uiw/issues\" target=\"_blank\" rel=\"noopener noreferrer\">\n        反馈建议\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw/issues/new\">\n        提交bug\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw\">\n        Github\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt\">\n        kkt\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt-ssr\">\n        @kkt/ssr\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"http://uiw.gitee.io\">\n        国内镜像\n      </a>\n    </Fragment>\n  );\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"docinfo\":\"index_docinfo__3Vx8S\",\"markdown\":\"index_markdown__hcQCp\"};","import { useEffect, useState } from 'react';\nimport MarkdownPreview from '@uiw/react-markdown-preview';\nimport pkg from 'uiw/package.json';\nimport Code from './Code';\nimport Footer from './Footer';\nimport styles from './index.module.less';\n\nexport type CreatePageProps<T> = {\n  dependencies?: T;\n  path: string;\n  renderPage?: () => Promise<string>;\n};\n\nconst getCodeStr = (data: any[] = [], code: string = '') => {\n  data.forEach((node) => {\n    if (node.type === 'text') {\n      code += node.value;\n    } else if (node.children && Array.isArray(node.children)) {\n      code += getCodeStr(node.children);\n    }\n  });\n  return code;\n};\n\nexport default function CreatePage<T>(props: CreatePageProps<T>) {\n  const { renderPage, dependencies, path } = props;\n  const [mdStr, setMdStr] = useState('');\n\n  const version = pkg.version || '2.0.0';\n  useEffect(() => {\n    if (renderPage) {\n      renderPage()\n        .then((str) => {\n          setMdStr(str);\n        })\n        .catch(() => {});\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  if (!mdStr) {\n    return null;\n  }\n\n  return (\n    <div>\n      <MarkdownPreview\n        source={mdStr}\n        className={styles.markdown}\n        components={{\n          /**\n           * bordered 边框\n           * bgWhite 设置代码预览背景白色，否则为格子背景。\n           * noCode 不显示代码编辑器。\n           * noPreview 不显示代码预览效果。\n           * noScroll 预览区域不显示滚动条。\n           * codePen 显示 Codepen 按钮，要特别注意 包导入的问题，实例中的 import 主要用于 Codepen 使用。\n           */\n          code: ({ inline, node, ...props }) => {\n            const { noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox } = props as any;\n            if (inline) {\n              return <code {...props} />;\n            }\n            const config = {\n              noPreview,\n              bordered,\n              noScroll,\n              bgWhite,\n              noCode,\n              codePen,\n              codeSandbox,\n            } as any;\n            if (Object.keys(config).filter((name) => config[name] !== undefined).length === 0) {\n              return <code {...props} />;\n            }\n            return (\n              <Code\n                version={version}\n                code={getCodeStr(node.children)}\n                dependencies={dependencies}\n                {...{ noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox }}\n              />\n            );\n          },\n        }}\n      />\n      <div className={styles.docinfo}>\n        <Footer path={path} />\n      </div>\n    </div>\n  );\n}\n","import React from 'react';\nimport Markdown from '../../../components/Markdown';\n\nexport default () => (\n  <Markdown\n    path=\"https://github.com/uiwjs/reset-css/blob/master/README.md\"\n    renderPage={async () => {\n      const md = await import('./README.md');\n      return md.default || md;\n    }}\n  />\n);\n"],"names":["webpackEmptyContext","req","e","Error","code","keys","resolve","id","module","exports","Code","version","dependencies","codePen","codeSandbox","other","props","codePenOption","title","includeModule","js","replace","html","css_external","js_external","codeSandboxOption","files","content","name","description","react","uiw","devDependencies","kkt","license","scripts","start","build","test","browserslist","style","marginBottom","path","url","Fragment","href","target","rel","type","getCodeStr","data","forEach","node","value","children","Array","isArray","CreatePage","renderPage","useState","mdStr","setMdStr","pkg","useEffect","then","str","catch","source","className","styles","components","inline","noPreview","bordered","noScroll","bgWhite","noCode","config","Object","filter","undefined","length","Footer","md","default"],"sourceRoot":""}

package/web/static/js/627.7abc7758.chunk.js

@@ -0,0 +1,2 @@
+(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[627],{84934:function(e){function n(e){var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}n.keys=function(){return[]},n.resolve=n,n.id=84934,e.exports=n},86082:function(e,n,t){"use strict";t.d(n,{Z:function(){return j}});var r=t(50189),o=t(53782),i=t(11026),s=t(41473),c=t(89171),d=t(75752),a=t(2642),u=t(69286),l=["version","dependencies","codePen","codeSandbox"];function p(e){var n=e.version,t=e.dependencies,i=e.codePen,s=e.codeSandbox,c=(0,o.Z)(e,l),d=(0,r.Z)({},c);return i&&(d.codePenOption={title:"uiw".concat(n," - demo"),includeModule:["uiw"],js:(d.code||"").replace("_mount_",'document.getElementById("container")'),html:'<div id="container" style="padding: 24px"></div>',css_external:"https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.css"),js_external:"https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js")}),s&&(d.codeSandboxOption={files:{"sandbox.config.json":{content:'{\n            "template": "node",\n            "container": {\n              "startScript": "start",\n              "node": "14"\n            }\n          }'},"public/index.html":{content:'<div id="container"></div>'},"src/index.js":{content:(d.code||"").replace("_mount_",'document.getElementById("container")')},".kktrc.js":{content:'import lessModules from "@kkt/less-modules";\nexport default (conf, env, options) => {\nconf = lessModules(conf, env, options);\nreturn conf;\n};'},"package.json":{content:{name:"uiw-demo",description:"uiw v".concat(n," - demo"),dependencies:{react:"^17.0.2","react-dom":"^17.0.2",uiw:"latest"},devDependencies:{"@kkt/less-modules":"~7.1.1",kkt:"~7.1.5"},license:"MIT",scripts:{start:"kkt start",build:"kkt build",test:"kkt test --env=jsdom"},browserslist:[">0.2%","not dead","not ie <= 11","not op_mini all"]}}}}),(0,u.jsx)(a.Z,(0,r.Z)((0,r.Z)({},d),{},{dependencies:t,style:{marginBottom:0}}))}var h=t(53864);function f(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.path,t=/^http/.test(n||"")?n:"https://github.com/uiwjs/uiw/blob/master/".concat(n);return(0,u.jsxs)(s.Fragment,{children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",t&&(0,u.jsx)("a",{href:t,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,u.jsx)("br",{}),(0,u.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}var m="index_docinfo__3Vx8S",k="index_markdown__hcQCp",x=["inline","node"],b=function e(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return n.forEach((function(n){"text"===n.type?t+=n.value:n.children&&Array.isArray(n.children)&&(t+=e(n.children))})),t};function j(e){var n=e.renderPage,t=e.dependencies,a=e.path,l=(0,s.useState)(""),h=(0,i.Z)(l,2),j=h[0],v=h[1],g=d.i8||"2.0.0";return(0,s.useEffect)((function(){n&&n().then((function(e){v(e)})).catch((function(){}))}),[]),j?(0,u.jsxs)("div",{children:[(0,u.jsx)(c.Z,{source:j,className:k,components:{code:function(e){var n=e.inline,i=e.node,s=(0,o.Z)(e,x),c=s,d=c.noPreview,a=c.bordered,l=c.noScroll,h=c.bgWhite,f=c.noCode,m=c.codePen,k=c.codeSandbox;if(n)return(0,u.jsx)("code",(0,r.Z)({},s));var j={noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k};return 0===Object.keys(j).filter((function(e){return void 0!==j[e]})).length?(0,u.jsx)("code",(0,r.Z)({},s)):(0,u.jsx)(p,{version:g,code:b(i.children),dependencies:t,noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k})}}}),(0,u.jsx)("div",{className:m,children:(0,u.jsx)(f,{path:a})})]}):null}},73255:function(e,n,t){"use strict";t.r(n),t.d(n,{default:function(){return a}});var r=t(27791),o=t(57135),i=t.n(o),s=(t(41473),t(53864)),c=t(86082),d=t(69286);function a(){return(0,d.jsx)(c.Z,{path:"https://github.com/uiwjs/uiw/tree/master/packages/react-notify/README.md",dependencies:{Notify:s.gU,ButtonGroup:s.hE,Button:s.zx},renderPage:(0,r.Z)(i().mark((function e(){var n;return i().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,t.e(745).then(t.bind(t,80745));case 2:return n=e.sent,e.abrupt("return",n.default||n);case 4:case"end":return e.stop()}}),e)})))})}}}]);
+//# sourceMappingURL=627.7abc7758.chunk.js.map

package/web/static/js/627.7abc7758.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/627.7abc7758.chunk.js","mappings":"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","sources":["../../node_modules/@babel/standalone|sync|nonrecursive","components/Markdown/Code.tsx","components/Markdown/Footer.tsx","webpack://website/./src/components/Markdown/index.module.less?6e49","components/Markdown/index.tsx","routes/components/notify/index.tsx"],"sourcesContent":["function webpackEmptyContext(req) {\n\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\te.code = 'MODULE_NOT_FOUND';\n\tthrow e;\n}\nwebpackEmptyContext.keys = function() { return []; };\nwebpackEmptyContext.resolve = webpackEmptyContext;\nwebpackEmptyContext.id = 84934;\nmodule.exports = webpackEmptyContext;","import CodePreview, { CodePreviewProps } from '@uiw/react-code-preview';\n\nexport interface CodeProps extends CodePreviewProps {\n  code: string;\n  version: string;\n  codePen: boolean;\n  codeSandbox?: boolean;\n  dependencies: any;\n}\n\nexport default function Code({ version, dependencies, codePen, codeSandbox, ...other }: CodeProps) {\n  const props: CodePreviewProps = { ...other };\n  if (codePen) {\n    props.codePenOption = {\n      title: `uiw${version} - demo`,\n      includeModule: ['uiw'],\n      js: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n      html: '<div id=\"container\" style=\"padding: 24px\"></div>',\n      css_external: `https://unpkg.com/uiw@${version}/dist/uiw.min.css`,\n      js_external: `https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@${version}/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js`,\n    };\n  }\n  if (codeSandbox) {\n    props.codeSandboxOption = {\n      files: {\n        'sandbox.config.json': {\n          content: `{\n            \"template\": \"node\",\n            \"container\": {\n              \"startScript\": \"start\",\n              \"node\": \"14\"\n            }\n          }`,\n        },\n        'public/index.html': {\n          content: `<div id=\"container\"></div>`,\n        },\n        'src/index.js': {\n          content: (props.code || '').replace('_mount_', 'document.getElementById(\"container\")'),\n        },\n        '.kktrc.js': {\n          content: `import lessModules from \"@kkt/less-modules\";\\nexport default (conf, env, options) => {\\nconf = lessModules(conf, env, options);\\nreturn conf;\\n};`,\n        },\n        'package.json': {\n          content: {\n            name: 'uiw-demo',\n            description: `uiw v${version} - demo`,\n            dependencies: {\n              react: '^17.0.2',\n              'react-dom': '^17.0.2',\n              uiw: 'latest',\n            },\n            devDependencies: {\n              '@kkt/less-modules': '~7.1.1',\n              kkt: '~7.1.5',\n            },\n            license: 'MIT',\n            scripts: {\n              start: 'kkt start',\n              build: 'kkt build',\n              test: 'kkt test --env=jsdom',\n            },\n            browserslist: ['>0.2%', 'not dead', 'not ie <= 11', 'not op_mini all'],\n          },\n        },\n      },\n    };\n  }\n  return <CodePreview {...props} dependencies={dependencies} style={{ marginBottom: 0 }} />;\n}\n","import React, { Fragment } from 'react';\nimport { Divider } from 'uiw';\n\nexport type FooterProps = {\n  path?: string;\n};\n\nexport default function (props: FooterProps = {}) {\n  const { path } = props;\n  const url = /^http/.test(path || '') ? path : `https://github.com/uiwjs/uiw/blob/master/${path}`;\n  return (\n    <Fragment>\n      犯了错误还是想对文件做出贡献？\n      {url && (\n        <a href={url} target=\"_blank\" rel=\"noopener noreferrer\">\n          在Github上编辑本页！\n        </a>\n      )}\n      <br />\n      <a href=\"https://github.com/uiwjs/uiw/issues\" target=\"_blank\" rel=\"noopener noreferrer\">\n        反馈建议\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw/issues/new\">\n        提交bug\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/uiwjs/uiw\">\n        Github\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt\">\n        kkt\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://github.com/kktjs/kkt-ssr\">\n        @kkt/ssr\n      </a>\n      <Divider type=\"vertical\" />\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"http://uiw.gitee.io\">\n        国内镜像\n      </a>\n    </Fragment>\n  );\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"docinfo\":\"index_docinfo__3Vx8S\",\"markdown\":\"index_markdown__hcQCp\"};","import { useEffect, useState } from 'react';\nimport MarkdownPreview from '@uiw/react-markdown-preview';\nimport pkg from 'uiw/package.json';\nimport Code from './Code';\nimport Footer from './Footer';\nimport styles from './index.module.less';\n\nexport type CreatePageProps<T> = {\n  dependencies?: T;\n  path: string;\n  renderPage?: () => Promise<string>;\n};\n\nconst getCodeStr = (data: any[] = [], code: string = '') => {\n  data.forEach((node) => {\n    if (node.type === 'text') {\n      code += node.value;\n    } else if (node.children && Array.isArray(node.children)) {\n      code += getCodeStr(node.children);\n    }\n  });\n  return code;\n};\n\nexport default function CreatePage<T>(props: CreatePageProps<T>) {\n  const { renderPage, dependencies, path } = props;\n  const [mdStr, setMdStr] = useState('');\n\n  const version = pkg.version || '2.0.0';\n  useEffect(() => {\n    if (renderPage) {\n      renderPage()\n        .then((str) => {\n          setMdStr(str);\n        })\n        .catch(() => {});\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  if (!mdStr) {\n    return null;\n  }\n\n  return (\n    <div>\n      <MarkdownPreview\n        source={mdStr}\n        className={styles.markdown}\n        components={{\n          /**\n           * bordered 边框\n           * bgWhite 设置代码预览背景白色，否则为格子背景。\n           * noCode 不显示代码编辑器。\n           * noPreview 不显示代码预览效果。\n           * noScroll 预览区域不显示滚动条。\n           * codePen 显示 Codepen 按钮，要特别注意 包导入的问题，实例中的 import 主要用于 Codepen 使用。\n           */\n          code: ({ inline, node, ...props }) => {\n            const { noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox } = props as any;\n            if (inline) {\n              return <code {...props} />;\n            }\n            const config = {\n              noPreview,\n              bordered,\n              noScroll,\n              bgWhite,\n              noCode,\n              codePen,\n              codeSandbox,\n            } as any;\n            if (Object.keys(config).filter((name) => config[name] !== undefined).length === 0) {\n              return <code {...props} />;\n            }\n            return (\n              <Code\n                version={version}\n                code={getCodeStr(node.children)}\n                dependencies={dependencies}\n                {...{ noPreview, bordered, noScroll, bgWhite, noCode, codePen, codeSandbox }}\n              />\n            );\n          },\n        }}\n      />\n      <div className={styles.docinfo}>\n        <Footer path={path} />\n      </div>\n    </div>\n  );\n}\n","import React from 'react';\nimport { Notify, ButtonGroup, Button } from 'uiw';\nimport Markdown from '../../../components/Markdown';\n\nexport default function Page() {\n  return (\n    <Markdown\n      path=\"https://github.com/uiwjs/uiw/tree/master/packages/react-notify/README.md\"\n      dependencies={{ Notify, ButtonGroup, Button }}\n      renderPage={async () => {\n        const md = await import('uiw/node_modules/@uiw/react-notify/README.md');\n        return md.default || md;\n      }}\n    />\n  );\n}\n"],"names":["webpackEmptyContext","req","e","Error","code","keys","resolve","id","module","exports","Code","version","dependencies","codePen","codeSandbox","other","props","codePenOption","title","includeModule","js","replace","html","css_external","js_external","codeSandboxOption","files","content","name","description","react","uiw","devDependencies","kkt","license","scripts","start","build","test","browserslist","style","marginBottom","path","url","Fragment","href","target","rel","type","getCodeStr","data","forEach","node","value","children","Array","isArray","CreatePage","renderPage","useState","mdStr","setMdStr","pkg","useEffect","then","str","catch","source","className","styles","components","inline","noPreview","bordered","noScroll","bgWhite","noCode","config","Object","filter","undefined","length","Footer","Page","Notify","ButtonGroup","Button","md","default"],"sourceRoot":""}

package/web/static/js/6315.5a722a81.chunk.js

@@ -0,0 +1,2 @@
+(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[6315],{84934:function(e){function n(e){var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}n.keys=function(){return[]},n.resolve=n,n.id=84934,e.exports=n},86082:function(e,n,t){"use strict";t.d(n,{Z:function(){return v}});var r=t(50189),o=t(53782),i=t(11026),c=t(41473),s=t(89171),d=t(75752),a=t(2642),u=t(69286),l=["version","dependencies","codePen","codeSandbox"];function p(e){var n=e.version,t=e.dependencies,i=e.codePen,c=e.codeSandbox,s=(0,o.Z)(e,l),d=(0,r.Z)({},s);return i&&(d.codePenOption={title:"uiw".concat(n," - demo"),includeModule:["uiw"],js:(d.code||"").replace("_mount_",'document.getElementById("container")'),html:'<div id="container" style="padding: 24px"></div>',css_external:"https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.css"),js_external:"https://unpkg.com/react@17.x/umd/react.development.js;https://unpkg.com/react-dom@17.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@".concat(n,"/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js")}),c&&(d.codeSandboxOption={files:{"sandbox.config.json":{content:'{\n            "template": "node",\n            "container": {\n              "startScript": "start",\n              "node": "14"\n            }\n          }'},"public/index.html":{content:'<div id="container"></div>'},"src/index.js":{content:(d.code||"").replace("_mount_",'document.getElementById("container")')},".kktrc.js":{content:'import lessModules from "@kkt/less-modules";\nexport default (conf, env, options) => {\nconf = lessModules(conf, env, options);\nreturn conf;\n};'},"package.json":{content:{name:"uiw-demo",description:"uiw v".concat(n," - demo"),dependencies:{react:"^17.0.2","react-dom":"^17.0.2",uiw:"latest"},devDependencies:{"@kkt/less-modules":"~7.1.1",kkt:"~7.1.5"},license:"MIT",scripts:{start:"kkt start",build:"kkt build",test:"kkt test --env=jsdom"},browserslist:[">0.2%","not dead","not ie <= 11","not op_mini all"]}}}}),(0,u.jsx)(a.Z,(0,r.Z)((0,r.Z)({},d),{},{dependencies:t,style:{marginBottom:0}}))}var h=t(53864);function f(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.path,t=/^http/.test(n||"")?n:"https://github.com/uiwjs/uiw/blob/master/".concat(n);return(0,u.jsxs)(c.Fragment,{children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",t&&(0,u.jsx)("a",{href:t,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,u.jsx)("br",{}),(0,u.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,u.jsx)(h.iz,{type:"vertical"}),(0,u.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}var m="index_docinfo__3Vx8S",k="index_markdown__hcQCp",x=["inline","node"],b=function e(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return n.forEach((function(n){"text"===n.type?t+=n.value:n.children&&Array.isArray(n.children)&&(t+=e(n.children))})),t};function v(e){var n=e.renderPage,t=e.dependencies,a=e.path,l=(0,c.useState)(""),h=(0,i.Z)(l,2),v=h[0],j=h[1],g=d.i8||"2.0.0";return(0,c.useEffect)((function(){n&&n().then((function(e){j(e)})).catch((function(){}))}),[]),v?(0,u.jsxs)("div",{children:[(0,u.jsx)(s.Z,{source:v,className:k,components:{code:function(e){var n=e.inline,i=e.node,c=(0,o.Z)(e,x),s=c,d=s.noPreview,a=s.bordered,l=s.noScroll,h=s.bgWhite,f=s.noCode,m=s.codePen,k=s.codeSandbox;if(n)return(0,u.jsx)("code",(0,r.Z)({},c));var v={noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k};return 0===Object.keys(v).filter((function(e){return void 0!==v[e]})).length?(0,u.jsx)("code",(0,r.Z)({},c)):(0,u.jsx)(p,{version:g,code:b(i.children),dependencies:t,noPreview:d,bordered:a,noScroll:l,bgWhite:h,noCode:f,codePen:m,codeSandbox:k})}}}),(0,u.jsx)("div",{className:m,children:(0,u.jsx)(f,{path:a})})]}):null}},38661:function(e,n,t){"use strict";t.r(n),t.d(n,{default:function(){return a}});var r=t(27791),o=t(57135),i=t.n(o),c=(t(41473),t(53864)),s=t(86082),d=t(69286);function a(){return(0,d.jsx)(s.Z,{path:"https://github.com/uiwjs/uiw/tree/master/packages/react-pin-code/README.md",dependencies:{Divider:c.iz,PinCode:c.ZT,Form:c.l0,Row:c.X2,Col:c.JX,Icon:c.JO,Button:c.zx,Notify:c.gU},renderPage:(0,r.Z)(i().mark((function e(){var n;return i().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,t.e(2679).then(t.bind(t,12679));case 2:return n=e.sent,e.abrupt("return",n.default||n);case 4:case"end":return e.stop()}}),e)})))})}}}]);
+//# sourceMappingURL=6315.5a722a81.chunk.js.map