@kne-components/react-pdf-sign 1.0.5 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/asset-manifest.json +14 -14
- package/build/index.html +1 -1
- package/build/remoteEntry.js +1 -1
- package/build/remoteEntry.js.map +1 -1
- package/build/static/css/{198.1558528e.chunk.css → 198.73626072.chunk.css} +2 -2
- package/build/static/css/198.73626072.chunk.css.map +1 -0
- package/build/static/css/{340.037fb7c5.chunk.css → 340.0b860756.chunk.css} +2 -2
- package/build/static/css/340.0b860756.chunk.css.map +1 -0
- package/build/static/js/{198.3144322c.chunk.js → 198.856650ae.chunk.js} +2 -2
- package/build/static/js/{198.3144322c.chunk.js.map → 198.856650ae.chunk.js.map} +1 -1
- package/build/static/js/{340.d03c4008.chunk.js → 340.6460340a.chunk.js} +2 -2
- package/build/static/js/{340.d03c4008.chunk.js.map → 340.6460340a.chunk.js.map} +1 -1
- package/build/static/js/8.c959d20a.chunk.js +2 -0
- package/build/static/js/8.c959d20a.chunk.js.map +1 -0
- package/build/static/js/{main.d586bc4b.js → main.ee16cee0.js} +2 -2
- package/build/static/js/{main.d586bc4b.js.map → main.ee16cee0.js.map} +1 -1
- package/package.json +1 -1
- package/build/static/css/198.1558528e.chunk.css.map +0 -1
- package/build/static/css/340.037fb7c5.chunk.css.map +0 -1
- package/build/static/js/8.f7e618a6.chunk.js +0 -2
- package/build/static/js/8.f7e618a6.chunk.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"static/js/198.3144322c.chunk.js","mappings":"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","sources":["preset.js","App.js","bootstrap.js","../../README.md"],"sourcesContent":["import React from 'react';\nimport { preset as fetchPreset } from '@kne/react-fetch';\nimport { Spin, Empty, message } from 'antd';\nimport createAjax from '@kne/axios-fetch';\nimport { preset as remoteLoaderPreset } from '@kne/remote-loader';\n\nwindow.PUBLIC_URL = process.env.PUBLIC_URL;\n\n// url: 'https://registry.npmmirror.com',\n// tpl: '{{url}}/@kne-components%2f{{remote}}/{{version}}/files/build',\n\n// url: 'https://cdn.jsdelivr.net', tpl: '{{url}}/npm/@kne-components/{{remote}}@{{version}}/build'\n\nconst registry = {\n url: 'https://uc.fatalent.cn', tpl: '{{url}}/packages/@kne-components/{{remote}}/{{version}}/build'\n};\n\nexport const globalInit = async () => {\n const ajax = createAjax({\n errorHandler: error => message.error(error)\n });\n\n const componentsCoreRemote = {\n ...registry, remote: 'components-core', defaultVersion: '0.4.3'\n };\n\n remoteLoaderPreset({\n remotes: {\n default: componentsCoreRemote, 'components-core': componentsCoreRemote, 'components-iconfont': {\n ...registry, remote: 'components-iconfont', defaultVersion: '0.2.1'\n }, 'react-pdf-sign': process.env.NODE_ENV === 'development' ? {\n remote: 'react-pdf-sign', url: '/', tpl: '{{url}}'\n } : {\n ...registry, remote: 'react-pdf-sign', defaultVersion: process.env.DEFAULT_VERSION\n }\n }\n });\n\n\n fetchPreset({\n ajax, loading: <Spin delay={500}\n style={{\n position: 'absolute',\n left: '50%',\n padding: '10px',\n transform: 'translateX(-50%)'\n }} />, error: null, empty: <Empty />, transformResponse: (response) => {\n const { data } = response;\n response.data = {\n code: data.code === 0 ? 200 : data.code, msg: data.msg, results: data.data\n };\n return response;\n }\n });\n\n return {\n ajax, enums: {}, apis: {}, themeToken: {\n colorPrimary: '#4183F0'\n }\n };\n};\n","import { HashRouter } from \"react-router-dom\";\nimport createEntry from \"@kne/modules-dev/dist/create-entry.modern\";\nimport \"@kne/modules-dev/dist/create-entry.css\";\nimport readme from \"readme\";\n\nconst ExampleRoutes = createEntry.ExampleRoutes;\n\nconst App = ({ globalPreset, ...props }) => {\n return (\n <HashRouter>\n <ExampleRoutes\n {...props}\n paths={[\n {\n key: \"components\",\n path: \"/\",\n title: \"首页\",\n },\n ]}\n preset={globalPreset}\n themeToken={globalPreset.themeToken}\n readme={readme}\n pageProps={{ menu: null }}\n />\n </HashRouter>\n );\n};\n\nexport default App;\n","import { globalInit } from './preset';\nimport React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport App from './App';\n\nconst root = ReactDOM.createRoot(document.getElementById('root'));\n\nconst renderRoot = async (App) => {\n const globalPreset = await globalInit();\n return root.render(<App themeToken={globalPreset.themeToken} globalPreset={globalPreset} />);\n};\n\nrenderRoot(App);\n","import * as component_1 from '@kne/current-lib_react-pdf-sign';\nimport * as component_2 from 'antd';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_5 from './doc/example.pdf';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_7 from './doc/signature.png';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nconst readmeConfig = {\n name: `react-pdf-sign`,\n summary: `<p>这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式。</p>\n<h2>核心特性</h2>\n<p><strong>直观的签名体验</strong> - 提供手写签名画板,用户可以通过鼠标或触摸设备自然地绘制签名,签名支持实时预览和调整。支持在签名画板上叠加自定义内容,如日期、文字等。</p>\n<p><strong>灵活的定位控制</strong> - 签名区域可以在 PDF 页面上自由拖拽、缩放和精确定位,支持保持比例缩放,确保签名的视觉效果。</p>\n<p><strong>完整的 PDF 操作</strong> - 基于 pdf-lib 和 react-pdf,支持多页 PDF 文档的浏览、签名定位和最终签名文件的生成。</p>\n<p><strong>组件化设计</strong> - 提供多个独立组件(PDFSign、PDFViewer、LocationLayer、useSignature),开发者可以根据需求灵活组合使用。支持默认签名位置设置和位置变化回调,便于集成到现有业务流程。</p>\n<p><strong>国际化支持</strong> - 内置中英文语言包,支持多语言切换,适合国际化应用。</p>\n<p><strong>现代化技术栈</strong> - 基于 React 18+,使用 Konva.js 实现高性能的图形渲染,支持响应式设计。</p>\n<h2>使用场景</h2>\n<ul>\n<li>合同签署系统</li>\n<li>文档审批流程</li>\n<li>电子表单签名</li>\n<li>证书颁发系统</li>\n<li>法律文件签署</li>\n</ul>\n<p>该组件库简化了 PDF 签名的复杂实现,开发者只需要几行代码就能集成完整的签名功能,大大提升了开发效率。新增的签名叠加功能让签名更加丰富和个性化,满足各种业务场景需求。</p>`,\n description: `这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式`,\n packageName: `@kne/react-pdf-sign`,\n api: `<h3>PDFSign</h3>\n<p>主要的 PDF 签名组件,集成了 PDF 查看器和签名定位功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片的 URL 地址</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域的宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域的高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>签名区域变换器的内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>签名区域的占位文本</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>生成签名PDF的文件名</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>默认签名位置信息</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>签名位置变化回调函数</td>\n</tr>\n</tbody>\n</table>\n<h4>实例方法</h4>\n<table>\n<thead>\n<tr>\n<th>方法名</th>\n<th>参数</th>\n<th>返回值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>获取当前签名位置信息</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>设置签名位置</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>获取 PDF 签名信息</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>生成签名后的 PDF 文件</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF 文档查看器组件,提供 PDF 页面浏览功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 CSS 类名</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>默认显示的页码</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>最大显示宽度</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 pdf.js CDN 地址</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API 配置对象</td>\n</tr>\n</tbody>\n</table>\n<h4>children 渲染属性</h4>\n<p>当 children 为函数时,会传入以下参数:</p>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>当前页面的尺寸信息</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>当前页码</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>总页数</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>签名定位层组件,用于在 PDF 上定位和调整签名区域。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>画布宽度(必需)</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>画布高度(必需)</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>变换器内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>占位文本</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>受控的位置值</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>位置变化回调</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>签名画板 Hook,提供手写签名功能。</p>\n<h4>返回的函数参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>签名文件名</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>签名画板高度</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>签名画板叠加内容</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>签名完成回调</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal 组件属性</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook 配置参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>默认签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>默认签名画板高度</td>\n</tr>\n</tbody>\n</table>`,\n example: {\n isFull: false,\n className: `react_pdf_sign_e88dd`,\n style: ``,\n list: [{\n title: `完整签名流程`,\n description: `演示PDF上传、手写签名创建和签名PDF生成的完整工作流程`,\n code: `const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n 添加签名\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名PDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `签名定位层`,\n description: `展示独立的签名定位组件,支持拖拽和缩放调整签名位置`,\n code: `const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n}]\n},{\n title: `PDF查看器`,\n description: `基础的PDF文档查看器,支持页面切换和缩放显示`,\n code: `const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n}]\n},{\n title: `PDF签名组件`,\n description: `演示PDF签名组件的API使用,包括位置获取、设置和签名文件生成`,\n code: `const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '签名位置',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n 获取签名位置\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n 设置签名位置\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>恢复到默认位置</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF签名信息',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n 获取PDF签名信息\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名文件\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n},{\n name: \"_signature\",\n packageName: \"./doc/signature.png\",\n component: component_7\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `手写签名画板`,\n description: `展示useSignature Hook的使用,打开手写签名模态框`,\n code: `const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 签名\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 带有日期模版的签名\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n}]\n }\n};\nexport default readmeConfig;\n"],"names":["window","PUBLIC_URL","process","registry","url","tpl","ExampleRoutes","createEntry","_ref","globalPreset","props","_objectWithoutProperties","_excluded","_jsx","HashRouter","children","_objectSpread","paths","key","path","title","preset","themeToken","readme","pageProps","menu","root","ReactDOM","document","getElementById","async","ajax","createAjax","errorHandler","error","message","componentsCoreRemote","remote","defaultVersion","remoteLoaderPreset","remotes","default","fetchPreset","loading","Spin","delay","style","position","left","padding","transform","empty","Empty","transformResponse","response","data","code","msg","results","enums","apis","colorPrimary","globalInit","render","App","renderRoot","name","summary","description","packageName","api","example","isFull","className","list","scope","importStatement","component"],"ignoreList":[],"sourceRoot":""}
|
|
1
|
+
{"version":3,"file":"static/js/198.856650ae.chunk.js","mappings":"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","sources":["preset.js","App.js","bootstrap.js","../../README.md"],"sourcesContent":["import React from 'react';\nimport { preset as fetchPreset } from '@kne/react-fetch';\nimport { Spin, Empty, message } from 'antd';\nimport createAjax from '@kne/axios-fetch';\nimport { preset as remoteLoaderPreset } from '@kne/remote-loader';\n\nwindow.PUBLIC_URL = process.env.PUBLIC_URL;\n\n// url: 'https://registry.npmmirror.com',\n// tpl: '{{url}}/@kne-components%2f{{remote}}/{{version}}/files/build',\n\n// url: 'https://cdn.jsdelivr.net', tpl: '{{url}}/npm/@kne-components/{{remote}}@{{version}}/build'\n\nconst registry = {\n url: 'https://uc.fatalent.cn', tpl: '{{url}}/packages/@kne-components/{{remote}}/{{version}}/build'\n};\n\nexport const globalInit = async () => {\n const ajax = createAjax({\n errorHandler: error => message.error(error)\n });\n\n const componentsCoreRemote = {\n ...registry, remote: 'components-core', defaultVersion: '0.4.3'\n };\n\n remoteLoaderPreset({\n remotes: {\n default: componentsCoreRemote, 'components-core': componentsCoreRemote, 'components-iconfont': {\n ...registry, remote: 'components-iconfont', defaultVersion: '0.2.1'\n }, 'react-pdf-sign': process.env.NODE_ENV === 'development' ? {\n remote: 'react-pdf-sign', url: '/', tpl: '{{url}}'\n } : {\n ...registry, remote: 'react-pdf-sign', defaultVersion: process.env.DEFAULT_VERSION\n }\n }\n });\n\n\n fetchPreset({\n ajax, loading: <Spin delay={500}\n style={{\n position: 'absolute',\n left: '50%',\n padding: '10px',\n transform: 'translateX(-50%)'\n }} />, error: null, empty: <Empty />, transformResponse: (response) => {\n const { data } = response;\n response.data = {\n code: data.code === 0 ? 200 : data.code, msg: data.msg, results: data.data\n };\n return response;\n }\n });\n\n return {\n ajax, enums: {}, apis: {}, themeToken: {\n colorPrimary: '#4183F0'\n }\n };\n};\n","import { HashRouter } from \"react-router-dom\";\nimport createEntry from \"@kne/modules-dev/dist/create-entry.modern\";\nimport \"@kne/modules-dev/dist/create-entry.css\";\nimport readme from \"readme\";\n\nconst ExampleRoutes = createEntry.ExampleRoutes;\n\nconst App = ({ globalPreset, ...props }) => {\n return (\n <HashRouter>\n <ExampleRoutes\n {...props}\n paths={[\n {\n key: \"components\",\n path: \"/\",\n title: \"首页\",\n },\n ]}\n preset={globalPreset}\n themeToken={globalPreset.themeToken}\n readme={readme}\n pageProps={{ menu: null }}\n />\n </HashRouter>\n );\n};\n\nexport default App;\n","import { globalInit } from './preset';\nimport React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport App from './App';\n\nconst root = ReactDOM.createRoot(document.getElementById('root'));\n\nconst renderRoot = async (App) => {\n const globalPreset = await globalInit();\n return root.render(<App themeToken={globalPreset.themeToken} globalPreset={globalPreset} />);\n};\n\nrenderRoot(App);\n","import * as component_1 from '@kne/current-lib_react-pdf-sign';\nimport * as component_2 from 'antd';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_5 from './doc/example.pdf';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_7 from './doc/signature.png';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nconst readmeConfig = {\n name: `react-pdf-sign`,\n summary: `<p>这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式。</p>\n<h2>核心特性</h2>\n<p><strong>直观的签名体验</strong> - 提供手写签名画板,用户可以通过鼠标或触摸设备自然地绘制签名,签名支持实时预览和调整。支持在签名画板上叠加自定义内容,如日期、文字等。</p>\n<p><strong>灵活的定位控制</strong> - 签名区域可以在 PDF 页面上自由拖拽、缩放和精确定位,支持保持比例缩放,确保签名的视觉效果。</p>\n<p><strong>完整的 PDF 操作</strong> - 基于 pdf-lib 和 react-pdf,支持多页 PDF 文档的浏览、签名定位和最终签名文件的生成。</p>\n<p><strong>组件化设计</strong> - 提供多个独立组件(PDFSign、PDFViewer、LocationLayer、useSignature),开发者可以根据需求灵活组合使用。支持默认签名位置设置和位置变化回调,便于集成到现有业务流程。</p>\n<p><strong>国际化支持</strong> - 内置中英文语言包,支持多语言切换,适合国际化应用。</p>\n<p><strong>现代化技术栈</strong> - 基于 React 18+,使用 Konva.js 实现高性能的图形渲染,支持响应式设计。</p>\n<h2>使用场景</h2>\n<ul>\n<li>合同签署系统</li>\n<li>文档审批流程</li>\n<li>电子表单签名</li>\n<li>证书颁发系统</li>\n<li>法律文件签署</li>\n</ul>\n<p>该组件库简化了 PDF 签名的复杂实现,开发者只需要几行代码就能集成完整的签名功能,大大提升了开发效率。新增的签名叠加功能让签名更加丰富和个性化,满足各种业务场景需求。</p>`,\n description: `这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式`,\n packageName: `@kne/react-pdf-sign`,\n api: `<h3>PDFSign</h3>\n<p>主要的 PDF 签名组件,集成了 PDF 查看器和签名定位功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片的 URL 地址</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域的宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域的高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>签名区域变换器的内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>签名区域的占位文本</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>生成签名PDF的文件名</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>默认签名位置信息</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>签名位置变化回调函数</td>\n</tr>\n</tbody>\n</table>\n<h4>实例方法</h4>\n<table>\n<thead>\n<tr>\n<th>方法名</th>\n<th>参数</th>\n<th>返回值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>获取当前签名位置信息</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>设置签名位置</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>获取 PDF 签名信息</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>生成签名后的 PDF 文件</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF 文档查看器组件,提供 PDF 页面浏览功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 CSS 类名</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>默认显示的页码</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>最大显示宽度</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 pdf.js CDN 地址</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API 配置对象</td>\n</tr>\n</tbody>\n</table>\n<h4>children 渲染属性</h4>\n<p>当 children 为函数时,会传入以下参数:</p>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>当前页面的尺寸信息</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>当前页码</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>总页数</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>签名定位层组件,用于在 PDF 上定位和调整签名区域。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>画布宽度(必需)</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>画布高度(必需)</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>变换器内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>占位文本</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>受控的位置值</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>位置变化回调</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>签名画板 Hook,提供手写签名功能。</p>\n<h4>返回的函数参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>签名文件名</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>签名画板高度</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>签名画板叠加内容</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>签名完成回调</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal 组件属性</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook 配置参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>默认签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>默认签名画板高度</td>\n</tr>\n</tbody>\n</table>`,\n example: {\n isFull: false,\n className: `react_pdf_sign_e88dd`,\n style: ``,\n list: [{\n title: `完整签名流程`,\n description: `演示PDF上传、手写签名创建和签名PDF生成的完整工作流程`,\n code: `const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n 添加签名\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名PDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `签名定位层`,\n description: `展示独立的签名定位组件,支持拖拽和缩放调整签名位置`,\n code: `const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n}]\n},{\n title: `PDF查看器`,\n description: `基础的PDF文档查看器,支持页面切换和缩放显示`,\n code: `const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n}]\n},{\n title: `PDF签名组件`,\n description: `演示PDF签名组件的API使用,包括位置获取、设置和签名文件生成`,\n code: `const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '签名位置',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n 获取签名位置\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n 设置签名位置\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>恢复到默认位置</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF签名信息',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n 获取PDF签名信息\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名文件\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n},{\n name: \"_signature\",\n packageName: \"./doc/signature.png\",\n component: component_7\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `手写签名画板`,\n description: `展示useSignature Hook的使用,打开手写签名模态框`,\n code: `const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 签名\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 带有日期模版的签名\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n}]\n }\n};\nexport default readmeConfig;\n"],"names":["window","PUBLIC_URL","process","registry","url","tpl","ExampleRoutes","createEntry","_ref","globalPreset","props","_objectWithoutProperties","_excluded","_jsx","HashRouter","children","_objectSpread","paths","key","path","title","preset","themeToken","readme","pageProps","menu","root","ReactDOM","document","getElementById","async","ajax","createAjax","errorHandler","error","message","componentsCoreRemote","remote","defaultVersion","remoteLoaderPreset","remotes","default","fetchPreset","loading","Spin","delay","style","position","left","padding","transform","empty","Empty","transformResponse","response","data","code","msg","results","enums","apis","colorPrimary","globalInit","render","App","renderRoot","name","summary","description","packageName","api","example","isFull","className","list","scope","importStatement","component"],"ignoreList":[],"sourceRoot":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";(self.webpackChunk_kne_components_react_pdf_sign=self.webpackChunk_kne_components_react_pdf_sign||[]).push([[340],{26784:(n,t,e)=>{e.r(t),e.d(t,{default:()=>c,manifest:()=>s});var d=e(81755),a=e(55199);const r=e.p+"static/media/example.034ae1f30c5fe6d68d26.pdf";var i=e.t(r);const o=e.p+"static/media/signature.841922fcd4ffbb9de231.png";const c={ReactPdfSign:{name:"react-pdf-sign",summary:"<p>\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f\u3002</p>\n<h2>\u6838\u5fc3\u7279\u6027</h2>\n<p><strong>\u76f4\u89c2\u7684\u7b7e\u540d\u4f53\u9a8c</strong> - \u63d0\u4f9b\u624b\u5199\u7b7e\u540d\u753b\u677f\uff0c\u7528\u6237\u53ef\u4ee5\u901a\u8fc7\u9f20\u6807\u6216\u89e6\u6478\u8bbe\u5907\u81ea\u7136\u5730\u7ed8\u5236\u7b7e\u540d\uff0c\u7b7e\u540d\u652f\u6301\u5b9e\u65f6\u9884\u89c8\u548c\u8c03\u6574\u3002\u652f\u6301\u5728\u7b7e\u540d\u753b\u677f\u4e0a\u53e0\u52a0\u81ea\u5b9a\u4e49\u5185\u5bb9\uff0c\u5982\u65e5\u671f\u3001\u6587\u5b57\u7b49\u3002</p>\n<p><strong>\u7075\u6d3b\u7684\u5b9a\u4f4d\u63a7\u5236</strong> - \u7b7e\u540d\u533a\u57df\u53ef\u4ee5\u5728 PDF \u9875\u9762\u4e0a\u81ea\u7531\u62d6\u62fd\u3001\u7f29\u653e\u548c\u7cbe\u786e\u5b9a\u4f4d\uff0c\u652f\u6301\u4fdd\u6301\u6bd4\u4f8b\u7f29\u653e\uff0c\u786e\u4fdd\u7b7e\u540d\u7684\u89c6\u89c9\u6548\u679c\u3002</p>\n<p><strong>\u5b8c\u6574\u7684 PDF \u64cd\u4f5c</strong> - \u57fa\u4e8e pdf-lib \u548c react-pdf\uff0c\u652f\u6301\u591a\u9875 PDF \u6587\u6863\u7684\u6d4f\u89c8\u3001\u7b7e\u540d\u5b9a\u4f4d\u548c\u6700\u7ec8\u7b7e\u540d\u6587\u4ef6\u7684\u751f\u6210\u3002</p>\n<p><strong>\u7ec4\u4ef6\u5316\u8bbe\u8ba1</strong> - \u63d0\u4f9b\u591a\u4e2a\u72ec\u7acb\u7ec4\u4ef6\uff08PDFSign\u3001PDFViewer\u3001LocationLayer\u3001useSignature\uff09\uff0c\u5f00\u53d1\u8005\u53ef\u4ee5\u6839\u636e\u9700\u6c42\u7075\u6d3b\u7ec4\u5408\u4f7f\u7528\u3002\u652f\u6301\u9ed8\u8ba4\u7b7e\u540d\u4f4d\u7f6e\u8bbe\u7f6e\u548c\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03\uff0c\u4fbf\u4e8e\u96c6\u6210\u5230\u73b0\u6709\u4e1a\u52a1\u6d41\u7a0b\u3002</p>\n<p><strong>\u56fd\u9645\u5316\u652f\u6301</strong> - \u5185\u7f6e\u4e2d\u82f1\u6587\u8bed\u8a00\u5305\uff0c\u652f\u6301\u591a\u8bed\u8a00\u5207\u6362\uff0c\u9002\u5408\u56fd\u9645\u5316\u5e94\u7528\u3002</p>\n<p><strong>\u73b0\u4ee3\u5316\u6280\u672f\u6808</strong> - \u57fa\u4e8e React 18+\uff0c\u4f7f\u7528 Konva.js \u5b9e\u73b0\u9ad8\u6027\u80fd\u7684\u56fe\u5f62\u6e32\u67d3\uff0c\u652f\u6301\u54cd\u5e94\u5f0f\u8bbe\u8ba1\u3002</p>\n<h2>\u4f7f\u7528\u573a\u666f</h2>\n<ul>\n<li>\u5408\u540c\u7b7e\u7f72\u7cfb\u7edf</li>\n<li>\u6587\u6863\u5ba1\u6279\u6d41\u7a0b</li>\n<li>\u7535\u5b50\u8868\u5355\u7b7e\u540d</li>\n<li>\u8bc1\u4e66\u9881\u53d1\u7cfb\u7edf</li>\n<li>\u6cd5\u5f8b\u6587\u4ef6\u7b7e\u7f72</li>\n</ul>\n<p>\u8be5\u7ec4\u4ef6\u5e93\u7b80\u5316\u4e86 PDF \u7b7e\u540d\u7684\u590d\u6742\u5b9e\u73b0\uff0c\u5f00\u53d1\u8005\u53ea\u9700\u8981\u51e0\u884c\u4ee3\u7801\u5c31\u80fd\u96c6\u6210\u5b8c\u6574\u7684\u7b7e\u540d\u529f\u80fd\uff0c\u5927\u5927\u63d0\u5347\u4e86\u5f00\u53d1\u6548\u7387\u3002\u65b0\u589e\u7684\u7b7e\u540d\u53e0\u52a0\u529f\u80fd\u8ba9\u7b7e\u540d\u66f4\u52a0\u4e30\u5bcc\u548c\u4e2a\u6027\u5316\uff0c\u6ee1\u8db3\u5404\u79cd\u4e1a\u52a1\u573a\u666f\u9700\u6c42\u3002</p>",description:"\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f",packageName:"@kne/react-pdf-sign",api:"<h3>PDFSign</h3>\n<p>\u4e3b\u8981\u7684 PDF \u7b7e\u540d\u7ec4\u4ef6\uff0c\u96c6\u6210\u4e86 PDF \u67e5\u770b\u5668\u548c\u7b7e\u540d\u5b9a\u4f4d\u529f\u80fd\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF \u6587\u4ef6\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>\u7b7e\u540d\u56fe\u7247\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>\u7b7e\u540d\u533a\u57df\u53d8\u6362\u5668\u7684\u5185\u8fb9\u8ddd</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'\u62d6\u62fd\u5230\u7b7e\u540d\u4f4d\u7f6e'</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u5360\u4f4d\u6587\u672c</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>\u751f\u6210\u7b7e\u540dPDF\u7684\u6587\u4ef6\u540d</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u4f4d\u7f6e\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>\u7b7e\u540d\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03\u51fd\u6570</td>\n</tr>\n</tbody>\n</table>\n<h4>\u5b9e\u4f8b\u65b9\u6cd5</h4>\n<table>\n<thead>\n<tr>\n<th>\u65b9\u6cd5\u540d</th>\n<th>\u53c2\u6570</th>\n<th>\u8fd4\u56de\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>\u83b7\u53d6\u5f53\u524d\u7b7e\u540d\u4f4d\u7f6e\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>\u8bbe\u7f6e\u7b7e\u540d\u4f4d\u7f6e</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>\u83b7\u53d6 PDF \u7b7e\u540d\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>\u751f\u6210\u7b7e\u540d\u540e\u7684 PDF \u6587\u4ef6</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF \u6587\u6863\u67e5\u770b\u5668\u7ec4\u4ef6\uff0c\u63d0\u4f9b PDF \u9875\u9762\u6d4f\u89c8\u529f\u80fd\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF \u6587\u4ef6\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>\u81ea\u5b9a\u4e49 CSS \u7c7b\u540d</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>\u9ed8\u8ba4\u663e\u793a\u7684\u9875\u7801</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>\u6700\u5927\u663e\u793a\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>\u81ea\u5b9a\u4e49 pdf.js CDN \u5730\u5740</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API \u914d\u7f6e\u5bf9\u8c61</td>\n</tr>\n</tbody>\n</table>\n<h4>children \u6e32\u67d3\u5c5e\u6027</h4>\n<p>\u5f53 children \u4e3a\u51fd\u6570\u65f6\uff0c\u4f1a\u4f20\u5165\u4ee5\u4e0b\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>\u5f53\u524d\u9875\u9762\u7684\u5c3a\u5bf8\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>\u5f53\u524d\u9875\u7801</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>\u603b\u9875\u6570</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>\u7b7e\u540d\u5b9a\u4f4d\u5c42\u7ec4\u4ef6\uff0c\u7528\u4e8e\u5728 PDF \u4e0a\u5b9a\u4f4d\u548c\u8c03\u6574\u7b7e\u540d\u533a\u57df\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>\u753b\u5e03\u5bbd\u5ea6\uff08\u5fc5\u9700\uff09</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>\u753b\u5e03\u9ad8\u5ea6\uff08\u5fc5\u9700\uff09</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u533a\u57df\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>\u7b7e\u540d\u533a\u57df\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>\u53d8\u6362\u5668\u5185\u8fb9\u8ddd</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'\u62d6\u62fd\u5230\u7b7e\u540d\u4f4d\u7f6e'</td>\n<td>\u5360\u4f4d\u6587\u672c</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>\u7b7e\u540d\u56fe\u7247 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>\u53d7\u63a7\u7684\u4f4d\u7f6e\u503c</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>\u7b7e\u540d\u753b\u677f Hook\uff0c\u63d0\u4f9b\u624b\u5199\u7b7e\u540d\u529f\u80fd\u3002</p>\n<h4>\u8fd4\u56de\u7684\u51fd\u6570\u53c2\u6570</h4>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>\u7b7e\u540d\u6587\u4ef6\u540d</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u753b\u677f\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>\u7b7e\u540d\u753b\u677f\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>\u7b7e\u540d\u753b\u677f\u53e0\u52a0\u5185\u5bb9</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>\u7b7e\u540d\u5b8c\u6210\u56de\u8c03</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal \u7ec4\u4ef6\u5c5e\u6027</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook \u914d\u7f6e\u53c2\u6570</h4>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u753b\u677f\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u753b\u677f\u9ad8\u5ea6</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"react_pdf_sign_e88dd",style:"",list:[{title:"\u5b8c\u6574\u7b7e\u540d\u6d41\u7a0b",description:"\u6f14\u793aPDF\u4e0a\u4f20\u3001\u624b\u5199\u7b7e\u540d\u521b\u5efa\u548c\u7b7e\u540dPDF\u751f\u6210\u7684\u5b8c\u6574\u5de5\u4f5c\u6d41\u7a0b",code:"const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n \u7b7e\u5b57\u65e5\u671f: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n \u6dfb\u52a0\u7b7e\u540d\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n \u751f\u6210\u7b7e\u540dPDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"antd",packageName:"antd",component:a}]},{title:"\u7b7e\u540d\u5b9a\u4f4d\u5c42",description:"\u5c55\u793a\u72ec\u7acb\u7684\u7b7e\u540d\u5b9a\u4f4d\u7ec4\u4ef6\uff0c\u652f\u6301\u62d6\u62fd\u548c\u7f29\u653e\u8c03\u6574\u7b7e\u540d\u4f4d\u7f6e",code:"const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d}]},{title:"PDF\u67e5\u770b\u5668",description:"\u57fa\u7840\u7684PDF\u6587\u6863\u67e5\u770b\u5668\uff0c\u652f\u6301\u9875\u9762\u5207\u6362\u548c\u7f29\u653e\u663e\u793a",code:"const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"_examplePdf",packageName:"./doc/example.pdf",component:i}]},{title:"PDF\u7b7e\u540d\u7ec4\u4ef6",description:"\u6f14\u793aPDF\u7b7e\u540d\u7ec4\u4ef6\u7684API\u4f7f\u7528\uff0c\u5305\u62ec\u4f4d\u7f6e\u83b7\u53d6\u3001\u8bbe\u7f6e\u548c\u7b7e\u540d\u6587\u4ef6\u751f\u6210",code:"const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '\u7b7e\u540d\u4f4d\u7f6e',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n \u83b7\u53d6\u7b7e\u540d\u4f4d\u7f6e\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n \u8bbe\u7f6e\u7b7e\u540d\u4f4d\u7f6e\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>\u6062\u590d\u5230\u9ed8\u8ba4\u4f4d\u7f6e</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF\u7b7e\u540d\u4fe1\u606f',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n \u83b7\u53d6PDF\u7b7e\u540d\u4fe1\u606f\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n \u751f\u6210\u7b7e\u540d\u6587\u4ef6\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"_examplePdf",packageName:"./doc/example.pdf",component:i},{name:"_signature",packageName:"./doc/signature.png",component:e.t(o)},{name:"antd",packageName:"antd",component:a}]},{title:"\u624b\u5199\u7b7e\u540d\u753b\u677f",description:"\u5c55\u793auseSignature Hook\u7684\u4f7f\u7528\uff0c\u6253\u5f00\u624b\u5199\u7b7e\u540d\u6a21\u6001\u6846",code:"const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n \u7b7e\u540d\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n \u7b7e\u5b57\u65e5\u671f: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n \u5e26\u6709\u65e5\u671f\u6a21\u7248\u7684\u7b7e\u540d\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"antd",packageName:"antd",component:a}]}]}}},s={name:"react-pdf-sign",version:"1.0.5","open-version":!0,"public-url":"/react-pdf-sign",modules:[{name:"react-pdf-sign",baseDir:"/home/runner/work/react-pdf-sign/react-pdf-sign",description:"\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f",packageName:"@kne/react-pdf-sign"}]}}}]);
|
|
2
|
-
//# sourceMappingURL=340.
|
|
1
|
+
"use strict";(self.webpackChunk_kne_components_react_pdf_sign=self.webpackChunk_kne_components_react_pdf_sign||[]).push([[340],{26784:(n,t,e)=>{e.r(t),e.d(t,{default:()=>c,manifest:()=>s});var d=e(81755),a=e(55199);const r=e.p+"static/media/example.034ae1f30c5fe6d68d26.pdf";var i=e.t(r);const o=e.p+"static/media/signature.841922fcd4ffbb9de231.png";const c={ReactPdfSign:{name:"react-pdf-sign",summary:"<p>\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f\u3002</p>\n<h2>\u6838\u5fc3\u7279\u6027</h2>\n<p><strong>\u76f4\u89c2\u7684\u7b7e\u540d\u4f53\u9a8c</strong> - \u63d0\u4f9b\u624b\u5199\u7b7e\u540d\u753b\u677f\uff0c\u7528\u6237\u53ef\u4ee5\u901a\u8fc7\u9f20\u6807\u6216\u89e6\u6478\u8bbe\u5907\u81ea\u7136\u5730\u7ed8\u5236\u7b7e\u540d\uff0c\u7b7e\u540d\u652f\u6301\u5b9e\u65f6\u9884\u89c8\u548c\u8c03\u6574\u3002\u652f\u6301\u5728\u7b7e\u540d\u753b\u677f\u4e0a\u53e0\u52a0\u81ea\u5b9a\u4e49\u5185\u5bb9\uff0c\u5982\u65e5\u671f\u3001\u6587\u5b57\u7b49\u3002</p>\n<p><strong>\u7075\u6d3b\u7684\u5b9a\u4f4d\u63a7\u5236</strong> - \u7b7e\u540d\u533a\u57df\u53ef\u4ee5\u5728 PDF \u9875\u9762\u4e0a\u81ea\u7531\u62d6\u62fd\u3001\u7f29\u653e\u548c\u7cbe\u786e\u5b9a\u4f4d\uff0c\u652f\u6301\u4fdd\u6301\u6bd4\u4f8b\u7f29\u653e\uff0c\u786e\u4fdd\u7b7e\u540d\u7684\u89c6\u89c9\u6548\u679c\u3002</p>\n<p><strong>\u5b8c\u6574\u7684 PDF \u64cd\u4f5c</strong> - \u57fa\u4e8e pdf-lib \u548c react-pdf\uff0c\u652f\u6301\u591a\u9875 PDF \u6587\u6863\u7684\u6d4f\u89c8\u3001\u7b7e\u540d\u5b9a\u4f4d\u548c\u6700\u7ec8\u7b7e\u540d\u6587\u4ef6\u7684\u751f\u6210\u3002</p>\n<p><strong>\u7ec4\u4ef6\u5316\u8bbe\u8ba1</strong> - \u63d0\u4f9b\u591a\u4e2a\u72ec\u7acb\u7ec4\u4ef6\uff08PDFSign\u3001PDFViewer\u3001LocationLayer\u3001useSignature\uff09\uff0c\u5f00\u53d1\u8005\u53ef\u4ee5\u6839\u636e\u9700\u6c42\u7075\u6d3b\u7ec4\u5408\u4f7f\u7528\u3002\u652f\u6301\u9ed8\u8ba4\u7b7e\u540d\u4f4d\u7f6e\u8bbe\u7f6e\u548c\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03\uff0c\u4fbf\u4e8e\u96c6\u6210\u5230\u73b0\u6709\u4e1a\u52a1\u6d41\u7a0b\u3002</p>\n<p><strong>\u56fd\u9645\u5316\u652f\u6301</strong> - \u5185\u7f6e\u4e2d\u82f1\u6587\u8bed\u8a00\u5305\uff0c\u652f\u6301\u591a\u8bed\u8a00\u5207\u6362\uff0c\u9002\u5408\u56fd\u9645\u5316\u5e94\u7528\u3002</p>\n<p><strong>\u73b0\u4ee3\u5316\u6280\u672f\u6808</strong> - \u57fa\u4e8e React 18+\uff0c\u4f7f\u7528 Konva.js \u5b9e\u73b0\u9ad8\u6027\u80fd\u7684\u56fe\u5f62\u6e32\u67d3\uff0c\u652f\u6301\u54cd\u5e94\u5f0f\u8bbe\u8ba1\u3002</p>\n<h2>\u4f7f\u7528\u573a\u666f</h2>\n<ul>\n<li>\u5408\u540c\u7b7e\u7f72\u7cfb\u7edf</li>\n<li>\u6587\u6863\u5ba1\u6279\u6d41\u7a0b</li>\n<li>\u7535\u5b50\u8868\u5355\u7b7e\u540d</li>\n<li>\u8bc1\u4e66\u9881\u53d1\u7cfb\u7edf</li>\n<li>\u6cd5\u5f8b\u6587\u4ef6\u7b7e\u7f72</li>\n</ul>\n<p>\u8be5\u7ec4\u4ef6\u5e93\u7b80\u5316\u4e86 PDF \u7b7e\u540d\u7684\u590d\u6742\u5b9e\u73b0\uff0c\u5f00\u53d1\u8005\u53ea\u9700\u8981\u51e0\u884c\u4ee3\u7801\u5c31\u80fd\u96c6\u6210\u5b8c\u6574\u7684\u7b7e\u540d\u529f\u80fd\uff0c\u5927\u5927\u63d0\u5347\u4e86\u5f00\u53d1\u6548\u7387\u3002\u65b0\u589e\u7684\u7b7e\u540d\u53e0\u52a0\u529f\u80fd\u8ba9\u7b7e\u540d\u66f4\u52a0\u4e30\u5bcc\u548c\u4e2a\u6027\u5316\uff0c\u6ee1\u8db3\u5404\u79cd\u4e1a\u52a1\u573a\u666f\u9700\u6c42\u3002</p>",description:"\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f",packageName:"@kne/react-pdf-sign",api:"<h3>PDFSign</h3>\n<p>\u4e3b\u8981\u7684 PDF \u7b7e\u540d\u7ec4\u4ef6\uff0c\u96c6\u6210\u4e86 PDF \u67e5\u770b\u5668\u548c\u7b7e\u540d\u5b9a\u4f4d\u529f\u80fd\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF \u6587\u4ef6\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>\u7b7e\u540d\u56fe\u7247\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>\u7b7e\u540d\u533a\u57df\u53d8\u6362\u5668\u7684\u5185\u8fb9\u8ddd</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'\u62d6\u62fd\u5230\u7b7e\u540d\u4f4d\u7f6e'</td>\n<td>\u7b7e\u540d\u533a\u57df\u7684\u5360\u4f4d\u6587\u672c</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>\u751f\u6210\u7b7e\u540dPDF\u7684\u6587\u4ef6\u540d</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u4f4d\u7f6e\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>\u7b7e\u540d\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03\u51fd\u6570</td>\n</tr>\n</tbody>\n</table>\n<h4>\u5b9e\u4f8b\u65b9\u6cd5</h4>\n<table>\n<thead>\n<tr>\n<th>\u65b9\u6cd5\u540d</th>\n<th>\u53c2\u6570</th>\n<th>\u8fd4\u56de\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>\u83b7\u53d6\u5f53\u524d\u7b7e\u540d\u4f4d\u7f6e\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>\u8bbe\u7f6e\u7b7e\u540d\u4f4d\u7f6e</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>\u83b7\u53d6 PDF \u7b7e\u540d\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>\u751f\u6210\u7b7e\u540d\u540e\u7684 PDF \u6587\u4ef6</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF \u6587\u6863\u67e5\u770b\u5668\u7ec4\u4ef6\uff0c\u63d0\u4f9b PDF \u9875\u9762\u6d4f\u89c8\u529f\u80fd\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF \u6587\u4ef6\u7684 URL \u5730\u5740</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>\u81ea\u5b9a\u4e49 CSS \u7c7b\u540d</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>\u9ed8\u8ba4\u663e\u793a\u7684\u9875\u7801</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>\u6700\u5927\u663e\u793a\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>\u81ea\u5b9a\u4e49 pdf.js CDN \u5730\u5740</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API \u914d\u7f6e\u5bf9\u8c61</td>\n</tr>\n</tbody>\n</table>\n<h4>children \u6e32\u67d3\u5c5e\u6027</h4>\n<p>\u5f53 children \u4e3a\u51fd\u6570\u65f6\uff0c\u4f1a\u4f20\u5165\u4ee5\u4e0b\u53c2\u6570\uff1a</p>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>\u5f53\u524d\u9875\u9762\u7684\u5c3a\u5bf8\u4fe1\u606f</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>\u5f53\u524d\u9875\u7801</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>\u603b\u9875\u6570</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>\u7b7e\u540d\u5b9a\u4f4d\u5c42\u7ec4\u4ef6\uff0c\u7528\u4e8e\u5728 PDF \u4e0a\u5b9a\u4f4d\u548c\u8c03\u6574\u7b7e\u540d\u533a\u57df\u3002</p>\n<table>\n<thead>\n<tr>\n<th>\u5c5e\u6027</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>\u753b\u5e03\u5bbd\u5ea6\uff08\u5fc5\u9700\uff09</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>\u753b\u5e03\u9ad8\u5ea6\uff08\u5fc5\u9700\uff09</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u533a\u57df\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>\u7b7e\u540d\u533a\u57df\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>\u53d8\u6362\u5668\u5185\u8fb9\u8ddd</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'\u62d6\u62fd\u5230\u7b7e\u540d\u4f4d\u7f6e'</td>\n<td>\u5360\u4f4d\u6587\u672c</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>\u7b7e\u540d\u56fe\u7247 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>\u53d7\u63a7\u7684\u4f4d\u7f6e\u503c</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>\u4f4d\u7f6e\u53d8\u5316\u56de\u8c03</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>\u7b7e\u540d\u753b\u677f Hook\uff0c\u63d0\u4f9b\u624b\u5199\u7b7e\u540d\u529f\u80fd\u3002</p>\n<h4>\u8fd4\u56de\u7684\u51fd\u6570\u53c2\u6570</h4>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>\u7b7e\u540d\u6587\u4ef6\u540d</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u7b7e\u540d\u753b\u677f\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>\u7b7e\u540d\u753b\u677f\u9ad8\u5ea6</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>\u7b7e\u540d\u753b\u677f\u53e0\u52a0\u5185\u5bb9</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>\u7b7e\u540d\u5b8c\u6210\u56de\u8c03</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal \u7ec4\u4ef6\u5c5e\u6027</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook \u914d\u7f6e\u53c2\u6570</h4>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570</th>\n<th>\u7c7b\u578b</th>\n<th>\u9ed8\u8ba4\u503c</th>\n<th>\u8bf4\u660e</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u753b\u677f\u5bbd\u5ea6</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>\u9ed8\u8ba4\u7b7e\u540d\u753b\u677f\u9ad8\u5ea6</td>\n</tr>\n</tbody>\n</table>",example:{isFull:!1,className:"react_pdf_sign_e88dd",style:"",list:[{title:"\u5b8c\u6574\u7b7e\u540d\u6d41\u7a0b",description:"\u6f14\u793aPDF\u4e0a\u4f20\u3001\u624b\u5199\u7b7e\u540d\u521b\u5efa\u548c\u7b7e\u540dPDF\u751f\u6210\u7684\u5b8c\u6574\u5de5\u4f5c\u6d41\u7a0b",code:"const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n \u7b7e\u5b57\u65e5\u671f: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n \u6dfb\u52a0\u7b7e\u540d\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n \u751f\u6210\u7b7e\u540dPDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"antd",packageName:"antd",component:a}]},{title:"\u7b7e\u540d\u5b9a\u4f4d\u5c42",description:"\u5c55\u793a\u72ec\u7acb\u7684\u7b7e\u540d\u5b9a\u4f4d\u7ec4\u4ef6\uff0c\u652f\u6301\u62d6\u62fd\u548c\u7f29\u653e\u8c03\u6574\u7b7e\u540d\u4f4d\u7f6e",code:"const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d}]},{title:"PDF\u67e5\u770b\u5668",description:"\u57fa\u7840\u7684PDF\u6587\u6863\u67e5\u770b\u5668\uff0c\u652f\u6301\u9875\u9762\u5207\u6362\u548c\u7f29\u653e\u663e\u793a",code:"const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"_examplePdf",packageName:"./doc/example.pdf",component:i}]},{title:"PDF\u7b7e\u540d\u7ec4\u4ef6",description:"\u6f14\u793aPDF\u7b7e\u540d\u7ec4\u4ef6\u7684API\u4f7f\u7528\uff0c\u5305\u62ec\u4f4d\u7f6e\u83b7\u53d6\u3001\u8bbe\u7f6e\u548c\u7b7e\u540d\u6587\u4ef6\u751f\u6210",code:"const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '\u7b7e\u540d\u4f4d\u7f6e',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n \u83b7\u53d6\u7b7e\u540d\u4f4d\u7f6e\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n \u8bbe\u7f6e\u7b7e\u540d\u4f4d\u7f6e\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>\u6062\u590d\u5230\u9ed8\u8ba4\u4f4d\u7f6e</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF\u7b7e\u540d\u4fe1\u606f',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n \u83b7\u53d6PDF\u7b7e\u540d\u4fe1\u606f\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n \u751f\u6210\u7b7e\u540d\u6587\u4ef6\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"_examplePdf",packageName:"./doc/example.pdf",component:i},{name:"_signature",packageName:"./doc/signature.png",component:e.t(o)},{name:"antd",packageName:"antd",component:a}]},{title:"\u624b\u5199\u7b7e\u540d\u753b\u677f",description:"\u5c55\u793auseSignature Hook\u7684\u4f7f\u7528\uff0c\u6253\u5f00\u624b\u5199\u7b7e\u540d\u6a21\u6001\u6846",code:"const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n \u7b7e\u540d\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n \u7b7e\u5b57\u65e5\u671f: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n \u5e26\u6709\u65e5\u671f\u6a21\u7248\u7684\u7b7e\u540d\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n",scope:[{name:"_ReactPdfSign",packageName:"@kne/current-lib_react-pdf-sign",importStatement:'import * as _ReactPdfSign from "@kne/react-pdf-sign"',component:d},{name:"antd",packageName:"antd",component:a}]}]}}},s={name:"react-pdf-sign",version:"1.0.6","open-version":!0,"public-url":"/react-pdf-sign",modules:[{name:"react-pdf-sign",baseDir:"/home/runner/work/react-pdf-sign/react-pdf-sign",description:"\u8fd9\u662f\u4e00\u4e2a\u529f\u80fd\u5f3a\u5927\u7684 React PDF \u7b7e\u540d\u7ec4\u4ef6\u5e93\uff0c\u4e13\u4e3a\u9700\u8981\u5728 PDF \u6587\u6863\u4e0a\u6dfb\u52a0\u7535\u5b50\u7b7e\u540d\u7684\u5e94\u7528\u573a\u666f\u800c\u8bbe\u8ba1\u3002\u8be5\u7ec4\u4ef6\u5e93\u63d0\u4f9b\u4e86\u7075\u6d3b\u7684\u7b7e\u540d\u89e3\u51b3\u65b9\u6848\uff0c\u652f\u6301\u5373\u65f6\u7b7e\u540d\u6dfb\u52a0\u548c\u9884\u5b9a\u4e49\u7b7e\u540d\u533a\u57df\u4e24\u79cd\u6a21\u5f0f",packageName:"@kne/react-pdf-sign"}]}}}]);
|
|
2
|
+
//# sourceMappingURL=340.6460340a.chunk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"static/js/340.d03c4008.chunk.js","mappings":"8VASA,MCTgE,GAAgBA,aDS3D,CACjBC,KAAM,iBACNC,QAAS,2qGAiBTC,YAAa,qdACbC,YAAa,sBACbC,IAAK,65MAuULC,QAAS,CACLC,QAAQ,EACRC,UAAW,uBACXC,MAAO,GACPC,KAAM,CAAC,CACXC,MAAO,uCACPR,YAAa,mJACbS,KAAM,siEAiENC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,KAEb,CACEJ,MAAO,iCACPR,YAAa,yJACbS,KAAM,mNAaNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,KAEb,CACEJ,MAAO,wBACPR,YAAa,8HACbS,KAAM,uOAcNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,cACNG,YAAa,oBACbW,UAAW,KAEb,CACEJ,MAAO,8BACPR,YAAa,qKACbS,KAAM,4/EAiFNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,cACNG,YAAa,oBACbW,UAAW,GACb,CACEd,KAAM,aACNG,YAAa,sBACbW,U,QACF,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,KAEb,CACEJ,MAAO,uCACPR,YAAa,8GACbS,KAAM,yzCA+CNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,SCvoBFC,EAAW,CAAC,KAAO,iBAAiB,QAAU,QAAQ,gBAAe,EAAK,aAAa,kBAAkB,QAAU,CAAC,CAAC,KAAO,iBAAiB,QAAU,kDAAkD,YAAc,qdAA8F,YAAc,wB","sources":["../../README.md","../node_modules/readme/modules.js"],"sourcesContent":["import * as component_1 from '@kne/current-lib_react-pdf-sign';\nimport * as component_2 from 'antd';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_5 from './doc/example.pdf';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_7 from './doc/signature.png';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nconst readmeConfig = {\n name: `react-pdf-sign`,\n summary: `<p>这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式。</p>\n<h2>核心特性</h2>\n<p><strong>直观的签名体验</strong> - 提供手写签名画板,用户可以通过鼠标或触摸设备自然地绘制签名,签名支持实时预览和调整。支持在签名画板上叠加自定义内容,如日期、文字等。</p>\n<p><strong>灵活的定位控制</strong> - 签名区域可以在 PDF 页面上自由拖拽、缩放和精确定位,支持保持比例缩放,确保签名的视觉效果。</p>\n<p><strong>完整的 PDF 操作</strong> - 基于 pdf-lib 和 react-pdf,支持多页 PDF 文档的浏览、签名定位和最终签名文件的生成。</p>\n<p><strong>组件化设计</strong> - 提供多个独立组件(PDFSign、PDFViewer、LocationLayer、useSignature),开发者可以根据需求灵活组合使用。支持默认签名位置设置和位置变化回调,便于集成到现有业务流程。</p>\n<p><strong>国际化支持</strong> - 内置中英文语言包,支持多语言切换,适合国际化应用。</p>\n<p><strong>现代化技术栈</strong> - 基于 React 18+,使用 Konva.js 实现高性能的图形渲染,支持响应式设计。</p>\n<h2>使用场景</h2>\n<ul>\n<li>合同签署系统</li>\n<li>文档审批流程</li>\n<li>电子表单签名</li>\n<li>证书颁发系统</li>\n<li>法律文件签署</li>\n</ul>\n<p>该组件库简化了 PDF 签名的复杂实现,开发者只需要几行代码就能集成完整的签名功能,大大提升了开发效率。新增的签名叠加功能让签名更加丰富和个性化,满足各种业务场景需求。</p>`,\n description: `这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式`,\n packageName: `@kne/react-pdf-sign`,\n api: `<h3>PDFSign</h3>\n<p>主要的 PDF 签名组件,集成了 PDF 查看器和签名定位功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片的 URL 地址</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域的宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域的高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>签名区域变换器的内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>签名区域的占位文本</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>生成签名PDF的文件名</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>默认签名位置信息</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>签名位置变化回调函数</td>\n</tr>\n</tbody>\n</table>\n<h4>实例方法</h4>\n<table>\n<thead>\n<tr>\n<th>方法名</th>\n<th>参数</th>\n<th>返回值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>获取当前签名位置信息</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>设置签名位置</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>获取 PDF 签名信息</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>生成签名后的 PDF 文件</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF 文档查看器组件,提供 PDF 页面浏览功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 CSS 类名</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>默认显示的页码</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>最大显示宽度</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 pdf.js CDN 地址</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API 配置对象</td>\n</tr>\n</tbody>\n</table>\n<h4>children 渲染属性</h4>\n<p>当 children 为函数时,会传入以下参数:</p>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>当前页面的尺寸信息</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>当前页码</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>总页数</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>签名定位层组件,用于在 PDF 上定位和调整签名区域。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>画布宽度(必需)</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>画布高度(必需)</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>变换器内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>占位文本</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>受控的位置值</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>位置变化回调</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>签名画板 Hook,提供手写签名功能。</p>\n<h4>返回的函数参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>签名文件名</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>签名画板高度</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>签名画板叠加内容</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>签名完成回调</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal 组件属性</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook 配置参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>默认签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>默认签名画板高度</td>\n</tr>\n</tbody>\n</table>`,\n example: {\n isFull: false,\n className: `react_pdf_sign_e88dd`,\n style: ``,\n list: [{\n title: `完整签名流程`,\n description: `演示PDF上传、手写签名创建和签名PDF生成的完整工作流程`,\n code: `const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n 添加签名\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名PDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `签名定位层`,\n description: `展示独立的签名定位组件,支持拖拽和缩放调整签名位置`,\n code: `const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n}]\n},{\n title: `PDF查看器`,\n description: `基础的PDF文档查看器,支持页面切换和缩放显示`,\n code: `const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n}]\n},{\n title: `PDF签名组件`,\n description: `演示PDF签名组件的API使用,包括位置获取、设置和签名文件生成`,\n code: `const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '签名位置',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n 获取签名位置\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n 设置签名位置\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>恢复到默认位置</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF签名信息',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n 获取PDF签名信息\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名文件\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n},{\n name: \"_signature\",\n packageName: \"./doc/signature.png\",\n component: component_7\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `手写签名画板`,\n description: `展示useSignature Hook的使用,打开手写签名模态框`,\n code: `const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 签名\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 带有日期模版的签名\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n}]\n }\n};\nexport default readmeConfig;\n","import ReactPdfSign from '@components/react-pdf-sign/README.md';export default {ReactPdfSign};\nexport const manifest = {\"name\":\"react-pdf-sign\",\"version\":\"1.0.5\",\"open-version\":true,\"public-url\":\"/react-pdf-sign\",\"modules\":[{\"name\":\"react-pdf-sign\",\"baseDir\":\"/home/runner/work/react-pdf-sign/react-pdf-sign\",\"description\":\"这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式\",\"packageName\":\"@kne/react-pdf-sign\"}]};"],"names":["ReactPdfSign","name","summary","description","packageName","api","example","isFull","className","style","list","title","code","scope","importStatement","component","manifest"],"ignoreList":[],"sourceRoot":""}
|
|
1
|
+
{"version":3,"file":"static/js/340.6460340a.chunk.js","mappings":"8VASA,MCTgE,GAAgBA,aDS3D,CACjBC,KAAM,iBACNC,QAAS,2qGAiBTC,YAAa,qdACbC,YAAa,sBACbC,IAAK,65MAuULC,QAAS,CACLC,QAAQ,EACRC,UAAW,uBACXC,MAAO,GACPC,KAAM,CAAC,CACXC,MAAO,uCACPR,YAAa,mJACbS,KAAM,siEAiENC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,KAEb,CACEJ,MAAO,iCACPR,YAAa,yJACbS,KAAM,mNAaNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,KAEb,CACEJ,MAAO,wBACPR,YAAa,8HACbS,KAAM,uOAcNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,cACNG,YAAa,oBACbW,UAAW,KAEb,CACEJ,MAAO,8BACPR,YAAa,qKACbS,KAAM,4/EAiFNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,cACNG,YAAa,oBACbW,UAAW,GACb,CACEd,KAAM,aACNG,YAAa,sBACbW,U,QACF,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,KAEb,CACEJ,MAAO,uCACPR,YAAa,8GACbS,KAAM,yzCA+CNC,MAAO,CAAC,CACRZ,KAAM,gBACNG,YAAa,kCACbU,gBAAiB,uDACjBC,UAAW,GACb,CACEd,KAAM,OACNG,YAAa,OACbW,UAAW,SCvoBFC,EAAW,CAAC,KAAO,iBAAiB,QAAU,QAAQ,gBAAe,EAAK,aAAa,kBAAkB,QAAU,CAAC,CAAC,KAAO,iBAAiB,QAAU,kDAAkD,YAAc,qdAA8F,YAAc,wB","sources":["../../README.md","../node_modules/readme/modules.js"],"sourcesContent":["import * as component_1 from '@kne/current-lib_react-pdf-sign';\nimport * as component_2 from 'antd';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_5 from './doc/example.pdf';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport * as component_7 from './doc/signature.png';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nimport '@kne/current-lib_react-pdf-sign/dist/index.css';\nconst readmeConfig = {\n name: `react-pdf-sign`,\n summary: `<p>这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式。</p>\n<h2>核心特性</h2>\n<p><strong>直观的签名体验</strong> - 提供手写签名画板,用户可以通过鼠标或触摸设备自然地绘制签名,签名支持实时预览和调整。支持在签名画板上叠加自定义内容,如日期、文字等。</p>\n<p><strong>灵活的定位控制</strong> - 签名区域可以在 PDF 页面上自由拖拽、缩放和精确定位,支持保持比例缩放,确保签名的视觉效果。</p>\n<p><strong>完整的 PDF 操作</strong> - 基于 pdf-lib 和 react-pdf,支持多页 PDF 文档的浏览、签名定位和最终签名文件的生成。</p>\n<p><strong>组件化设计</strong> - 提供多个独立组件(PDFSign、PDFViewer、LocationLayer、useSignature),开发者可以根据需求灵活组合使用。支持默认签名位置设置和位置变化回调,便于集成到现有业务流程。</p>\n<p><strong>国际化支持</strong> - 内置中英文语言包,支持多语言切换,适合国际化应用。</p>\n<p><strong>现代化技术栈</strong> - 基于 React 18+,使用 Konva.js 实现高性能的图形渲染,支持响应式设计。</p>\n<h2>使用场景</h2>\n<ul>\n<li>合同签署系统</li>\n<li>文档审批流程</li>\n<li>电子表单签名</li>\n<li>证书颁发系统</li>\n<li>法律文件签署</li>\n</ul>\n<p>该组件库简化了 PDF 签名的复杂实现,开发者只需要几行代码就能集成完整的签名功能,大大提升了开发效率。新增的签名叠加功能让签名更加丰富和个性化,满足各种业务场景需求。</p>`,\n description: `这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式`,\n packageName: `@kne/react-pdf-sign`,\n api: `<h3>PDFSign</h3>\n<p>主要的 PDF 签名组件,集成了 PDF 查看器和签名定位功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片的 URL 地址</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域的宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域的高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>签名区域变换器的内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>签名区域的占位文本</td>\n</tr>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signed-document.pdf'</td>\n<td>生成签名PDF的文件名</td>\n</tr>\n<tr>\n<td>defaultLocation</td>\n<td>object</td>\n<td>-</td>\n<td>默认签名位置信息</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>签名位置变化回调函数</td>\n</tr>\n</tbody>\n</table>\n<h4>实例方法</h4>\n<table>\n<thead>\n<tr>\n<th>方法名</th>\n<th>参数</th>\n<th>返回值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>getLocation</td>\n<td>-</td>\n<td>object</td>\n<td>获取当前签名位置信息</td>\n</tr>\n<tr>\n<td>setLocation</td>\n<td>location: object</td>\n<td>-</td>\n<td>设置签名位置</td>\n</tr>\n<tr>\n<td>getPdfSignature</td>\n<td>-</td>\n<td>object</td>\n<td>获取 PDF 签名信息</td>\n</tr>\n<tr>\n<td>sign</td>\n<td>-</td>\n<td>Promise<File></td>\n<td>生成签名后的 PDF 文件</td>\n</tr>\n</tbody>\n</table>\n<h3>PDFViewer</h3>\n<p>PDF 文档查看器组件,提供 PDF 页面浏览功能。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>url</td>\n<td>string</td>\n<td>-</td>\n<td>PDF 文件的 URL 地址</td>\n</tr>\n<tr>\n<td>className</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 CSS 类名</td>\n</tr>\n<tr>\n<td>defaultPage</td>\n<td>number</td>\n<td>1</td>\n<td>默认显示的页码</td>\n</tr>\n<tr>\n<td>maxWidth</td>\n<td>number</td>\n<td>1200</td>\n<td>最大显示宽度</td>\n</tr>\n<tr>\n<td>pdfjsUrl</td>\n<td>string</td>\n<td>-</td>\n<td>自定义 pdf.js CDN 地址</td>\n</tr>\n<tr>\n<td>apis</td>\n<td>object</td>\n<td>-</td>\n<td>API 配置对象</td>\n</tr>\n</tbody>\n</table>\n<h4>children 渲染属性</h4>\n<p>当 children 为函数时,会传入以下参数:</p>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>size</td>\n<td>object</td>\n<td>当前页面的尺寸信息</td>\n</tr>\n<tr>\n<td>currentPage</td>\n<td>number</td>\n<td>当前页码</td>\n</tr>\n<tr>\n<td>pageSize</td>\n<td>number</td>\n<td>总页数</td>\n</tr>\n</tbody>\n</table>\n<h3>LocationLayer</h3>\n<p>签名定位层组件,用于在 PDF 上定位和调整签名区域。</p>\n<table>\n<thead>\n<tr>\n<th>属性</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>stageWidth</td>\n<td>number</td>\n<td>-</td>\n<td>画布宽度(必需)</td>\n</tr>\n<tr>\n<td>stageHeight</td>\n<td>number</td>\n<td>-</td>\n<td>画布高度(必需)</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名区域宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>50</td>\n<td>签名区域高度</td>\n</tr>\n<tr>\n<td>padding</td>\n<td>number</td>\n<td>8</td>\n<td>变换器内边距</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td>'拖拽到签名位置'</td>\n<td>占位文本</td>\n</tr>\n<tr>\n<td>signature</td>\n<td>string</td>\n<td>-</td>\n<td>签名图片 URL</td>\n</tr>\n<tr>\n<td>value</td>\n<td>object</td>\n<td>-</td>\n<td>受控的位置值</td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>function</td>\n<td>-</td>\n<td>位置变化回调</td>\n</tr>\n</tbody>\n</table>\n<h3>useSignature</h3>\n<p>签名画板 Hook,提供手写签名功能。</p>\n<h4>返回的函数参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>filename</td>\n<td>string</td>\n<td>'signature.png'</td>\n<td>签名文件名</td>\n</tr>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>签名画板高度</td>\n</tr>\n<tr>\n<td>mask</td>\n<td>ReactNode</td>\n<td>-</td>\n<td>签名画板叠加内容</td>\n</tr>\n<tr>\n<td>onSuccess</td>\n<td>function</td>\n<td>-</td>\n<td>签名完成回调</td>\n</tr>\n<tr>\n<td>modalProps</td>\n<td>object</td>\n<td>-</td>\n<td>Modal 组件属性</td>\n</tr>\n</tbody>\n</table>\n<h4>Hook 配置参数</h4>\n<table>\n<thead>\n<tr>\n<th>参数</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>width</td>\n<td>number</td>\n<td>200</td>\n<td>默认签名画板宽度</td>\n</tr>\n<tr>\n<td>height</td>\n<td>number</td>\n<td>80</td>\n<td>默认签名画板高度</td>\n</tr>\n</tbody>\n</table>`,\n example: {\n isFull: false,\n className: `react_pdf_sign_e88dd`,\n style: ``,\n list: [{\n title: `完整签名流程`,\n description: `演示PDF上传、手写签名创建和签名PDF生成的完整工作流程`,\n code: `const { default: ReactPdfSign, useSignature } = _ReactPdfSign;\nconst { useState, useRef } = React;\nconst { Flex, Button } = antd;\n\nconst BaseExample = () => {\n const [pdfFile, setPdfFile] = useState(null);\n const [sign, setSign] = useState(null);\n const ref = useRef(null);\n const signatureModal = useSignature();\n return (\n <Flex vertical gap={12}>\n <Flex gap={8}>\n <Button>\n <input\n type=\"file\"\n accept=\"application/pdf\"\n onChange={e => {\n const file = e.target.files[0];\n setPdfFile(URL.createObjectURL(file));\n }}\n />\n </Button>\n {pdfFile && (\n <Button\n onClick={() => {\n const { size } = ref.current.getLocation();\n signatureModal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n width: size.width,\n height: size.height,\n onSuccess: file => {\n setSign(URL.createObjectURL(file));\n }\n });\n }}>\n 添加签名\n </Button>\n )}\n {pdfFile && sign && (\n <Button\n onClick={async () => {\n const blob = await ref.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名PDF\n </Button>\n )}\n </Flex>\n {pdfFile ? <ReactPdfSign url={pdfFile} signature={sign} ref={ref} /> : null}\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `签名定位层`,\n description: `展示独立的签名定位组件,支持拖拽和缩放调整签名位置`,\n code: `const { LocationLayer } = _ReactPdfSign;\n\nconst BaseExample = () => {\n return (\n <div>\n <LocationLayer stageWidth={400} stageHeight={300} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n}]\n},{\n title: `PDF查看器`,\n description: `基础的PDF文档查看器,支持页面切换和缩放显示`,\n code: `const { PDFViewer } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\n\nconst BaseExample = () => {\n return (\n <div>\n <PDFViewer url={examplePdf} />\n </div>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n}]\n},{\n title: `PDF签名组件`,\n description: `演示PDF签名组件的API使用,包括位置获取、设置和签名文件生成`,\n code: `const { PDFSign } = _ReactPdfSign;\nconst { default: examplePdf } = _examplePdf;\nconst { default: signature } = _signature;\nconst { useRef } = React;\nconst { Flex, Button, App } = antd;\n\nconst BaseExample = () => {\n const ref = useRef();\n const ref2 = useRef();\n const { modal } = App.useApp();\n return (\n <Flex vertical gap={24}>\n <Flex vertical gap={8}>\n <Flex gap={8}>\n <Button\n onClick={() => {\n const location = ref.current.getLocation();\n modal.info({\n title: '签名位置',\n content: <pre>{JSON.stringify(location, null, 2)}</pre>\n });\n }}>\n 获取签名位置\n </Button>\n <Button\n onClick={() => {\n ref.current.setLocation({\n size: {\n width: 390,\n height: 156,\n x: 163,\n y: 8\n },\n scaleX: 1.95,\n scaleY: 1.95,\n x: 163,\n y: 8\n });\n }}>\n 设置签名位置\n </Button>\n <Button onClick={()=>{\n ref.current.setLocation({});\n }}>恢复到默认位置</Button>\n <Button\n onClick={() => {\n const pdfSignature = ref.current.getPdfSignature();\n modal.info({\n title: 'PDF签名信息',\n content: <pre style={{ 'white-space': 'break-spaces' }}>{JSON.stringify(pdfSignature, null, 2)}</pre>\n });\n }}>\n 获取PDF签名信息\n </Button>\n </Flex>\n <PDFSign url={examplePdf} ref={ref} />\n </Flex>\n <Flex vertical gap={8}>\n <div>\n <Button\n onClick={async () => {\n const blob = await ref2.current.sign();\n const link = document.createElement('a');\n const url = URL.createObjectURL(blob);\n link.href = url;\n link.download = 'signed-document.pdf';\n link.click();\n URL.revokeObjectURL(url);\n }}>\n 生成签名文件\n </Button>\n </div>\n <PDFSign url={examplePdf} signature={signature} ref={ref2} />\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"_examplePdf\",\n packageName: \"./doc/example.pdf\",\n component: component_5\n},{\n name: \"_signature\",\n packageName: \"./doc/signature.png\",\n component: component_7\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n},{\n title: `手写签名画板`,\n description: `展示useSignature Hook的使用,打开手写签名模态框`,\n code: `const { useSignature } = _ReactPdfSign;\nconst { Button, Flex } = antd;\n\nconst { useState } = React;\n\nconst BaseExample = () => {\n const [result, setResult] = useState(null);\n const modal = useSignature();\n return (\n <Flex vertical gap={12}>\n {result && <img src={result} alt=\"result\" style={{ width: '300px' }} />}\n <Flex gap={8}>\n <Button\n onClick={() => {\n modal({\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 签名\n </Button>\n <Button\n onClick={() => {\n modal({\n mask: (\n <Flex justify=\"flex-end\" align=\"flex-end\" style={{ height: '100%', width: '100%', padding: '10px', boxSizing: 'border-box' }}>\n 签字日期: {new Date().toLocaleDateString()}\n </Flex>\n ),\n onSuccess: file => {\n console.log(file);\n setResult(URL.createObjectURL(file));\n }\n });\n }}>\n 带有日期模版的签名\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nrender(<BaseExample />);\n\n`,\n scope: [{\n name: \"_ReactPdfSign\",\n packageName: \"@kne/current-lib_react-pdf-sign\",\n importStatement: \"import * as _ReactPdfSign from \\\"@kne/react-pdf-sign\\\"\",\n component: component_1\n},{\n name: \"antd\",\n packageName: \"antd\",\n component: component_2\n}]\n}]\n }\n};\nexport default readmeConfig;\n","import ReactPdfSign from '@components/react-pdf-sign/README.md';export default {ReactPdfSign};\nexport const manifest = {\"name\":\"react-pdf-sign\",\"version\":\"1.0.6\",\"open-version\":true,\"public-url\":\"/react-pdf-sign\",\"modules\":[{\"name\":\"react-pdf-sign\",\"baseDir\":\"/home/runner/work/react-pdf-sign/react-pdf-sign\",\"description\":\"这是一个功能强大的 React PDF 签名组件库,专为需要在 PDF 文档上添加电子签名的应用场景而设计。该组件库提供了灵活的签名解决方案,支持即时签名添加和预定义签名区域两种模式\",\"packageName\":\"@kne/react-pdf-sign\"}]};"],"names":["ReactPdfSign","name","summary","description","packageName","api","example","isFull","className","style","list","title","code","scope","importStatement","component","manifest"],"ignoreList":[],"sourceRoot":""}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(self.webpackChunk_kne_components_react_pdf_sign=self.webpackChunk_kne_components_react_pdf_sign||[]).push([[8],{59169:e=>{function t(e){return Promise.resolve().then(()=>{var t=new Error("Cannot find module '"+e+"'");throw t.code="MODULE_NOT_FOUND",t})}t.keys=()=>[],t.resolve=t,t.id=59169,e.exports=t},71830:(e,t,n)=>{"use strict";n.r(t),n.d(t,{LocationLayer:()=>E,PDFSign:()=>Ne,PDFViewer:()=>k,default:()=>Ne,signPdfFile:()=>_e,useSignature:()=>We});var r=n(51938),a=n(17402),i=n(2153),o=n(94922),s=n(74946),c=n(50805),l=n(54159),u=n.n(l),d=n(55199),g=n(57622),h=n(59790),f=(n(87821),n(70011),n(89261)),p=n(56075),w=n(48863),m=n(78678),v=n(81537),y=n.n(v),j=n(20274),x=n(90999),b=n(51766),S=n(80359);function P(){return P=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},P.apply(null,arguments)}function C(e,t){if(null==e)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(-1!==t.indexOf(r))continue;n[r]=e[r]}return n}var M={"pdf-view-container":"_RgZXN","pdf-view":"_PAju1","pdf-view-children":"_N11Pj","pdf-view-page-control-left":"_IbVpf","pdf-view-page-control-right":"_IIgqj","pdf-view-page-control-current":"_JW3CT","signature-container":"_6TDb-","signature-canvas":"_2CGF4","signature-modal":"_kWe3k","signature-mask":"_FSvLv"};const O=["numPages"],k=e=>{let{className:t,defaultPage:n,apis:l,pdfjsUrl:p,url:w,maxWidth:m=1200,children:v}=e;var y;const{apis:j}=(0,s.usePreset)(),x=Object.assign({},j,l),b=p||(null==(y=x.file)?void 0:y.pdfjsUrl)||"https://cdn.jsdelivr.net/npm/pdfjs-dist@5.4.296";r.EA.workerSrc=b+"/build/pdf.worker.min.mjs";const S=(0,o.useMemo)(()=>({file:w,options:{standardFontDataUrl:b+"/standard_fonts/",cMapUrl:b+"/cmaps/",cMapPacked:!0}}),[b,w]),[k,_]=(0,o.useState)(m),[A,E]=(0,o.useState)(null),[N,T]=(0,o.useState)(0),[F,L]=(0,o.useState)(n||1),D=(0,c.A)(()=>{D.current&&D.current.clientWidth&&_(Math.min(D.current.clientWidth,m))});return(0,f.jsxs)("div",{ref:D,className:u()(t,M["pdf-view-container"],"pdf-view-container"),style:{maxWidth:m},children:[(0,f.jsx)("div",{className:u()(M["pdf-view"],"pdf-view"),children:(0,f.jsx)(a.A,P({},Object.assign({},S),{loading:(0,f.jsx)(d.Flex,{justify:"center",children:(0,f.jsx)(d.Spin,{})}),onLoadSuccess:e=>{let{numPages:t}=e;C(e,O),T(t),Number.isInteger(n)||L(t)},children:(0,f.jsx)(i.A,{width:k,pageNumber:F,renderTextLayer:!0,onLoadSuccess:e=>{E({width:Math.round(e.width),height:Math.round(e.height),originalWidth:e.originalWidth,originalHeight:e.originalHeight})}})}))}),A&&v&&(0,f.jsx)("div",{className:u()(M["pdf-view-children"],"pdf-view-children"),children:"function"===typeof v?v({size:A,currentPage:F,pageSize:N}):v}),(0,f.jsxs)("div",{className:u()(M["pdf-view-page-control"],"pdf-view-page-control"),children:[F>1&&(0,f.jsx)(g.A,{className:u()(M["pdf-view-page-control-left"],"pdf-view-page-control-left"),onClick:()=>{L(F-1)}}),F<N&&(0,f.jsx)(h.A,{className:u()(M["pdf-view-page-control-right"],"pdf-view-page-control-right"),onClick:()=>{L(F+1)}}),N?(0,f.jsxs)("div",{className:u()(M["pdf-view-page-control-current"],"pdf-view-page-control-current"),children:[F,"/",N]}):null]})]})},_=(0,j.createWithIntlProvider)({defaultLocale:"zh-CN",messages:{"zh-CN":{locationLayerPlaceholder:"\u7b7e\u540d\u533a\u57df",loadingError:"PDF\u5c1a\u672a\u52a0\u8f7d\u6210\u529f\uff0c\u8bf7\u7a0d\u540e\u91cd\u8bd5",signatureDefaultTitle:"\u7b7e\u540d",signatureConfirmText:"\u786e\u8ba4",signatureCancelText:"\u53d6\u6d88",signatureCleanText:"\u6e05\u7a7a",signatureEmptyError:"\u7b7e\u540d\u5185\u5bb9\u4e0d\u80fd\u4e3a\u7a7a",signatureSuccess:"\u7b7e\u540d\u6210\u529f"},"en-US":{locationLayerPlaceholder:"Signature Area",loadingError:"PDF is not loaded successfully, please try again later",signatureDefaultTitle:"Signature",signatureConfirmText:"Confirm",signatureCancelText:"Cancel",signatureCleanText:"Clean",signatureEmptyError:"Signature content cannot be empty",signatureSuccess:"Signature Success"}},namespace:"react-pdf-sign"}),A=["width","height","padding","stageWidth","stageHeight","placeholder","signature"],E=_(e=>{const{formatMessage:t}=(0,j.useIntl)(),{width:n=200,height:r=80,padding:a=8,stageWidth:i,stageHeight:s,placeholder:c=t({id:"locationLayerPlaceholder"}),signature:l}=e,u=C(e,A),[d,g]=(0,w.A)(u),[h,v]=(0,o.useState)(!1),[x]=y()(l),b=(0,o.useRef)(),S=(0,o.useRef)(),P=(0,o.useRef)(),M=()=>{const e=S.current.absolutePosition(),t=S.current.getClientRect();g({size:{width:Math.round(t.width),height:Math.round(t.height),x:Math.round(e.x),y:Math.round(e.y)},scaleX:Number(b.current.attrs.scaleX.toFixed(2)),scaleY:Number(b.current.attrs.scaleY.toFixed(2)),x:Math.round(b.current.attrs.x),y:Math.round(b.current.attrs.y)})},O=(0,m.A)(()=>{["scaleX","scaleY","x","y","size"].some(e=>!Object.assign({},d).hasOwnProperty(e))&&g({scaleX:1,scaleY:1,x:Math.round((i-n)/2),y:Math.round((s-r)/2),size:{width:n,height:r,x:Math.round((i-n)/2),y:Math.round((s-r)/2)}}),v(!0)}),k=(0,o.useMemo)(()=>{const e=document.createElement("div");e.style.color="var(--primary-color)",document.body.appendChild(e);const t=window.getComputedStyle(e).color;return document.body.removeChild(e),t},[]);return(0,o.useEffect)(()=>{O()},[]),(0,o.useEffect)(()=>{h&&P.current.nodes([b.current])},[h]),h&&d?(0,f.jsx)(p.BI,{width:i,height:s,children:(0,f.jsxs)(p.Wd,{children:[(0,f.jsxs)(p.YJ,{x:d.x,y:d.y,draggable:!0,ref:b,onDragEnd:M,scaleX:d.scaleX,scaleY:d.scaleY,onTransformEnd:M,children:[x?(0,f.jsx)(p._V,{width:n,height:r,image:x,cornerRadius:8,ref:S}):(0,f.jsx)(p.rw,{width:n,height:r,fill:"#f0f0f0",cornerRadius:8,ref:S}),(0,f.jsx)(p.EY,{text:x?"":c,fontSize:16,fill:"#666666",fontFamily:"Arial",align:"center",verticalAlign:"middle",width:n,height:r})]}),(0,f.jsx)(p.Ge,{ref:P,keepRatio:!0,flipEnabled:!1,rotateEnabled:!1,borderStroke:k,rotateAnchorStroke:k,anchorStroke:k,padding:a})]})}):null});var N="undefined"!==typeof globalThis?globalThis:"undefined"!==typeof window?window:"undefined"!==typeof n.g?n.g:"undefined"!==typeof self?self:{};function T(e){var t={exports:{}};return e(t,t.exports),t.exports}var F="object"==typeof N&&N&&N.Object===Object&&N,L="object"==typeof self&&self&&self.Object===Object&&self,D=F||L||Function("return this")(),W=D.Symbol,z=Object.prototype,I=z.hasOwnProperty,R=z.toString,U=W?W.toStringTag:void 0;var H=function(e){var t=I.call(e,U),n=e[U];try{e[U]=void 0;var r=!0}catch(i){}var a=R.call(e);return r&&(t?e[U]=n:delete e[U]),a},B=Object.prototype.toString;var Y=function(e){return B.call(e)},X=W?W.toStringTag:void 0;var $=function(e){return null==e?void 0===e?"[object Undefined]":"[object Null]":X&&X in Object(e)?H(e):Y(e)};var V=function(e){var t=typeof e;return null!=e&&("object"==t||"function"==t)};var q=function(e){if(!V(e))return!1;var t=$(e);return"[object Function]"==t||"[object GeneratorFunction]"==t||"[object AsyncFunction]"==t||"[object Proxy]"==t},G=D["__core-js_shared__"],J=function(){var e=/[^.]+$/.exec(G&&G.keys&&G.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""}();var Z=function(e){return!!J&&J in e},K=Function.prototype.toString;var Q=function(e){if(null!=e){try{return K.call(e)}catch(t){}try{return e+""}catch(t){}}return""},ee=/^\[object .+?Constructor\]$/,te=Function.prototype,ne=Object.prototype,re=te.toString,ae=ne.hasOwnProperty,ie=RegExp("^"+re.call(ae).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");var oe=function(e){return!(!V(e)||Z(e))&&(q(e)?ie:ee).test(Q(e))};var se=function(e,t){return null==e?void 0:e[t]};var ce=function(e,t){var n=se(e,t);return oe(n)?n:void 0},le=ce(D,"Map");ce(Object,"create");var ue=function(e){return null!=e&&"object"==typeof e};var de=function(e){return ue(e)&&"[object Arguments]"==$(e)},ge=Object.prototype;ge.hasOwnProperty,ge.propertyIsEnumerable;de(function(){return arguments}());var he=function(){return!1};T(function(e,t){var n=t&&!t.nodeType&&t,r=n&&e&&!e.nodeType&&e,a=r&&r.exports===n?D.Buffer:void 0,i=(a?a.isBuffer:void 0)||he;e.exports=i}),T(function(e,t){var n=t&&!t.nodeType&&t,r=n&&e&&!e.nodeType&&e,a=r&&r.exports===n&&F.process,i=function(){try{var e=r&&r.require&&r.require("util").types;return e||a&&a.binding&&a.binding("util")}catch(t){}}();e.exports=i});var fe=ce(D,"DataView"),pe=ce(D,"Promise"),we=ce(D,"Set"),me=ce(D,"WeakMap"),ve="[object Map]",ye="[object Promise]",je="[object Set]",xe="[object WeakMap]",be="[object DataView]",Se=Q(fe),Pe=Q(le),Ce=Q(pe),Me=Q(we),Oe=Q(me),ke=$;(fe&&ke(new fe(new ArrayBuffer(1)))!=be||le&&ke(new le)!=ve||pe&&ke(pe.resolve())!=ye||we&&ke(new we)!=je||me&&ke(new me)!=xe)&&(ke=function(e){var t=$(e),n="[object Object]"==t?e.constructor:void 0,r=n?Q(n):"";if(r)switch(r){case Se:return be;case Pe:return ve;case Ce:return ye;case Me:return je;case Oe:return xe}return t});const _e=async e=>{const{x:t,y:n,page:r,width:a,height:i,signature:o,url:s,filename:c}=e,l=await window.fetch(s),u=await l.arrayBuffer(),d=await x.PDFDocument.load(u),g=d.getPage(r-1),h=await window.fetch(o).then(e=>e.arrayBuffer()),f=await d.embedPng(h);g.drawImage(f,{x:t,y:n,width:a,height:i});const p=await d.save();return new window.File([p],c,{type:"application/pdf"})},Ae=["placeholder","signature","url","width","height","padding","filename","defaultLocation","onChange"],Ee=(0,o.forwardRef)((e,t)=>{let{size:n,currentPage:r,placeholder:a,signature:i,url:s,width:c=200,height:l=80,padding:u,filename:d="signed-document.pdf",defaultLocation:g,onChange:h}=e;const p=(0,o.useMemo)(()=>({scaleX:1,scaleY:1,x:Math.round((n.width-c)/2),y:Math.round((n.height-l)/2),size:{width:c,height:l,x:Math.round((n.width-c)/2),y:Math.round((n.height-l)/2)}}),[n,c,l]),[w,v]=(0,o.useState)(Object.assign({},p,g)),y=(0,m.A)(e=>{v(Object.assign({},p,e))}),j=(0,o.useMemo)(()=>{const e=n.width/n.originalWidth,t=n.height/n.originalHeight,a=Math.round(w.size.x/e),o=Math.round(n.originalHeight-w.size.y/t),c=Math.round(w.size.width/e),l=Math.round(w.size.height/t);return{x:a,y:o-l,page:r,pageWidth:Math.round(n.originalWidth),pageHeight:Math.round(n.originalHeight),width:c,height:l,signature:i,url:s,filename:d}},[w,i,s,d,n,r]),x=(0,o.useCallback)(async()=>await _e(j),[j]);(0,o.useImperativeHandle)(t,()=>({getLocation:()=>w,setLocation:e=>y(e),getPdfSignature:()=>j,sign:()=>x()}));const b=(0,m.A)(h);return(0,o.useEffect)(()=>{null==b||b({pdfSignature:j,location:w})},[j,w,b]),(0,f.jsx)(E,{stageWidth:n.width,stageHeight:n.height,width:c,height:l,padding:u,placeholder:a,signature:i,value:w,onChange:y})}),Ne=_((0,o.forwardRef)((e,t)=>{let{placeholder:n,signature:r,url:a,width:i,height:o,padding:s,filename:c="signed-document.pdf",defaultLocation:l,onChange:u}=e,d=C(e,Ae);return(0,f.jsx)(k,P({},d,{url:a,children:e=>{let{size:d,currentPage:g}=e;return(0,f.jsx)(Ee,{ref:t,size:d,currentPage:g,url:a,filename:c,defaultLocation:l,width:i,height:o,padding:s,placeholder:n,signature:r,onChange:u})}}))})),Te=["filename","onSuccess","width","height","mask"],Fe=e=>{let t=e.split(","),n=t[1].substring(0,t[1].length-2),r=t[0].match(/:(.*?);/)[1],a=atob(n),i=a.length,o=new Uint8Array(i);for(;i--;)o[i]=a.charCodeAt(i);return new Blob([o],{type:r})},Le=_(e=>{let{onClose:t,onSuccess:n,filename:r,width:a,height:i,mask:s=null}=e;const{formatMessage:c}=(0,j.useIntl)(),{message:l}=d.App.useApp(),g=(0,o.useRef)(null),h=(0,o.useRef)(null),[p,w]=(0,o.useState)(!1);return(0,f.jsxs)(d.Flex,{vertical:!0,gap:12,className:u()(M["signature-modal-content"],"signature-modal-content"),children:[(0,f.jsxs)("div",{className:u()(M["signature-container"],"signature-container"),style:{width:"100%",height:"".concat(Math.round(368*i/a),"px")},children:[(0,f.jsx)("div",{className:u()(M["signature-mask"],"signature-mask"),ref:h,children:s}),(0,f.jsx)(b.A,{ref:g,canvasProps:{className:u()(M["signature-canvas"],"signature-canvas")}})]}),(0,f.jsxs)(d.Flex,{justify:"flex-end",align:"center",gap:10,children:[(0,f.jsx)(d.Button,{onClick:()=>{g.current.clear()},children:c({id:"signatureCleanText"})}),(0,f.jsx)(d.Button,{loading:p,type:"primary",onClick:async()=>{w(!0);try{if(g.current.isEmpty())return void l.error(c({id:"signatureEmptyError"}));let e=g.current.toDataURL("image/png");if(s){const t=await S.ph.toPng(h.current,{scale:2}),n=document.createElement("canvas");n.width=2*a,n.height=2*i;const r=n.getContext("2d");r.drawImage(t,0,0,n.width,n.height);const o=new Image;o.src=e,await new Promise(e=>{o.onload=e}),r.drawImage(o,0,0,n.width,n.height),e=n.toDataURL("image/png")}const o=new window.File([Fe(e)],r,{type:"image/png"}),u=n&&await n(o);if(w(!1),!1===u)return;t()}catch(e){l.error(e.message),w(!1)}},children:c({id:"signatureConfirmText"})})]})]})}),De=_(()=>{const{formatMessage:e}=(0,j.useIntl)();return(0,f.jsx)("span",{children:e({id:"signatureDefaultTitle"})})}),We=()=>{const{modal:e}=d.App.useApp();return t=>{const n=Object.assign({},t),{filename:r="signature.png",onSuccess:a,width:i=200,height:o=80,mask:s}=n,c=C(n,Te),l=e.info(Object.assign({},{title:(0,f.jsx)(De,{}),icon:null,footer:null,closable:!0,wrapClassName:M["signature-modal"],classNames:{content:M["signature-modal"]}},c,{content:(0,f.jsx)(Le,{width:i,height:o,mask:s,filename:r,onSuccess:a,onClose:()=>{l.destroy()}})}));return l}}}}]);
|
|
2
|
+
//# sourceMappingURL=8.c959d20a.chunk.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"static/js/8.c959d20a.chunk.js","mappings":"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","sources":["../../node_modules/pdfjs-dist/build|lazy|referencedExports: [[\"WorkerMessageHandler\"]]|groupOptions: {}|strict namespace object","../../src/PDFViewer/index.js","../../src/withLocale.js","../../src/locale/zh-CN.js","../../src/locale/en-US.js","../../src/LocationLayer/index.js","../../node_modules/lodash/_freeGlobal.js","../../node_modules/lodash/_root.js","../../node_modules/lodash/_Symbol.js","../../node_modules/lodash/_getRawTag.js","../../node_modules/lodash/_objectToString.js","../../node_modules/lodash/_baseGetTag.js","../../node_modules/lodash/isObject.js","../../node_modules/lodash/isFunction.js","../../node_modules/lodash/_coreJsData.js","../../node_modules/lodash/_isMasked.js","../../node_modules/lodash/_toSource.js","../../node_modules/lodash/_baseIsNative.js","../../node_modules/lodash/_getValue.js","../../node_modules/lodash/_getNative.js","../../node_modules/lodash/_Map.js","../../node_modules/lodash/_nativeCreate.js","../../node_modules/lodash/isObjectLike.js","../../node_modules/lodash/_baseIsArguments.js","../../node_modules/lodash/isArguments.js","../../node_modules/lodash/stubFalse.js","../../node_modules/lodash/isBuffer.js","../../node_modules/lodash/_nodeUtil.js","../../node_modules/lodash/_DataView.js","../../node_modules/lodash/_Promise.js","../../node_modules/lodash/_Set.js","../../node_modules/lodash/_WeakMap.js","../../node_modules/lodash/_getTag.js","../../src/signPdfFile.js","../../src/PDFSign.js","../../src/useSignature.js"],"sourcesContent":["function webpackEmptyAsyncContext(req) {\n\t// Here Promise.resolve().then() is used instead of new Promise() to prevent\n\t// uncaught exception popping up in devtools\n\treturn Promise.resolve().then(() => {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t});\n}\nwebpackEmptyAsyncContext.keys = () => ([]);\nwebpackEmptyAsyncContext.resolve = webpackEmptyAsyncContext;\nwebpackEmptyAsyncContext.id = 59169;\nmodule.exports = webpackEmptyAsyncContext;","import { Document, Page, pdfjs } from 'react-pdf';\nimport { useMemo, useState } from 'react';\nimport { usePreset } from '@kne/global-context';\nimport useResize from '@kne/use-resize';\nimport classnames from 'classnames';\nimport { Spin, Flex } from 'antd';\nimport { LeftOutlined, RightOutlined } from '@ant-design/icons';\nimport style from '../style.module.scss';\nimport 'react-pdf/dist/Page/TextLayer.css';\nimport 'react-pdf/dist/Page/AnnotationLayer.css';\n\nconst PDFViewer = ({ className, defaultPage, apis: propsApis, pdfjsUrl: pdfjsUrlProps, url, maxWidth = 1200, children }) => {\n const { apis: baseApis } = usePreset();\n const apis = Object.assign({}, baseApis, propsApis);\n const pdfjsUrl = pdfjsUrlProps || apis.file?.pdfjsUrl || 'https://cdn.jsdelivr.net/npm/pdfjs-dist@5.4.296';\n pdfjs.GlobalWorkerOptions.workerSrc = pdfjsUrl + '/build/pdf.worker.min.mjs';\n const documentProps = useMemo(() => {\n return {\n file: url,\n options: {\n standardFontDataUrl: pdfjsUrl + '/standard_fonts/',\n cMapUrl: pdfjsUrl + '/cmaps/',\n cMapPacked: true\n }\n };\n }, [pdfjsUrl, url]);\n const [width, setWidth] = useState(maxWidth);\n const [size, setSize] = useState(null);\n const [pageSize, setPageSize] = useState(0);\n const [currentPage, setCurrentPage] = useState(defaultPage || 1);\n const ref = useResize(() => {\n if (ref.current && ref.current.clientWidth) {\n setWidth(Math.min(ref.current.clientWidth, maxWidth));\n }\n });\n return (\n <div\n ref={ref}\n className={classnames(className, style['pdf-view-container'], 'pdf-view-container')}\n style={{\n maxWidth: maxWidth\n }}\n >\n <div className={classnames(style['pdf-view'], 'pdf-view')}>\n <Document\n {...Object.assign({}, documentProps)}\n loading={\n <Flex justify=\"center\">\n <Spin />\n </Flex>\n }\n onLoadSuccess={({ numPages, ...props }) => {\n setPageSize(numPages);\n if (!Number.isInteger(defaultPage)) {\n setCurrentPage(numPages);\n }\n }}\n >\n <Page\n width={width}\n pageNumber={currentPage}\n renderTextLayer={true}\n onLoadSuccess={page => {\n setSize({ width: Math.round(page.width), height: Math.round(page.height), originalWidth: page.originalWidth, originalHeight: page.originalHeight });\n }}\n />\n </Document>\n </div>\n {size && children && <div className={classnames(style['pdf-view-children'], 'pdf-view-children')}>{typeof children === 'function' ? children({ size, currentPage, pageSize }) : children}</div>}\n <div className={classnames(style['pdf-view-page-control'], 'pdf-view-page-control')}>\n {currentPage > 1 && (\n <LeftOutlined\n className={classnames(style['pdf-view-page-control-left'], 'pdf-view-page-control-left')}\n onClick={() => {\n setCurrentPage(currentPage - 1);\n }}\n />\n )}\n {currentPage < pageSize && (\n <RightOutlined\n className={classnames(style['pdf-view-page-control-right'], 'pdf-view-page-control-right')}\n onClick={() => {\n setCurrentPage(currentPage + 1);\n }}\n />\n )}\n {pageSize ? (\n <div className={classnames(style['pdf-view-page-control-current'], 'pdf-view-page-control-current')}>\n {currentPage}/{pageSize}\n </div>\n ) : null}\n </div>\n </div>\n );\n};\n\nexport default PDFViewer;\n","import { createWithIntlProvider } from '@kne/react-intl';\nimport zhCN from './locale/zh-CN';\nimport enUS from './locale/en-US';\n\nconst withLocale = createWithIntlProvider({\n defaultLocale: 'zh-CN',\n messages: {\n 'zh-CN': zhCN,\n 'en-US': enUS\n },\n namespace: 'react-pdf-sign'\n});\n\nexport default withLocale;\n","const locale = {\n locationLayerPlaceholder: '签名区域',\n loadingError: 'PDF尚未加载成功,请稍后重试',\n signatureDefaultTitle: '签名',\n signatureConfirmText: '确认',\n signatureCancelText: '取消',\n signatureCleanText: '清空',\n signatureEmptyError: '签名内容不能为空',\n signatureSuccess: '签名成功'\n};\n\nexport default locale;\n","const locale = {\n locationLayerPlaceholder: 'Signature Area',\n loadingError: 'PDF is not loaded successfully, please try again later',\n signatureDefaultTitle: 'Signature',\n signatureConfirmText: 'Confirm',\n signatureCancelText: 'Cancel',\n signatureCleanText: 'Clean',\n signatureEmptyError: 'Signature content cannot be empty',\n signatureSuccess: 'Signature Success'\n};\n\nexport default locale;\n","import { Stage, Layer, Text, Transformer, Rect, Group, Image } from 'react-konva';\nimport { useRef, useEffect, useMemo, useState } from 'react';\nimport useControlValue from '@kne/use-control-value';\nimport useRefCallback from '@kne/use-ref-callback';\nimport useImage from 'use-image';\nimport withLocale from '../withLocale';\nimport { useIntl } from '@kne/react-intl';\n\nconst LocationLayer = withLocale(p => {\n const { formatMessage } = useIntl();\n const { width = 200, height = 80, padding = 8, stageWidth, stageHeight, placeholder = formatMessage({ id: 'locationLayerPlaceholder' }), signature, ...props } = p;\n const [value, setValue] = useControlValue(props);\n const [isInit, setIsInit] = useState(false);\n const [signatureImage] = useImage(signature);\n const groupRef = useRef();\n const signRef = useRef();\n const transformerRef = useRef();\n const computedSignLocation = () => {\n const absolutePosition = signRef.current.absolutePosition();\n const size = signRef.current.getClientRect();\n setValue({\n size: {\n width: Math.round(size.width),\n height: Math.round(size.height),\n x: Math.round(absolutePosition.x),\n y: Math.round(absolutePosition.y)\n },\n scaleX: Number(groupRef.current.attrs.scaleX.toFixed(2)),\n scaleY: Number(groupRef.current.attrs.scaleY.toFixed(2)),\n x: Math.round(groupRef.current.attrs.x),\n y: Math.round(groupRef.current.attrs.y)\n });\n };\n\n const initValue = useRefCallback(() => {\n if (['scaleX', 'scaleY', 'x', 'y', 'size'].some(name => !Object.assign({}, value).hasOwnProperty(name))) {\n setValue({\n scaleX: 1,\n scaleY: 1,\n x: Math.round((stageWidth - width) / 2),\n y: Math.round((stageHeight - height) / 2),\n size: {\n width,\n height,\n x: Math.round((stageWidth - width) / 2),\n y: Math.round((stageHeight - height) / 2)\n }\n });\n }\n setIsInit(true);\n });\n\n const themeColor = useMemo(() => {\n const el = document.createElement('div');\n el.style.color = 'var(--primary-color)';\n document.body.appendChild(el);\n const color = window.getComputedStyle(el).color;\n document.body.removeChild(el);\n return color;\n }, []);\n\n useEffect(() => {\n initValue();\n }, []);\n\n useEffect(() => {\n if (isInit) {\n transformerRef.current.nodes([groupRef.current]);\n }\n }, [isInit]);\n if (!(isInit && value)) {\n return null;\n }\n\n return (\n <Stage width={stageWidth} height={stageHeight}>\n <Layer>\n <Group x={value.x} y={value.y} draggable ref={groupRef} onDragEnd={computedSignLocation} scaleX={value.scaleX} scaleY={value.scaleY} onTransformEnd={computedSignLocation}>\n {signatureImage ? <Image width={width} height={height} image={signatureImage} cornerRadius={8} ref={signRef} /> : <Rect width={width} height={height} fill=\"#f0f0f0\" cornerRadius={8} ref={signRef} />}\n <Text text={signatureImage ? '' : placeholder} fontSize={16} fill=\"#666666\" fontFamily=\"Arial\" align=\"center\" verticalAlign=\"middle\" width={width} height={height} />\n </Group>\n <Transformer ref={transformerRef} keepRatio={true} flipEnabled={false} rotateEnabled={false} borderStroke={themeColor} rotateAnchorStroke={themeColor} anchorStroke={themeColor} padding={padding} />\n </Layer>\n </Stage>\n );\n});\n\nexport default LocationLayer;\n","/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\nmodule.exports = freeGlobal;\n","var freeGlobal = require('./_freeGlobal');\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\nmodule.exports = root;\n","var root = require('./_root');\n\n/** Built-in value references. */\nvar Symbol = root.Symbol;\n\nmodule.exports = Symbol;\n","var Symbol = require('./_Symbol');\n\n/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString = objectProto.toString;\n\n/** Built-in value references. */\nvar symToStringTag = Symbol ? Symbol.toStringTag : undefined;\n\n/**\n * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the raw `toStringTag`.\n */\nfunction getRawTag(value) {\n var isOwn = hasOwnProperty.call(value, symToStringTag),\n tag = value[symToStringTag];\n\n try {\n value[symToStringTag] = undefined;\n var unmasked = true;\n } catch (e) {}\n\n var result = nativeObjectToString.call(value);\n if (unmasked) {\n if (isOwn) {\n value[symToStringTag] = tag;\n } else {\n delete value[symToStringTag];\n }\n }\n return result;\n}\n\nmodule.exports = getRawTag;\n","/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString = objectProto.toString;\n\n/**\n * Converts `value` to a string using `Object.prototype.toString`.\n *\n * @private\n * @param {*} value The value to convert.\n * @returns {string} Returns the converted string.\n */\nfunction objectToString(value) {\n return nativeObjectToString.call(value);\n}\n\nmodule.exports = objectToString;\n","var Symbol = require('./_Symbol'),\n getRawTag = require('./_getRawTag'),\n objectToString = require('./_objectToString');\n\n/** `Object#toString` result references. */\nvar nullTag = '[object Null]',\n undefinedTag = '[object Undefined]';\n\n/** Built-in value references. */\nvar symToStringTag = Symbol ? Symbol.toStringTag : undefined;\n\n/**\n * The base implementation of `getTag` without fallbacks for buggy environments.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the `toStringTag`.\n */\nfunction baseGetTag(value) {\n if (value == null) {\n return value === undefined ? undefinedTag : nullTag;\n }\n return (symToStringTag && symToStringTag in Object(value))\n ? getRawTag(value)\n : objectToString(value);\n}\n\nmodule.exports = baseGetTag;\n","/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n var type = typeof value;\n return value != null && (type == 'object' || type == 'function');\n}\n\nmodule.exports = isObject;\n","var baseGetTag = require('./_baseGetTag'),\n isObject = require('./isObject');\n\n/** `Object#toString` result references. */\nvar asyncTag = '[object AsyncFunction]',\n funcTag = '[object Function]',\n genTag = '[object GeneratorFunction]',\n proxyTag = '[object Proxy]';\n\n/**\n * Checks if `value` is classified as a `Function` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a function, else `false`.\n * @example\n *\n * _.isFunction(_);\n * // => true\n *\n * _.isFunction(/abc/);\n * // => false\n */\nfunction isFunction(value) {\n if (!isObject(value)) {\n return false;\n }\n // The use of `Object#toString` avoids issues with the `typeof` operator\n // in Safari 9 which returns 'object' for typed arrays and other constructors.\n var tag = baseGetTag(value);\n return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;\n}\n\nmodule.exports = isFunction;\n","var root = require('./_root');\n\n/** Used to detect overreaching core-js shims. */\nvar coreJsData = root['__core-js_shared__'];\n\nmodule.exports = coreJsData;\n","var coreJsData = require('./_coreJsData');\n\n/** Used to detect methods masquerading as native. */\nvar maskSrcKey = (function() {\n var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');\n return uid ? ('Symbol(src)_1.' + uid) : '';\n}());\n\n/**\n * Checks if `func` has its source masked.\n *\n * @private\n * @param {Function} func The function to check.\n * @returns {boolean} Returns `true` if `func` is masked, else `false`.\n */\nfunction isMasked(func) {\n return !!maskSrcKey && (maskSrcKey in func);\n}\n\nmodule.exports = isMasked;\n","/** Used for built-in method references. */\nvar funcProto = Function.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/**\n * Converts `func` to its source code.\n *\n * @private\n * @param {Function} func The function to convert.\n * @returns {string} Returns the source code.\n */\nfunction toSource(func) {\n if (func != null) {\n try {\n return funcToString.call(func);\n } catch (e) {}\n try {\n return (func + '');\n } catch (e) {}\n }\n return '';\n}\n\nmodule.exports = toSource;\n","var isFunction = require('./isFunction'),\n isMasked = require('./_isMasked'),\n isObject = require('./isObject'),\n toSource = require('./_toSource');\n\n/**\n * Used to match `RegExp`\n * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).\n */\nvar reRegExpChar = /[\\\\^$.*+?()[\\]{}|]/g;\n\n/** Used to detect host constructors (Safari). */\nvar reIsHostCtor = /^\\[object .+?Constructor\\]$/;\n\n/** Used for built-in method references. */\nvar funcProto = Function.prototype,\n objectProto = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Used to detect if a method is native. */\nvar reIsNative = RegExp('^' +\n funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\\\$&')\n .replace(/hasOwnProperty|(function).*?(?=\\\\\\()| for .+?(?=\\\\\\])/g, '$1.*?') + '$'\n);\n\n/**\n * The base implementation of `_.isNative` without bad shim checks.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a native function,\n * else `false`.\n */\nfunction baseIsNative(value) {\n if (!isObject(value) || isMasked(value)) {\n return false;\n }\n var pattern = isFunction(value) ? reIsNative : reIsHostCtor;\n return pattern.test(toSource(value));\n}\n\nmodule.exports = baseIsNative;\n","/**\n * Gets the value at `key` of `object`.\n *\n * @private\n * @param {Object} [object] The object to query.\n * @param {string} key The key of the property to get.\n * @returns {*} Returns the property value.\n */\nfunction getValue(object, key) {\n return object == null ? undefined : object[key];\n}\n\nmodule.exports = getValue;\n","var baseIsNative = require('./_baseIsNative'),\n getValue = require('./_getValue');\n\n/**\n * Gets the native function at `key` of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {string} key The key of the method to get.\n * @returns {*} Returns the function if it's native, else `undefined`.\n */\nfunction getNative(object, key) {\n var value = getValue(object, key);\n return baseIsNative(value) ? value : undefined;\n}\n\nmodule.exports = getNative;\n","var getNative = require('./_getNative'),\n root = require('./_root');\n\n/* Built-in method references that are verified to be native. */\nvar Map = getNative(root, 'Map');\n\nmodule.exports = Map;\n","var getNative = require('./_getNative');\n\n/* Built-in method references that are verified to be native. */\nvar nativeCreate = getNative(Object, 'create');\n\nmodule.exports = nativeCreate;\n","/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n return value != null && typeof value == 'object';\n}\n\nmodule.exports = isObjectLike;\n","var baseGetTag = require('./_baseGetTag'),\n isObjectLike = require('./isObjectLike');\n\n/** `Object#toString` result references. */\nvar argsTag = '[object Arguments]';\n\n/**\n * The base implementation of `_.isArguments`.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n */\nfunction baseIsArguments(value) {\n return isObjectLike(value) && baseGetTag(value) == argsTag;\n}\n\nmodule.exports = baseIsArguments;\n","var baseIsArguments = require('./_baseIsArguments'),\n isObjectLike = require('./isObjectLike');\n\n/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Built-in value references. */\nvar propertyIsEnumerable = objectProto.propertyIsEnumerable;\n\n/**\n * Checks if `value` is likely an `arguments` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n * else `false`.\n * @example\n *\n * _.isArguments(function() { return arguments; }());\n * // => true\n *\n * _.isArguments([1, 2, 3]);\n * // => false\n */\nvar isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {\n return isObjectLike(value) && hasOwnProperty.call(value, 'callee') &&\n !propertyIsEnumerable.call(value, 'callee');\n};\n\nmodule.exports = isArguments;\n","/**\n * This method returns `false`.\n *\n * @static\n * @memberOf _\n * @since 4.13.0\n * @category Util\n * @returns {boolean} Returns `false`.\n * @example\n *\n * _.times(2, _.stubFalse);\n * // => [false, false]\n */\nfunction stubFalse() {\n return false;\n}\n\nmodule.exports = stubFalse;\n","var root = require('./_root'),\n stubFalse = require('./stubFalse');\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Built-in value references. */\nvar Buffer = moduleExports ? root.Buffer : undefined;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined;\n\n/**\n * Checks if `value` is a buffer.\n *\n * @static\n * @memberOf _\n * @since 4.3.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.\n * @example\n *\n * _.isBuffer(new Buffer(2));\n * // => true\n *\n * _.isBuffer(new Uint8Array(2));\n * // => false\n */\nvar isBuffer = nativeIsBuffer || stubFalse;\n\nmodule.exports = isBuffer;\n","var freeGlobal = require('./_freeGlobal');\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Detect free variable `process` from Node.js. */\nvar freeProcess = moduleExports && freeGlobal.process;\n\n/** Used to access faster Node.js helpers. */\nvar nodeUtil = (function() {\n try {\n // Use `util.types` for Node.js 10+.\n var types = freeModule && freeModule.require && freeModule.require('util').types;\n\n if (types) {\n return types;\n }\n\n // Legacy `process.binding('util')` for Node.js < 10.\n return freeProcess && freeProcess.binding && freeProcess.binding('util');\n } catch (e) {}\n}());\n\nmodule.exports = nodeUtil;\n","var getNative = require('./_getNative'),\n root = require('./_root');\n\n/* Built-in method references that are verified to be native. */\nvar DataView = getNative(root, 'DataView');\n\nmodule.exports = DataView;\n","var getNative = require('./_getNative'),\n root = require('./_root');\n\n/* Built-in method references that are verified to be native. */\nvar Promise = getNative(root, 'Promise');\n\nmodule.exports = Promise;\n","var getNative = require('./_getNative'),\n root = require('./_root');\n\n/* Built-in method references that are verified to be native. */\nvar Set = getNative(root, 'Set');\n\nmodule.exports = Set;\n","var getNative = require('./_getNative'),\n root = require('./_root');\n\n/* Built-in method references that are verified to be native. */\nvar WeakMap = getNative(root, 'WeakMap');\n\nmodule.exports = WeakMap;\n","var DataView = require('./_DataView'),\n Map = require('./_Map'),\n Promise = require('./_Promise'),\n Set = require('./_Set'),\n WeakMap = require('./_WeakMap'),\n baseGetTag = require('./_baseGetTag'),\n toSource = require('./_toSource');\n\n/** `Object#toString` result references. */\nvar mapTag = '[object Map]',\n objectTag = '[object Object]',\n promiseTag = '[object Promise]',\n setTag = '[object Set]',\n weakMapTag = '[object WeakMap]';\n\nvar dataViewTag = '[object DataView]';\n\n/** Used to detect maps, sets, and weakmaps. */\nvar dataViewCtorString = toSource(DataView),\n mapCtorString = toSource(Map),\n promiseCtorString = toSource(Promise),\n setCtorString = toSource(Set),\n weakMapCtorString = toSource(WeakMap);\n\n/**\n * Gets the `toStringTag` of `value`.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the `toStringTag`.\n */\nvar getTag = baseGetTag;\n\n// Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6.\nif ((DataView && getTag(new DataView(new ArrayBuffer(1))) != dataViewTag) ||\n (Map && getTag(new Map) != mapTag) ||\n (Promise && getTag(Promise.resolve()) != promiseTag) ||\n (Set && getTag(new Set) != setTag) ||\n (WeakMap && getTag(new WeakMap) != weakMapTag)) {\n getTag = function(value) {\n var result = baseGetTag(value),\n Ctor = result == objectTag ? value.constructor : undefined,\n ctorString = Ctor ? toSource(Ctor) : '';\n\n if (ctorString) {\n switch (ctorString) {\n case dataViewCtorString: return dataViewTag;\n case mapCtorString: return mapTag;\n case promiseCtorString: return promiseTag;\n case setCtorString: return setTag;\n case weakMapCtorString: return weakMapTag;\n }\n }\n return result;\n };\n}\n\nmodule.exports = getTag;\n","import { PDFDocument } from 'pdf-lib';\n\nconst signPdfFile = async pdfSignature => {\n const { x, y, page, width, height, signature, url, filename } = pdfSignature;\n const response = await window.fetch(url);\n const pdfBytes = await response.arrayBuffer();\n const pdfDoc = await PDFDocument.load(pdfBytes);\n const pdfPage = pdfDoc.getPage(page - 1);\n\n const signatureBytes = await window.fetch(signature).then(res => res.arrayBuffer());\n const signatureImageEmbed = await pdfDoc.embedPng(signatureBytes);\n\n pdfPage.drawImage(signatureImageEmbed, {\n x,\n y,\n width,\n height\n });\n\n const modifiedPdfBytes = await pdfDoc.save();\n return new window.File([modifiedPdfBytes], filename, { type: 'application/pdf' });\n};\n\nexport default signPdfFile;\n","import PDFViewer from './PDFViewer';\nimport LocationLayer from './LocationLayer';\nimport { useState, forwardRef, useImperativeHandle, useMemo, useCallback, useEffect } from 'react';\nimport isEqual from 'lodash/isEqual';\nimport { useIntl } from '@kne/react-intl';\nimport withLocale from './withLocale';\nimport useRefCallback from '@kne/use-ref-callback';\nimport signPdfFile from './signPdfFile';\n\nconst PDFSignInner = forwardRef(({ size, currentPage, placeholder, signature, url, width = 200, height = 80, padding, filename = 'signed-document.pdf', defaultLocation, onChange }, ref) => {\n const initLocation = useMemo(() => {\n return {\n scaleX: 1,\n scaleY: 1,\n x: Math.round((size.width - width) / 2),\n y: Math.round((size.height - height) / 2),\n size: {\n width,\n height,\n x: Math.round((size.width - width) / 2),\n y: Math.round((size.height - height) / 2)\n }\n };\n }, [size, width, height]);\n const [location, setLocationOrigin] = useState(Object.assign({}, initLocation, defaultLocation));\n const setLocation = useRefCallback(value => {\n setLocationOrigin(Object.assign({}, initLocation, value));\n });\n const pdfSignature = useMemo(() => {\n const scaleX = size.width / size.originalWidth;\n const scaleY = size.height / size.originalHeight;\n const pdfX = Math.round(location.size.x / scaleX);\n const pdfY = Math.round(size.originalHeight - location.size.y / scaleY);\n const signWidth = Math.round(location.size.width / scaleX);\n const signHeight = Math.round(location.size.height / scaleY);\n\n return {\n x: pdfX,\n y: pdfY - signHeight,\n page: currentPage,\n pageWidth: Math.round(size.originalWidth),\n pageHeight: Math.round(size.originalHeight),\n width: signWidth,\n height: signHeight,\n signature,\n url,\n filename\n };\n }, [location, signature, url, filename, size, currentPage]);\n const signPdf = useCallback(async () => {\n return await signPdfFile(pdfSignature);\n }, [pdfSignature]);\n\n useImperativeHandle(ref, () => ({\n getLocation: () => location,\n setLocation: value => setLocation(value),\n getPdfSignature: () => pdfSignature,\n sign: () => signPdf()\n }));\n\n const handlerChange = useRefCallback(onChange);\n\n useEffect(() => {\n handlerChange?.({ pdfSignature, location });\n }, [pdfSignature, location, handlerChange]);\n\n return <LocationLayer stageWidth={size.width} stageHeight={size.height} width={width} height={height} padding={padding} placeholder={placeholder} signature={signature} value={location} onChange={setLocation} />;\n});\n\nconst PDFSign = withLocale(\n forwardRef(({ placeholder, signature, url, width, height, padding, filename = 'signed-document.pdf', defaultLocation, onChange, ...props }, ref) => {\n return (\n <PDFViewer {...props} url={url}>\n {({ size, currentPage }) => {\n return (\n <PDFSignInner\n ref={ref}\n size={size}\n currentPage={currentPage}\n url={url}\n filename={filename}\n defaultLocation={defaultLocation}\n width={width}\n height={height}\n padding={padding}\n placeholder={placeholder}\n signature={signature}\n onChange={onChange}\n />\n );\n }}\n </PDFViewer>\n );\n })\n);\n\nexport default PDFSign;\n","import SignatureCanvas from 'react-signature-canvas';\nimport { App, Button, Flex } from 'antd';\nimport classnames from 'classnames';\nimport { useRef, useState } from 'react';\nimport withLocale from './withLocale';\nimport { useIntl } from '@kne/react-intl';\nimport { snapdom } from '@zumer/snapdom';\nimport style from './style.module.scss';\n\nconst dataURLtoBlob = dataURL => {\n let arr = dataURL.split(',');\n // 注意base64的最后面中括号和引号是不转译的\n let _arr = arr[1].substring(0, arr[1].length - 2);\n let mime = arr[0].match(/:(.*?);/)[1],\n bstr = atob(_arr),\n n = bstr.length,\n u8arr = new Uint8Array(n);\n while (n--) {\n u8arr[n] = bstr.charCodeAt(n);\n }\n return new Blob([u8arr], {\n type: mime\n });\n};\n\nconst Signature = withLocale(({ onClose, onSuccess, filename, width, height, mask = null }) => {\n const { formatMessage } = useIntl();\n const { message } = App.useApp();\n const signatureCanvasRef = useRef(null);\n const maskRef = useRef(null);\n const [loading, setLoading] = useState(false);\n return (\n <Flex vertical gap={12} className={classnames(style['signature-modal-content'], 'signature-modal-content')}>\n <div\n className={classnames(style['signature-container'], 'signature-container')}\n style={{\n width: '100%',\n height: `${Math.round((height * 368) / width)}px`\n }}\n >\n <div className={classnames(style['signature-mask'], 'signature-mask')} ref={maskRef}>\n {mask}\n </div>\n <SignatureCanvas ref={signatureCanvasRef} canvasProps={{ className: classnames(style['signature-canvas'], 'signature-canvas') }} />\n </div>\n <Flex justify=\"flex-end\" align=\"center\" gap={10}>\n <Button\n onClick={() => {\n signatureCanvasRef.current.clear();\n }}\n >\n {formatMessage({ id: 'signatureCleanText' })}\n </Button>\n <Button\n loading={loading}\n type=\"primary\"\n onClick={async () => {\n setLoading(true);\n try {\n if (signatureCanvasRef.current.isEmpty()) {\n message.error(formatMessage({ id: 'signatureEmptyError' }));\n return;\n }\n\n let result = signatureCanvasRef.current.toDataURL('image/png');\n\n if (mask) {\n const maskPng = await snapdom.toPng(maskRef.current, {\n scale: 2\n });\n const canvas = document.createElement('canvas');\n canvas.width = width * 2;\n canvas.height = height * 2;\n const ctx = canvas.getContext('2d');\n ctx.drawImage(maskPng, 0, 0, canvas.width, canvas.height);\n const resultImage = new Image();\n resultImage.src = result;\n await new Promise(resolve => {\n resultImage.onload = resolve;\n });\n ctx.drawImage(resultImage, 0, 0, canvas.width, canvas.height);\n result = canvas.toDataURL('image/png');\n }\n\n const file = new window.File([dataURLtoBlob(result)], filename, { type: 'image/png' });\n\n const successResult = onSuccess && (await onSuccess(file));\n setLoading(false);\n if (successResult === false) {\n return;\n }\n onClose();\n } catch (e) {\n message.error(e.message);\n setLoading(false);\n }\n }}\n >\n {formatMessage({ id: 'signatureConfirmText' })}\n </Button>\n </Flex>\n </Flex>\n );\n});\n\nconst Title = withLocale(() => {\n const { formatMessage } = useIntl();\n return <span>{formatMessage({ id: 'signatureDefaultTitle' })}</span>;\n});\n\nconst useSignature = () => {\n const { modal } = App.useApp();\n return props => {\n const { filename = 'signature.png', onSuccess, width = 200, height = 80, mask, ...modalProps } = Object.assign({}, props);\n const modalApi = modal.info(\n Object.assign(\n {},\n {\n title: <Title />,\n icon: null,\n footer: null,\n closable: true,\n wrapClassName: style['signature-modal'],\n classNames: {\n content: style['signature-modal']\n }\n },\n modalProps,\n {\n content: (\n <Signature\n width={width}\n height={height}\n mask={mask}\n filename={filename}\n onSuccess={onSuccess}\n onClose={() => {\n modalApi.destroy();\n }}\n />\n )\n }\n )\n );\n\n return modalApi;\n };\n};\n\nexport default useSignature;\n"],"names":["webpackEmptyAsyncContext","req","Promise","resolve","then","e","Error","code","keys","id","module","exports","PDFViewer","_ref2","className","defaultPage","apis","propsApis","pdfjsUrl","pdfjsUrlProps","url","maxWidth","_maxWidth","children","_apis$file","baseApis","usePreset","Object","assign","file","pdfjs","workerSrc","documentProps","useMemo","options","standardFontDataUrl","cMapUrl","cMapPacked","width","setWidth","useState","size","setSize","pageSize","setPageSize","currentPage","setCurrentPage","ref","useResize","current","clientWidth","Math","min","jsxs","classnames","style","jsx","Document","_extends","loading","Flex","justify","Spin","onLoadSuccess","_ref","numPages","_objectWithoutPropertiesLoose","_excluded$3","Number","isInteger","Page","pageNumber","renderTextLayer","page","round","height","originalWidth","originalHeight","LeftOutlined","onClick","RightOutlined","withLocale","createWithIntlProvider","defaultLocale","messages","locationLayerPlaceholder","loadingError","signatureDefaultTitle","signatureConfirmText","signatureCancelText","signatureCleanText","signatureEmptyError","signatureSuccess","namespace","LocationLayer","p","formatMessage","useIntl","padding","stageWidth","stageHeight","placeholder","signature","props","_excluded$2","value","setValue","useControlValue","isInit","setIsInit","signatureImage","useImage","groupRef","useRef","signRef","transformerRef","computedSignLocation","absolutePosition","getClientRect","x","y","scaleX","attrs","toFixed","scaleY","initValue","useRefCallback","some","name","hasOwnProperty","themeColor","el","document","createElement","color","body","appendChild","window","getComputedStyle","removeChild","useEffect","nodes","Stage","Layer","Group","draggable","onDragEnd","onTransformEnd","Image$1","image","cornerRadius","Rect","fill","Text","text","fontSize","fontFamily","align","verticalAlign","Transformer","keepRatio","flipEnabled","rotateEnabled","borderStroke","rotateAnchorStroke","anchorStroke","_freeGlobal","commonjsGlobal","freeSelf","self","_root","Function","_Symbol","Symbol","objectProto$3","prototype","hasOwnProperty$2","nativeObjectToString$1","toString","symToStringTag$1","toStringTag","undefined","_getRawTag","isOwn","call","tag","unmasked","result","nativeObjectToString","_objectToString","symToStringTag","_baseGetTag","isObject_1","type","isFunction_1","_coreJsData","maskSrcKey","uid","exec","IE_PROTO","_isMasked","func","funcToString$1","_toSource","reIsHostCtor","funcProto","objectProto$1","funcToString","hasOwnProperty$1","reIsNative","RegExp","replace","_baseIsNative","test","_getValue","object","key","_getNative","_Map","isObjectLike_1","_baseIsArguments","objectProto","propertyIsEnumerable","arguments","stubFalse_1","freeExports","nodeType","freeModule","Buffer","isBuffer","freeProcess","process","nodeUtil","types","require","binding","_DataView","_Promise","_Set","_WeakMap","mapTag","promiseTag","setTag","weakMapTag","dataViewTag","dataViewCtorString","mapCtorString","promiseCtorString","setCtorString","weakMapCtorString","getTag","ArrayBuffer","Ctor","constructor","ctorString","signPdfFile","async","filename","pdfSignature","response","fetch","pdfBytes","arrayBuffer","pdfDoc","PDFDocument","load","pdfPage","getPage","signatureBytes","res","signatureImageEmbed","embedPng","drawImage","modifiedPdfBytes","save","File","PDFSignInner","forwardRef","_ref3","_width","_height","_filename","defaultLocation","onChange","initLocation","location","setLocationOrigin","setLocation","pdfX","pdfY","signWidth","signHeight","pageWidth","pageHeight","signPdf","useCallback","useImperativeHandle","getLocation","getPdfSignature","sign","handlerChange","PDFSign","_excluded$1","_ref4","dataURLtoBlob","dataURL","arr","split","_arr","substring","length","mime","match","bstr","atob","n","u8arr","Uint8Array","charCodeAt","Blob","Signature","_ref5","onClose","onSuccess","mask","_mask","message","App","useApp","signatureCanvasRef","maskRef","setLoading","vertical","gap","concat","SignatureCanvas","canvasProps","Button","clear","isEmpty","error","toDataURL","maskPng","snapdom","toPng","scale","canvas","ctx","getContext","resultImage","Image","src","onload","successResult","Title","useSignature","modal","_Object$assign","modalProps","_excluded","modalApi","info","title","icon","footer","closable","wrapClassName","classNames","content","destroy"],"ignoreList":[],"sourceRoot":""}
|