{"_id":"@uiw/react-watermark","_rev":"5-848884ee3de035a3c734602539c0ee9f","name":"@uiw/react-watermark","dist-tags":{"latest":"1.0.1"},"versions":{"0.0.2":{"name":"@uiw/react-watermark","version":"0.0.2","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch","build":"tsbb build"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"0.0.2"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"6971942c83f504370a15de70bc0c2f3e0d0aeb00","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@0.0.2","_nodeVersion":"16.16.0","_npmVersion":"8.11.0","dist":{"integrity":"sha512-6ui6aD+8E72BskJ8YOEL0zHxC/swUMjuArNdRK2QgvhGhC6BQypxgIF6VFN+5CzrUg8otA0q31a7icuFA3HZcg==","shasum":"1bb2ae5e48cc35a2c16e1a871c1be8bf3cc71cb6","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-0.0.2.tgz","fileCount":9,"unpackedSize":27093,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDvwgAo/CHTTO/SJGAEOq9r043lH3zBqKoEpUFovl9+DwIgAWXRiRagYrWujWIaGi6dcMF1rWe257chcN/Ts01k65U="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIfagACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmouvA//W1PLcIkV0ww/01YDTIP9UEf8zQsaupimlH6pUzX9MTQ31dRr\r\nZU4ZSWIOSg0vh5eyHz/jMIftrSvb4yyRB9Hk/PXDWRrw0I/eRS5yTW0V5HRp\r\nyg9qaCV01YgwtJ4yh3tOZOlMkR2xJDXFBmpFxlF1bHoaii16VjeBfeWhCRV6\r\nXtBr+nFNR9UMDM6Xudo2k2bUHsCSB6uX4ziJ/MK/mOxAWu4XIohokqLzUUdo\r\nPoBWeHm7entrCSHfbV4lzqzyfuDpOx0zr5S9qfX+Hbm5rmAzBKrGx1BuxyIe\r\nSfBnUD18/ip0yla+8XKeCDlKPvTccKctbj4mOMNYmpR0Tx6ZhRidevhQ/X3a\r\nOp9xLP5Zd9gtiMHr+mQ8E5hdXqk0qF1xsefUI+s5IvUqdMoheK1bg03hGkNE\r\nvNOYdm+ba9g82d1ITomOU3aEVr/+L2fvO16mn6dJsF5Sf4NJYIzZKS3yZP1D\r\n5GCjBZTPqgsCk5vGDHjFWhnSjjP/gDHnmoyXePsR+tO4tXS9dtgEx5h8f7T6\r\nkLHHdL9+wRIPcbjkOoVVU/e1R1kTTUGbiBu0wzv92GhwxQ1Sfbtad2TkCSpM\r\n62fjbPDaOCTBBD6llxYA2L8MpfrzUvtzCzCLTi1XbpdlfmSuuGJzHKVKHKDU\r\nN1uGISAZWgOMqG9mshjFS9QWjjwaC/glAds=\r\n=+1V4\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_0.0.2_1663170208280_0.7426101108058978"},"_hasShrinkwrap":false},"0.0.3":{"name":"@uiw/react-watermark","version":"0.0.3","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch","build":"tsbb build"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"0.0.3"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"9fe8462c3cb5374af923250760cbf33ccbe6642f","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@0.0.3","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-XiVWAHssq1H4gMUpofoUfNzg8RW/QitcyWHh28BNd+4eS+hqoWp0Tfz2j/mDC5WIqT58EGuLWqMB4qDHdXB/NQ==","shasum":"177dc51d1a83ed82c179da4a23ea0a1b769aa037","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-0.0.3.tgz","fileCount":12,"unpackedSize":49768,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBB0VhHMXONXYLpQMZVxujPg2p5ftaWTShWoB7ogdBK1AiEAxtgCnyQu1mgH4TC+YhSzxZy8K1SUE30Zv+TLV/cd8k4="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIgj/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoEvA//Zal/UvsFwtPPx0FNU34PW1iyAu96t7XeZKsE+q1EeCI8big1\r\ncPI9IDTCtxOpIyHuBZp4BhK3LN7HYOXBu/ZYUjTHy1sfHm9i2K18XYfkUyTd\r\noOxMg0eiFlJQBNPUOq9S/IGiAo8ZU4nooCbreLi5tVue0kdRVbFOQw5Ohv4m\r\nrhvdw7HrXbbpLVeUhnTjfNZzzvkSqfc/kSZ6L1039VwDuLmKha3euaZLSbFn\r\nFcyi66EiC50gwojGCVeDiyZv25y786eY5L7T+41zwiLyv/IPfCcSyaC/DJEx\r\n9v0MaAW6rzlA8DAQjNsmhrsojhSdTJ9kxP/ZuFJLqyhVi0e5Ddeq+1wPXsOD\r\n6CetNQmmKacLK74QV/7p4PJbbD6bl2apqetKfjHDJBhb3QTJttfi5PPDycZ3\r\nXNbLUWGqm4ku7HFpqylybJBLap6TjhumVYygpyx+kWXpEUGBlMk59pCEi0Mg\r\nJ99Q1H4WxNYWiawB3SqLZS4jRXPit/1Puf6QoiwyFtL2IVNFn0esMLe7jqr4\r\niZJ7epDRvXe2hAQWA0njPVTWyUWMXzJ5XrrwaK2nvnHICcBcDrrXZPmE4Irs\r\ndNQFu3yOpZ3z+7zGSJnxWuGyYpBux5s9hiov+zsJ4sVhwRCbIlknashWqZnZ\r\nxog9eKGZGonaQ2+N3KPTvsR0ZJOE0L7mrf0=\r\n=jAKv\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_0.0.3_1663174910941_0.41917540826349886"},"_hasShrinkwrap":false},"0.0.4":{"name":"@uiw/react-watermark","version":"0.0.4","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch","build":"tsbb build"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"0.0.4"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"a0eb709b69a35c05146e83ec4c9ff39da0e523e6","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@0.0.4","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-+bLu/jiGoA+Re4n0gPyTH/8e6BAGfvgFgcnhaJfPfBZoTSt/+dU4lgubynmMi+4O4wVLtMgqJOj+z1USFAYCXA==","shasum":"287d8ccd2f9d60467c9af22ca985a351c7ef69aa","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-0.0.4.tgz","fileCount":12,"unpackedSize":53969,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGZyznHfrQnmH55NVuTiBIxtFyXtbh4mx7gjrzejfTMuAiEAnIidpjaEzPjiIUM+xYgBpgdTcIcYATZF0+aooAZjQNo="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIqUtACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp1MA//VszRXz/ZdwD6E1+MKvG5reYi8Ia2bTGkQcPwythcX8qQ6xtM\r\nQ/4sS80aTntGynqrK9ON7LC+UKP9GBldGIealRPljihQXepHN2jclRagB16G\r\nmQz4BFdSeecAXe4L/mUAQjSmSXX/xDm2LO6ResJueWNNSHQCqKY/kmUY1YqD\r\nGqol0dfhbhfmeHwisYN/JxBne4ZVfJcWir/VV35zSctT25oZ8RkKwcSKnvrT\r\nAyP4tDpHohXC43rFrip6+Rnw+Dzpm9GB/ZBEDn4CgKdzdi7HN3Roumf+qnGg\r\nvJIANa/uc9OkrtGt/cXoFZDb1vzir3OShzXYq5gMeVMCWRRB1T60yL69/QiJ\r\nDKYcV7PdI5rThPdNBdw6RLLt8bv/wCjX4xCY/GvNbvVM1ukxC/b7L63FwDdd\r\nNJsn/9f8SKJOiwOlX94HuhOXFTjuvFCDYsswS/1gxFnhtxTQwoHFlAigV147\r\nkF/yXgBgSzuwVBpbeptjM5j4XSe8Lr65+ty4071GsqVH8QxHV6F40A25nrYe\r\nfDINaaSHwsR6x6skNhGb4MIEIVIsJJp9rpJF9Dr2zY+PFCOy8KmKOF1+8MuX\r\nQ52xmPb3ylj2WDR2tcqjrEZauuiXhVixWPcxOmRgUS8JBtMcxVEuaCbGaf1W\r\nnM9pXyiTXKLskMsAKW3Z67t4A86fUCmFcg4=\r\n=bhCc\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_0.0.4_1663214893594_0.9752581492559727"},"_hasShrinkwrap":false},"0.0.5":{"name":"@uiw/react-watermark","version":"0.0.5","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch","build":"tsbb build"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"0.0.5"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"435024e2e5fe9173a90bb783668108fbffa079b5","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@0.0.5","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-F1JSV0kHbs0zLVRcGxhpO357dWkM4RVZaIHuyz5V+1BV8VAr23+e/7CvNyIRi9uz4RLkHeAopf6Ko3iLawOExw==","shasum":"8ce729fe8a11ae9c7a3fd9def7a705b0a3a0fc0d","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-0.0.5.tgz","fileCount":12,"unpackedSize":63835,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCZ00KU3C/Ob3h9SvwsiCTPY66DxjdOPxhkEnkaRvnsVwIgNmRV8zDFA9hFs2HcKY3JvZOj1fI2V7rfUlVrb0Y0KDs="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIvRtACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp+eg//eDXLZ5P4dpCyHXrDIyUrSSKyIFgpXiPmTrvTp9tyOphV32tE\r\nZii0ixD8W1gQJnbjpMaNvYp0wsfIpAI+ViOuEebyI1MwlMWN8VT9pUnjse7N\r\n5J/WPOIwcDzFY47NBDWjBtSJuL+JCGG768YqHFxJ093JliZ5oEMLlRkaXfRd\r\n0tfqT0eY5Z1G95Nybh5s6h67yycoItjpHt2v9qaSJ1ZKYbGgdc8PWgDIY8YM\r\nPWeim6G7thQuJq3tuBf7+jCfOLrR5KJb//T/r8PNvlvssifumDSjCdmz1+5u\r\nN3Cm/4VEcTw1kb2r/s8+HC6wwz0zyrdtQ7ga9yU9Cybqh0pdJd5U7TwAdtRY\r\n/uiTbxueKM5HuoD8oL4njRFCV39rr4j4DrV9mxqUVNUAKenW741SaDmoj0qg\r\nLrXJK9rl2lkbcUBY92IxhkXueX1HuLDJ0/CLiK6JP1g0LL9pwBTuM4h23ODG\r\nXMSf74MHVpb1uIMOB8EkRbfVV8jFM58OAWc+g3dIqH5yX4urQApEbJ4S3wkb\r\npq1ZqRfvF75A2IJfWeDrEs0dmgY3IqZvFrS+4XhXxcMdb17avNjxsFmaV9ZO\r\n9pku5W75xAwWzJlTuw7MxP9/eY2b0P49hgzS0gbsQGr7HdQav4AYnxh1MOYa\r\nIQHJWlIuo523MlRLaSpeRBPUK3uLO7MMXl4=\r\n=XeRo\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_0.0.5_1663235181544_0.4300717650095691"},"_hasShrinkwrap":false},"1.0.0":{"name":"@uiw/react-watermark","version":"1.0.0","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch src/index.tsx --use-babel --cjs cjs","build":"tsbb build src/index.tsx --use-babel --cjs cjs --bail"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"1.0.0"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"8d58cd91edb766f9ff94bdc2f96c7e7c89917ee4","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@1.0.0","_nodeVersion":"16.20.1","_npmVersion":"8.19.4","dist":{"integrity":"sha512-xtiuzCKCN8kbXFIjLMUFYLt08o7Ux6+re4a3NCcrZXmKwtC/X7bVdczIYmjI9+aHWS39WFLUfV7bqkiQv7AOTQ==","shasum":"43f1edd09d98ceb20125927f4ac420c10dcee046","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-1.0.0.tgz","fileCount":10,"unpackedSize":54346,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAXSUGfp4/zJsaKWtzayf5B4OEsHjgZTbg0JCyNrMNX7AiA3L9VNr8J8sarFSgdIr/CnzTWUpjudOYVvhbl/eRvY3w=="}]},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_1.0.0_1688545650192_0.7537232366880968"},"_hasShrinkwrap":false},"1.0.1":{"name":"@uiw/react-watermark","version":"1.0.1","description":"React Monorepo Template.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-watermark","funding":"https://jaywcjlove.github.io/#/sponsor","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","scripts":{"watch":"tsbb watch src/index.tsx --use-babel --cjs cjs","build":"tsbb build src/index.tsx --use-babel --cjs cjs --bail"},"publishConfig":{"access":"public"},"keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"dependencies":{"@uiw/watermark.js":"1.0.1"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","react":"^18.2.0","react-dom":"^18.2.0"},"types":"./cjs/index.d.ts","gitHead":"eeb5bf6cde87dad528ce412e126a6171271d3738","bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"_id":"@uiw/react-watermark@1.0.1","_nodeVersion":"16.20.2","_npmVersion":"8.19.4","dist":{"integrity":"sha512-vgredbDTD0YUjLICXiAFEt7z+lmBGAos+iApedsBdEBkkTxxINCsA3cNYKGJTohMOfa4kFQ/+RR7ygVSsisnfw==","shasum":"9efb86e7d1cbca1b648990c99f54c60c9da1ee7d","tarball":"https://registry.npmjs.org/@uiw/react-watermark/-/react-watermark-1.0.1.tgz","fileCount":10,"unpackedSize":67540,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCspJHb0CAtIN5SLRG8RsM/5hp3WMJmbcyAWAeRM3iEqgIgP2XMjKMiKQn3cPcTXYOPYRQa2SRiJ9aAzLcioOt70+Q="}]},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-watermark_1.0.1_1705560026809_0.9453752210249953"},"_hasShrinkwrap":false}},"time":{"created":"2022-09-14T15:43:28.238Z","0.0.2":"2022-09-14T15:43:28.448Z","modified":"2024-01-18T06:40:27.193Z","0.0.3":"2022-09-14T17:01:51.175Z","0.0.4":"2022-09-15T04:08:13.841Z","0.0.5":"2022-09-15T09:46:21.721Z","1.0.0":"2023-07-05T08:27:30.378Z","1.0.1":"2024-01-18T06:40:26.985Z"},"maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"description":"React Monorepo Template.","homepage":"https://uiwjs.github.io/react-watermark","keywords":["react-watermark","react.js","react","template","monorepo","watermark","uiw","uiw-react","react-component","component","components","ui","css","uikit","react-ui","framework"],"repository":{"type":"git","url":"git+https://github.com/uiwjs/react-watermark.git"},"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"bugs":{"url":"https://github.com/uiwjs/react-watermark/issues"},"license":"MIT","readme":"<!--rehype:ignore:start--> \nreact-watermark\n===\n<!--rehype:ignore:end-->\n\n[![Buy me a coffee](https://img.shields.io/badge/Buy%20me%20a%20coffee-048754?logo=buymeacoffee)](https://jaywcjlove.github.io/#/sponsor)\n[![Build & Deploy](https://github.com/uiwjs/react-watermark/actions/workflows/ci.yml/badge.svg)](https://github.com/uiwjs/react-watermark/actions/workflows/ci.yml)\n[![Coverage Status](https://uiwjs.github.io/react-watermark/badges.svg)](https://uiwjs.github.io/react-watermark/coverage/lcov-report/)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-watermark.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-watermark)\n[![NPM Version](https://img.shields.io/npm/v/@uiw/react-watermark.svg)](https://www.npmjs.com/package/@uiw/react-watermark)\n\nA react component that adds a watermark to an area of a web page. Example Preview: https://uiwjs.github.io/react-watermark\n\n## Install\n\nNot dependent on **uiw**.\n\n```bash\nnpm i @uiw/react-watermark\n# Or\nnpm i @uiw/watermark.js\n```\n\n### Using\n\n```jsx mdx:preview\nimport React from \"react\";\nimport Watermark from '@uiw/react-watermark';\n\nconst style = { width: '100%', maxWidth: '100%', height: 200, display: 'block' };\nconst text = `React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.\n\nDeclarative views make your code more predictable and easier to debug.`;\n\nexport default function App() {\n  return (\n    <Watermark\n      content=\"UIW Watermark\"\n      style={{ background: '#fff' }}\n    >\n      <textarea style={style} spellCheck={false} defaultValue={text} />\n    </Watermark>\n  );\n}\n```\n\nMulti-line watermark text\n\n```jsx mdx:preview\nimport React from \"react\";\nimport Watermark from '@uiw/react-watermark';\n\nconst style = { width: '100%', maxWidth: '100%', height: 200, display: 'block' };\nconst text = `React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.\n\nDeclarative views make your code more predictable and easier to debug.`;\n\nexport default function App() {\n  return (\n    <Watermark\n      content={['UIW Watermark', '多行文字']}\n      style={{ background: '#fff' }}\n    >\n      <textarea style={style} spellCheck={false} defaultValue=\"Added watermark here\" />\n    </Watermark>\n  );\n}\n```\n\nMore props settings\n\n```jsx mdx:preview\nimport React from \"react\";\nimport Watermark from '@uiw/react-watermark';\n\nconst style = { width: '100%', maxWidth: '100%', height: 200, display: 'block' };\nconst text = `React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.\n\nDeclarative views make your code more predictable and easier to debug.`;\n\nexport default function App() {\n  return (\n    <Watermark\n      content=\"UIW Watermark\"\n      rotate={20}\n      gapY={0}\n      gapX={5}\n      width={100}\n      gapY={80}\n      height={5}\n      fontSize={12}\n      fontColor=\"rgb(255 0 0 / 25%)\"\n      style={{ background: '#fff' }}\n    >\n      <textarea style={style} spellCheck={false} defaultValue={text} />\n    </Watermark>\n  );\n}\n```\n\nImage watermark\n\n```jsx mdx:preview\nimport React from \"react\";\nimport Watermark from '@uiw/react-watermark';\n\nconst style = { width: '100%', maxWidth: '100%', height: 200, display: 'block' };\nconst text = `React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.\n\nDeclarative views make your code more predictable and easier to debug.\n\nBuild encapsulated components that manage their own state, then compose them to make complex UIs.\n\nSince component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep state out of the DOM.`;\n\nexport default function App() {\n  return (\n    <Watermark\n      height={32}\n      width={165}\n      image=\"https://uiwjs.github.io/react-watermark/watermark-example.svg\"\n    >\n      <textarea style={style} spellCheck={false} defaultValue={text} />\n    </Watermark>\n  );\n}\n```\n\nImage base64 watermark\n\n```jsx mdx:preview\nimport React from \"react\";\nimport Watermark from '@uiw/react-watermark';\n\nconst imageBase64 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjUiIGhlaWdodD0iMzEiIHZpZXdCb3g9IjAgMCAxNjUgMzEiPjxnIGZpbGw9IiNBQUEiIG9wYWNpdHk9Ii40MjEiPjxwYXRoIGQ9Ik02Ljg0NDg5MzY2LDAgTDEzLjY4OTc4NzMsNS4yOTg0MzczNCBMMTEuMDc1MjcwNiwxMy44NzE0ODkgTDIuNjE0NTE2NzMsMTMuODcxNDg5IEwwLDUuMjk4NDM3MzQgTDYuODQ0ODkzNjYsMCBaIE02Ljg0NDg5MzY2LDMxIEwwLDI1LjcwMTU2MjYgTDIuNjE0NTE2NzMsMTcuMTI4NTEwOSBMMTEuMDc1MjcwNiwxNy4xMjg1MTA5IEwxMy42ODk3ODczLDI1LjcwMTU2MjYgTDYuODQ0ODkzNjYsMzEgWiBNMjYsMjAuMTAwMjMwOSBMMTcuOTUzMjE4MSwyMi44ODU1OTgzIEwxMi45Nzk5MDY0LDE1LjU5Mjk5NiBMMTcuOTUzMDEyNyw4LjMwMDU1MjU0IEwyNiwxMS4wODYxNzcgTDI2LDIwLjEwMDIzMDkgWiIvPjxwb2x5Z29uIHBvaW50cz0iMzQgNiAzOS4wMjcgMjMgNDEuODk2IDIzIDQ1LjQ1MSA5Ljg4MSA0NS41NDkgOS44ODEgNDkuMTA0IDIzIDUxLjk0OSAyMyA1NyA2IDUzLjk4NCA2IDUwLjU3NiAxOS4yMzggNTAuNDc4IDE5LjIzOCA0Ni44OTggNiA0NC4xMDIgNiA0MC41MjIgMTkuMjM4IDQwLjQyNCAxOS4yMzggMzcuMDE2IDYiLz48cGF0aCBkPSJNNjQuNDg3MTc5NSAxMUM2Mi44NDYxNTM4IDExIDYxLjUxMjgyMDUgMTEuMjgyNTY4OCA2MC41Mzg0NjE1IDExLjg5OTA4MjYgNTkuNDEwMjU2NCAxMi41NjY5NzI1IDU4LjY5MjMwNzcgMTMuNjQ1ODcxNiA1OC40MTAyNTY0IDE1LjA4NDQwMzdMNjEuMTAyNTY0MSAxNS4zMTU1OTYzQzYxLjI1NjQxMDMgMTQuNTcwNjQyMiA2MS42NDEwMjU2IDE0LjAzMTE5MjcgNjIuMjU2NDEwMyAxMy42NzE1NTk2IDYyLjc2OTIzMDggMTMuMzYzMzAyOCA2My40NjE1Mzg1IDEzLjIwOTE3NDMgNjQuMzA3NjkyMyAxMy4yMDkxNzQzIDY2LjMwNzY5MjMgMTMuMjA5MTc0MyA2Ny4zMDc2OTIzIDE0LjEzMzk0NSA2Ny4zMDc2OTIzIDE1Ljk4MzQ4NjJMNjcuMzA3NjkyMyAxNi41MjI5MzU4IDY0LjMzMzMzMzMgMTYuNkM2Mi4zODQ2MTU0IDE2LjY1MTM3NjEgNjAuODQ2MTUzOCAxNy4wMzY2OTcyIDU5Ljc2OTIzMDggMTcuODA3MzM5NCA1OC41ODk3NDM2IDE4LjYwMzY2OTcgNTggMTkuNzU5NjMzIDU4IDIxLjI0OTU0MTMgNTggMjIuMzU0MTI4NCA1OC40MTAyNTY0IDIzLjI1MzIxMSA1OS4yNTY0MTAzIDIzLjk0Njc4OSA2MC4wMjU2NDEgMjQuNjQwMzY3IDYxLjEwMjU2NDEgMjUgNjIuNDg3MTc5NSAyNSA2My42NjY2NjY3IDI1IDY0LjY5MjMwNzcgMjQuNzY4ODA3MyA2NS41NjQxMDI2IDI0LjM1Nzc5ODIgNjYuMzMzMzMzMyAyMy45NzI0NzcxIDY2Ljk3NDM1OSAyMy40MzMwMjc1IDY3LjQ4NzE3OTUgMjIuNzY1MTM3Nkw2Ny40ODcxNzk1IDI0LjY0MDM2NyA3MCAyNC42NDAzNjcgNzAgMTYuMTYzMzAyOEM3MCAxNC41NDQ5NTQxIDY5LjU4OTc0MzYgMTMuMzExOTI2NiA2OC43OTQ4NzE4IDEyLjQ2NDIyMDIgNjcuODcxNzk0OSAxMS40ODgwNzM0IDY2LjQzNTg5NzQgMTEgNjQuNDg3MTc5NSAxMVpNNjcuMzA3NjkyMyAxOC41MDA5MTc0IDY3LjMwNzY5MjMgMTkuMjcxNTU5NkM2Ny4zMDc2OTIzIDIwLjI5OTA4MjYgNjYuODcxNzk0OSAyMS4xNzI0NzcxIDY2LjA1MTI4MjEgMjEuODY2MDU1IDY1LjIzMDc2OTIgMjIuNTU5NjMzIDY0LjI1NjQxMDMgMjIuOTE5MjY2MSA2My4xMDI1NjQxIDIyLjkxOTI2NjEgNjIuNDEwMjU2NCAyMi45MTkyNjYxIDYxLjg0NjE1MzggMjIuNzM5NDQ5NSA2MS40MzU4OTc0IDIyLjQwNTUwNDYgNjEgMjIuMDcxNTU5NiA2MC43OTQ4NzE4IDIxLjY2MDU1MDUgNjAuNzk0ODcxOCAyMS4xNDY3ODkgNjAuNzk0ODcxOCAxOS41MDI3NTIzIDYyLjAyNTY0MSAxOC42MjkzNTc4IDY0LjUxMjgyMDUgMTguNTc3OTgxN0w2Ny4zMDc2OTIzIDE4LjUwMDkxNzRaTTc4LjA1IDggNzUuNCA5LjA5MzU2NzI1IDc1LjQgMTIuMTUwNTg0OCA3MyAxMi4xNTA1ODQ4IDczIDE0LjMzNzcxOTMgNzUuNCAxNC4zMzc3MTkzIDc1LjQgMjEuNzkzODU5NkM3NS40IDIyLjgxMjg2NTUgNzUuNjI1IDIzLjU4MzMzMzMgNzYuMTI1IDI0LjEzMDExNyA3Ni42MjUgMjQuNzAxNzU0NCA3Ny40NSAyNSA3OC41NSAyNUw4MC42NzUgMjUgODAuNjc1IDIyLjgxMjg2NTUgNzguOTc1IDIyLjgxMjg2NTVDNzguNjUgMjIuODEyODY1NSA3OC40MjUgMjIuNzEzNDUwMyA3OC4yNzUgMjIuNTY0MzI3NSA3OC4xMjUgMjIuMzkwMzUwOSA3OC4wNSAyMi4xNDE4MTI5IDc4LjA1IDIxLjc5Mzg1OTZMNzguMDUgMTQuMzM3NzE5MyA4MSAxNC4zMzc3MTkzIDgxIDEyLjE1MDU4NDggNzguMDUgMTIuMTUwNTg0OCA3OC4wNSA4Wk04OC45MTY2NjY3IDExQzg2LjgwNTU1NTYgMTEgODUuMTExMTExMSAxMS42Njc4ODk5IDgzLjg4ODg4ODkgMTMuMDI5MzU3OCA4Mi42MTExMTExIDE0LjM2NTEzNzYgODIgMTYuMDA5MTc0MyA4MiAxNy45ODcxNTYgODIgMjAuMTcwNjQyMiA4Mi42NjY2NjY3IDIxLjg5MTc0MzEgODQgMjMuMTc2MTQ2OCA4NS4yMjIyMjIyIDI0LjM4MzQ4NjIgODYuOTE2NjY2NyAyNSA4OS4wMjc3Nzc4IDI1IDkwLjk0NDQ0NDQgMjUgOTIuNTI3Nzc3OCAyNC40ODYyMzg1IDkzLjc3Nzc3NzggMjMuNDg0NDAzNyA5NC43Nzc3Nzc4IDIyLjY2MjM4NTMgOTUuNDE2NjY2NyAyMS42MDkxNzQzIDk1Ljc1IDIwLjM3NjE0NjhMOTIuODA1NTU1NiAyMC4zNzYxNDY4QzkyLjQxNjY2NjcgMjEuMTQ2Nzg5IDkyIDIxLjczNzYxNDcgOTEuNSAyMi4wOTcyNDc3IDkwLjg2MTExMTEgMjIuNTMzOTQ1IDkwLjAyNzc3NzggMjIuNzY1MTM3NiA4OSAyMi43NjUxMzc2IDg3LjgzMzMzMzMgMjIuNzY1MTM3NiA4Ni45MTY2NjY3IDIyLjQwNTUwNDYgODYuMjUgMjEuNzM3NjE0NyA4NS41ODMzMzMzIDIxLjA0NDAzNjcgODUuMjIyMjIyMiAyMC4wNDIyMDE4IDg1LjExMTExMTEgMTguNzU3Nzk4Mkw5NiAxOC43NTc3OTgyQzk1Ljk3MjIyMjIgMTYuMzk0NDk1NCA5NS4zODg4ODg5IDE0LjU0NDk1NDEgOTQuMjc3Nzc3OCAxMy4yMDkxNzQzIDkzLjA1NTU1NTYgMTEuNzE5MjY2MSA5MS4yNSAxMSA4OC45MTY2NjY3IDExWk04OSAxMy4yMzQ4NjI0QzkxLjMzMzMzMzMgMTMuMjM0ODYyNCA5Mi42Mzg4ODg5IDE0LjM5MDgyNTcgOTIuOTE2NjY2NyAxNi43MDI3NTIzTDg1LjE2NjY2NjcgMTYuNzAyNzUyM0M4NS4zMzMzMzMzIDE1LjU3MjQ3NzEgODUuNzUgMTQuNzI0NzcwNiA4Ni4zNjExMTExIDE0LjEzMzk0NSA4Ny4wMjc3Nzc4IDEzLjUxNzQzMTIgODcuODg4ODg4OSAxMy4yMzQ4NjI0IDg5IDEzLjIzNDg2MjRaTTEwMi4yNTQwNzIgOUMxMDEuNDIwMTk1IDkgMTAwLjY5MDU1NCA5LjIzNzI4ODE0IDEwMC4wNjUxNDcgOS43NjQ1OTUxIDk5LjU0Mzk3MzkgMTAuMTMzNzEgOTkuMTAwOTc3MiAxMC42ODczODIzIDk4Ljc2MjIxNSAxMS40MjU2MTIxTDk4Ljc2MjIxNSA5LjM2OTExNDg4IDk2IDkuMzY5MTE0ODggOTYgMjMgOTguNzYyMjE1IDIzIDk4Ljc2MjIxNSAxNS43NzU4OTQ1Qzk4Ljc2MjIxNSAxNC41ODk0NTM5IDk5LjEwMDk3NzIgMTMuNjEzOTM2IDk5LjgwNDU2MDMgMTIuODc1NzA2MiAxMDAuNDU2MDI2IDEyLjE5MDIwNzIgMTAxLjIxMTcyNiAxMS44NDc0NTc2IDEwMi4wNDU2MDMgMTEuODQ3NDU3NiAxMDIuNjcxMDEgMTEuODQ3NDU3NiAxMDMuMzIyNDc2IDExLjkyNjU1MzcgMTA0IDEyLjEzNzQ3NjVMMTA0IDkuMzQyNzQ5NTNDMTAzLjUzMDk0NSA5LjEwNTQ2MTM5IDEwMi45MzE1OTYgOSAxMDIuMjU0MDcyIDlaTTExMS4yMjQ1NzEgOUMxMDkuOTE5NDE5IDkgMTA4LjcxNDY2MyA5LjYwNjQwMzAxIDEwNy42NjA1MDIgMTAuODcxOTM5N0wxMDcuNjYwNTAyIDkuMzY5MTE0ODggMTA1IDkuMzY5MTE0ODggMTA1IDIzIDEwNy42NjA1MDIgMjMgMTA3LjY2MDUwMiAxNC44MDAzNzY2QzEwNy42NjA1MDIgMTMuODUxMjI0MSAxMDcuOTExNDkzIDEzLjAzMzg5ODMgMTA4LjQ2MzY3MiAxMi4zNzQ3NjQ2IDEwOC45NjU2NTQgMTEuNjg5MjY1NSAxMDkuNjY4NDI4IDExLjM0NjUxNiAxMTAuNTIxNzk3IDExLjM0NjUxNiAxMTIuMjc4NzMyIDExLjM0NjUxNiAxMTMuMTgyMjk5IDEyLjQwMTEyOTkgMTEzLjE4MjI5OSAxNC41NjMwODg1TDExMy4xODIyOTkgMjMgMTE1Ljg0MjgwMSAyMyAxMTUuODQyODAxIDE0LjYxNTgxOTJDMTE1Ljg0MjgwMSAxMy42MTM5MzYgMTE2LjA5Mzc5MSAxMi43OTY2MTAyIDExNi41OTU3NzMgMTIuMjE2NTcyNSAxMTcuMDk3NzU0IDExLjYzNjUzNDggMTE3LjcwMDEzMiAxMS4zNDY1MTYgMTE4LjQ1MzEwNCAxMS4zNDY1MTYgMTE5LjQ1NzA2NyAxMS4zNDY1MTYgMTIwLjIxMDA0IDExLjU4MzgwNDEgMTIwLjY2MTgyMyAxMi4xMTExMTExIDEyMS4xMTM2MDYgMTIuNjEyMDUyNyAxMjEuMzM5NDk4IDEzLjQyOTM3ODUgMTIxLjMzOTQ5OCAxNC41MzY3MjMyTDEyMS4zMzk0OTggMjMgMTI0IDIzIDEyNCAxNC4wNjIxNDY5QzEyNCAxMi41MzI5NTY3IDEyMy41NDgyMTcgMTEuMzIwMTUwNyAxMjIuNjk0ODQ4IDEwLjM5NzM2MzUgMTIxLjgxNjM4IDkuNDQ4MjEwOTIgMTIwLjcxMjAyMSA5IDExOS4zODE3NyA5IDExOC41MDMzMDMgOSAxMTcuNzc1NDI5IDkuMTU4MTkyMDkgMTE3LjE3MzA1MiA5LjUwMDk0MTYyIDExNi41MjA0NzYgOS44NDM2OTExNSAxMTUuODkyOTk5IDEwLjQ1MDA5NDIgMTE1LjMxNTcyIDExLjI5Mzc4NTMgMTE0LjUxMjU1IDkuNzY0NTk1MSAxMTMuMTMyMSA5IDExMS4yMjQ1NzEgOVpNMTMzLjQ4NzE3OSAxMUMxMzEuODQ2MTU0IDExIDEzMC41MTI4MjEgMTEuMjgyNTY4OCAxMjkuNTM4NDYyIDExLjg5OTA4MjYgMTI4LjQxMDI1NiAxMi41NjY5NzI1IDEyNy42OTIzMDggMTMuNjQ1ODcxNiAxMjcuNDEwMjU2IDE1LjA4NDQwMzdMMTMwLjEwMjU2NCAxNS4zMTU1OTYzQzEzMC4yNTY0MSAxNC41NzA2NDIyIDEzMC42NDEwMjYgMTQuMDMxMTkyNyAxMzEuMjU2NDEgMTMuNjcxNTU5NiAxMzEuNzY5MjMxIDEzLjM2MzMwMjggMTMyLjQ2MTUzOCAxMy4yMDkxNzQzIDEzMy4zMDc2OTIgMTMuMjA5MTc0MyAxMzUuMzA3NjkyIDEzLjIwOTE3NDMgMTM2LjMwNzY5MiAxNC4xMzM5NDUgMTM2LjMwNzY5MiAxNS45ODM0ODYyTDEzNi4zMDc2OTIgMTYuNTIyOTM1OCAxMzMuMzMzMzMzIDE2LjZDMTMxLjM4NDYxNSAxNi42NTEzNzYxIDEyOS44NDYxNTQgMTcuMDM2Njk3MiAxMjguNzY5MjMxIDE3LjgwNzMzOTQgMTI3LjU4OTc0NCAxOC42MDM2Njk3IDEyNyAxOS43NTk2MzMgMTI3IDIxLjI0OTU0MTMgMTI3IDIyLjM1NDEyODQgMTI3LjQxMDI1NiAyMy4yNTMyMTEgMTI4LjI1NjQxIDIzLjk0Njc4OSAxMjkuMDI1NjQxIDI0LjY0MDM2NyAxMzAuMTAyNTY0IDI1IDEzMS40ODcxNzkgMjUgMTMyLjY2NjY2NyAyNSAxMzMuNjkyMzA4IDI0Ljc2ODgwNzMgMTM0LjU2NDEwMyAyNC4zNTc3OTgyIDEzNS4zMzMzMzMgMjMuOTcyNDc3MSAxMzUuOTc0MzU5IDIzLjQzMzAyNzUgMTM2LjQ4NzE3OSAyMi43NjUxMzc2TDEzNi40ODcxNzkgMjQuNjQwMzY3IDEzOSAyNC42NDAzNjcgMTM5IDE2LjE2MzMwMjhDMTM5IDE0LjU0NDk1NDEgMTM4LjU4OTc0NCAxMy4zMTE5MjY2IDEzNy43OTQ4NzIgMTIuNDY0MjIwMiAxMzYuODcxNzk1IDExLjQ4ODA3MzQgMTM1LjQzNTg5NyAxMSAxMzMuNDg3MTc5IDExWk0xMzYuMzA3NjkyIDE4LjUwMDkxNzQgMTM2LjMwNzY5MiAxOS4yNzE1NTk2QzEzNi4zMDc2OTIgMjAuMjk5MDgyNiAxMzUuODcxNzk1IDIxLjE3MjQ3NzEgMTM1LjA1MTI4MiAyMS44NjYwNTUgMTM0LjIzMDc2OSAyMi41NTk2MzMgMTMzLjI1NjQxIDIyLjkxOTI2NjEgMTMyLjEwMjU2NCAyMi45MTkyNjYxIDEzMS40MTAyNTYgMjIuOTE5MjY2MSAxMzAuODQ2MTU0IDIyLjczOTQ0OTUgMTMwLjQzNTg5NyAyMi40MDU1MDQ2IDEzMCAyMi4wNzE1NTk2IDEyOS43OTQ4NzIgMjEuNjYwNTUwNSAxMjkuNzk0ODcyIDIxLjE0Njc4OSAxMjkuNzk0ODcyIDE5LjUwMjc1MjMgMTMxLjAyNTY0MSAxOC42MjkzNTc4IDEzMy41MTI4MjEgMTguNTc3OTgxN0wxMzYuMzA3NjkyIDE4LjUwMDkxNzRaTTE0OC4yNTQwNzIgOUMxNDcuNDIwMTk1IDkgMTQ2LjY5MDU1NCA5LjIzNzI4ODE0IDE0Ni4wNjUxNDcgOS43NjQ1OTUxIDE0NS41NDM5NzQgMTAuMTMzNzEgMTQ1LjEwMDk3NyAxMC42ODczODIzIDE0NC43NjIyMTUgMTEuNDI1NjEyMUwxNDQuNzYyMjE1IDkuMzY5MTE0ODggMTQyIDkuMzY5MTE0ODggMTQyIDIzIDE0NC43NjIyMTUgMjMgMTQ0Ljc2MjIxNSAxNS43NzU4OTQ1QzE0NC43NjIyMTUgMTQuNTg5NDUzOSAxNDUuMTAwOTc3IDEzLjYxMzkzNiAxNDUuODA0NTYgMTIuODc1NzA2MiAxNDYuNDU2MDI2IDEyLjE5MDIwNzIgMTQ3LjIxMTcyNiAxMS44NDc0NTc2IDE0OC4wNDU2MDMgMTEuODQ3NDU3NiAxNDguNjcxMDEgMTEuODQ3NDU3NiAxNDkuMzIyNDc2IDExLjkyNjU1MzcgMTUwIDEyLjEzNzQ3NjVMMTUwIDkuMzQyNzQ5NTNDMTQ5LjUzMDk0NSA5LjEwNTQ2MTM5IDE0OC45MzE1OTYgOSAxNDguMjU0MDcyIDlaIi8+PHBvbHlnb24gcG9pbnRzPSIxNTAgNiAxNTAgMjUgMTUzLjA0NyAyNSAxNTMuMDQ3IDIwLjI3NiAxNTQuNzQzIDE4Ljg0MSAxNjAuMDkgMjUgMTY0IDI1IDE1Ni44NDIgMTcuMDY2IDE2My40MjUgMTEuNTA3IDE1OS40ODcgMTEuNTA3IDE1My4wNDcgMTcuMDY2IDE1My4wNDcgNiIvPjwvZz48L3N2Zz4='\n\nconst style = { width: '100%', maxWidth: '100%', height: 200, display: 'block' };\nconst text = `React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.\n\nDeclarative views make your code more predictable and easier to debug.\n\nBuild encapsulated components that manage their own state, then compose them to make complex UIs.\n\nSince component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep state out of the DOM.`;\n\nexport default function App() {\n  return (\n    <Watermark\n      height={32}\n      width={165}\n      image={imageBase64}\n    >\n      <textarea style={style} spellCheck={false} defaultValue={text} />\n    </Watermark>\n  );\n}\n```\n\n## In the static pages\n\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/watermark.js.svg?style=flat)](https://www.npmjs.com/package/@uiw/watermark.js)\n[![NPM Version](https://img.shields.io/npm/v/@uiw/watermark.js.svg)](https://www.npmjs.com/package/@uiw/watermark.js)\n\n```bash\nnpm i @uiw/watermark.js\n```\n\n```js\nimport Watermark from '@uiw/watermark.js';\n\nconst watermark = new Watermark({\n  content: 'Hello Watermark!'\n});\nwatermark.create().then((mark) => {\n  console.log('output:', mark)\n})\n.catch((err) => {\n  console.log(err, 'err')\n})\n```\n\nOr manually download and link `watermark.js` in your HTML, It can also be downloaded via [UNPKG](https://unpkg.com/browse/@uiw/watermark.js/):\n\nCDN: [UNPKG](https://unpkg.com/@uiw/watermark.js/dist/) | [jsDelivr](https://cdn.jsdelivr.net/npm/@uiw/watermark.js/) | [Githack](https://raw.githack.com/uiwjs/watermark.js/gh-pages/watermark.min.js) | [Statically](https://cdn.statically.io/gh/uiwjs/watermark.js/gh-pages/watermark.min.js)\n\n```html\n<style>\n  #mark {\n    z-index: 9;\n    position: absolute;\n    left: 0px;\n    top: 0px;\n    width: 100%;\n    height: 100%;\n    background-size: 332px;\n    pointer-events: none;\n    background-repeat: repeat;\n  }\n</style>\n<body style=\"position: relative; min-height: 100vh;\">\n  <div id=\"mark\"></div>\n  <script src=\"https://unpkg.com/@uiw/watermark.js/dist/watermark.min.js\"></script>\n  <script>\n    const $dom = document.querySelector('div#mark');\n    const watermark = new Watermark({\n      content: 'Hello Watermark!'\n    });\n    watermark.create().then((mark) => {\n      $dom.style.backgroundImage = `url(${mark})`\n    })\n    .catch((err) => {\n      console.log(err, 'err')\n    })\n  </script>\n</body>\n```\n\n## API \n\n```ts\nimport React from 'react';\nimport { WatermarkOptions } from '@uiw/watermark.js';\nexport interface WatermarkProps extends Omit<React.AllHTMLAttributes<HTMLDivElement>, 'width' | 'height'>, WatermarkOptions {\n  prefixCls?: string;\n  /** watermark style */\n  markStyle?: React.CSSProperties;\n  /** watermark class name */\n  markClassName?: string;\n  /** watermark text content */\n  text?: string;\n}\ndeclare const Watermark: React.ForwardRefExoticComponent<WatermarkProps & React.RefAttributes<HTMLDivElement>>;\nexport default Watermark;\n```\n\n**`@uiw/watermark.js`**\n\n```ts\nexport interface WatermarkOptions {\n  /** watermark text content */\n  content?: string | string[];\n  /**\n   * When the watermark is drawn, the rotation angle, in `°`. @default `-22`\n   */\n  rotate?: number;\n  /**\n   * High-definition print image source, for high-definition screen display,\n   * it is recommended to use 2x or 3x image, and priority to use image rendering watermark.\n   */\n  image?: string;\n  /** Horizontal spacing between watermarks. @default `212` */\n  gapX?: number;\n  /** vertical spacing between watermarks. @default `222` */\n  gapY?: number;\n  /** width of watermark. @default `120` */\n  width?: number;\n  /** height of watermark @default `64` */\n  height?: number;\n  /**\n   * The vertical offset of the watermark drawn on the canvas.\n   * Normally, the watermark is drawn in the middle position, ie `offsetTop = gapY / 2`\n   */\n  offsetLeft?: number;\n  /**\n   * The horizontal offset of the watermark drawn on the canvas, under normal circumstances,\n   * the watermark is drawn in the middle position, ie `offsetTop = gapX / 2`\n   */\n  offsetTop?: number;\n  /** text size @default `16` */\n  fontSize?: number;\n  /** text family @default `sans-serif` */\n  fontFamily?: string;\n  /** text weight @default `normal` */\n  fontWeight?: 'normal' | 'light' | 'weight' | number;\n  /** text color @default `rgba(0,0,0,.15)` */\n  fontColor?: string;\n  /** text style */\n  fontStyle?: CanvasFillStrokeStyles['fillStyle'];\n}\nexport default class Watermark {\n  option: WatermarkOptions;\n  constructor(options: WatermarkOptions);\n  create(): Promise<string>;\n}\n```\n\n## Development\n\n1. Install\n\nDependencies in the installation package and website\n\n```bash\nnpm install\n```\n\n2. To develop, run the self-reloading build:\n\n```bash\nnpm run build      # Compile packages      📦 @uiw/react-watermark & @uiw/watermark.js\nnpm run watch      # Real-time compilation 📦 @uiw/react-watermark\nnpm run watch:core # Real-time compilation 📦 @uiw/watermark.js\n```\n\n3. Run Document Website Environment:\n\n```bash\nnpm run start\n```\n\n4. To contribute, please fork repos, add your patch and tests for it (in the `test/` folder) and submit a pull request.\n\n```\nnpm run test\n```\n\n\n## Contributors\n\nAs always, thanks to our amazing contributors!\n\n<a href=\"https://github.com/uiwjs/react-watermark/graphs/contributors\">\n  <img src=\"https://uiwjs.github.io/react-watermark/CONTRIBUTORS.svg\" />\n</a>\n\nMade with [action-contributors](https://github.com/jaywcjlove/github-action-contributors).\n\n## License\n\nLicensed under the MIT License.","readmeFilename":"README.md"}