{"_id":"@bilingo.com/react-native-zss-rich-text-editor","_rev":"3-5747ee7afb2779d577c6d9299083f55d","name":"@bilingo.com/react-native-zss-rich-text-editor","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@bilingo.com/react-native-zss-rich-text-editor","repository":{"type":"git","url":"https://git.links123.net/npm/react-native-zss-rich-text-editor.git"},"version":"1.0.0","description":"React Native Wrapper for ZSSRichTextEditor","main":"index.js","license":"SEE LICENSE IN LICENSE","peerDependencies":{"react":"*","react-native":">=0.31.0"},"gitHead":"c805ebae04323dfff1ede82f0dd704eb3d58a046","_id":"@bilingo.com/react-native-zss-rich-text-editor@1.0.0","_npmVersion":"6.4.1","_nodeVersion":"10.15.3","_npmUser":{"name":"adam_fu","email":"foureyed@qq.com"},"dist":{"integrity":"sha512-KQNXKRUsZ+b52PGX0KLiGpJetk2HYh1wx9iJ0CA8IJCrmxBaaURyw0ZRPpNXFjcFXGn5woJFBNQ+REqpqz/5tA==","shasum":"47d1332286be6a5641edf000a0578fc0c5494c9c","tarball":"https://registry.npmjs.org/@bilingo.com/react-native-zss-rich-text-editor/-/react-native-zss-rich-text-editor-1.0.0.tgz","fileCount":9,"unpackedSize":184194,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeW8PMCRA9TVsSAnZWagAA2CoP/i7aihy0QocjY4tBkqkL\nGE9YNgPUV5uXw62+PS8dazC+Pwpxgxf17cI9exemXiXGuLBAlhZkRIzhbCqe\nfKNmMIQsyXsW9agtvtNa3CqhUIen9y9UqtlSrAz3etWBvL+SSS86NkGk2egu\nSVUJMhyuIn+esKQix2TIPHXiMoXCFPIj48Wq3JQUR+SqcCHSi75oLXhCcKAU\nulh44lTt9t2/NkV1TZa84BJGmcE1f8gyMhqz348rrzIfy5zseJTZ8a0pHUha\nxTTyX0jWKgkiJ70kL0srpFwnOukyPkixC0Sdltla9jp2Go3t4bGV8P3Ygs2r\n5IFwbco8jDer/YSTIhxoNlR9BZMPUkMpm2Lxduvq6BXmtTebiIHksSKXVJdG\naUtt7sK7deOVt7K9v6MteBxNREsuuzFOYhEIl1QYX1vBHmgLi+NIEtwnJGjC\nzv8CE8dTtVA/xheQ2tL7Fcikxi5zA10GxDSxocKHrC/r//tt3yYrkKSd2zXg\nofWYCe4Ktblzgn25YCRD7QzrPBzA4xozbjhA4xigRKPUPWF2GX9eWNANBgtE\nHr/boclUNFBO4TATfcrTxyrbGiDwEwtPbvzuvzieUnmx0O55hDFUJ7OTOI24\nTVvPiXVtVpUkY3gk1eDM1B7VhfqAmjuytS/Rm1Ek/f7boR/JYsUAQRwxp/el\nKZOw\r\n=jrIb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDG6kMXOdph5cLBZnluf+z1AYIlkafHroeQVAcVC+gthgIhAN2kcdejFF7iNtoKrO2kAuSfImvGxbl5Bbd2kQLWYJuD"}]},"maintainers":[{"name":"yyppaag","email":"yyppaag@gmail.com"},{"name":"murrayee","email":"murrayee@163.com"},{"name":"adam_fu","email":"foureyed@qq.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-zss-rich-text-editor_1.0.0_1583072203797_0.11015276016277031"},"_hasShrinkwrap":false},"1.0.2":{"name":"@bilingo.com/react-native-zss-rich-text-editor","repository":{"type":"git","url":"https://git.links123.net/npm/react-native-zss-rich-text-editor.git"},"version":"1.0.2","description":"React Native Wrapper for ZSSRichTextEditor","main":"index.js","license":"SEE LICENSE IN LICENSE","peerDependencies":{"react":"*","react-native":">=0.31.0"},"gitHead":"9979179ac18bf750e7816e884158172ce8c20f51","_id":"@bilingo.com/react-native-zss-rich-text-editor@1.0.2","_npmVersion":"6.4.1","_nodeVersion":"10.15.3","_npmUser":{"name":"adam_fu","email":"foureyed@qq.com"},"dist":{"integrity":"sha512-B5FmYc6JRjrGR2SlIVPMzqHBwmo2HwQzYrp2tkklGuotyCtZYUIhu2enXF0h8MWor95DPALeFTX7QlhqJHcQ6w==","shasum":"cfa80a3724d9859ea5266b2b41ff645506222046","tarball":"https://registry.npmjs.org/@bilingo.com/react-native-zss-rich-text-editor/-/react-native-zss-rich-text-editor-1.0.2.tgz","fileCount":9,"unpackedSize":184220,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4aOwCRA9TVsSAnZWagAAErsP/3ENSvLKpyCCKVLllgGB\nVZLnty9TQeoUzgt6eSGPtGTFojfaDCupyxsBYfsv8gCeRtg8Mqnb0XY3WGUF\nTt6Blc3nziAsDLO1oJRUDG1VVh80J05OkSJc5otKoxLnhN4e7kxd3UHIFTf/\nlEnjx2QdImaN0DgWXQv0kBB2eAXRiHmyoQyN1c6yHuVrNQndeS+022G3+P8y\nFWG5huckLRxucHtrT1fzClDpI3FAe6xgwoQ6fG1BGO1++tAmIk4XJseF6CEp\ntHZ88965R3zwr5fHQWBOKnlq7oilriFaH8uEi1McxEPhu9X4G8OqMpfTbCLt\nDq6s53Gnl5EXyu8LSIVAiXor31bFWI2zXu586L/o7o6Ktt7DDKLBNUZdY2nl\n+0wN95RAoUk6Dydh6lGNBILjyy+Wn7ie3GAH28PsJWOqKyDfVZhNbDEwTIQg\ns/v3XN/fK6WcHW6bNkRvotqjlYrYsoCGgH/6Sp0YjOTIMvepLHFbWmI32pV6\nKeLJantBWvLEK7pVngZB2McT5mMFM29LmWcN+S1Fzol5mEt0E0LXZ4H2iav8\nrFHfxzq2ENr9H2uWBpCD77Uie6bWp/ess9B+7EXuEgRovmXmjoUucMJkk2Aq\nBzBj1kFAfUPu/2jQbsG4A5dw+3N20ulUlu5if9ka0cUYwQFvdOvfq3qx7VTm\nY/1y\r\n=ioMl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICIAG0u1m2zSm1FEJNWaEZDRMN8C6JfHX7CG7pEvnBnnAiBVg+Z5I3+gJSfaLrynbZW/B62vhoNh3NV9++pLea8Cdw=="}]},"maintainers":[{"name":"adam_fu","email":"foureyed@qq.com"},{"name":"murrayee","email":"murrayee@163.com"},{"name":"yyppaag","email":"yyppaag@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-zss-rich-text-editor_1.0.2_1591845807594_0.9761917007337888"},"_hasShrinkwrap":false},"1.0.3":{"name":"@bilingo.com/react-native-zss-rich-text-editor","repository":{"type":"git","url":"https://git.links123.net/npm/react-native-zss-rich-text-editor.git"},"version":"1.0.3","description":"React Native Wrapper for ZSSRichTextEditor","main":"index.js","license":"SEE LICENSE IN LICENSE","peerDependencies":{"react":"*","react-native":">=0.31.0"},"gitHead":"807a41f3bb48381c3fe64974c86f39d6738d0638","_id":"@bilingo.com/react-native-zss-rich-text-editor@1.0.3","_npmVersion":"6.4.1","_nodeVersion":"10.15.3","_npmUser":{"name":"adam_fu","email":"foureyed@qq.com"},"dist":{"integrity":"sha512-z5ex4egb/hu5dfwKIZKdcuptvVJsxnUkySI9J1Rki3L8tKojBpk9bJLrT/8SFqEs1vHit1GZbwI+5NCBqBgOuw==","shasum":"c03c52fb2a9f6a0f1d118f2b642c69f8cfceafdd","tarball":"https://registry.npmjs.org/@bilingo.com/react-native-zss-rich-text-editor/-/react-native-zss-rich-text-editor-1.0.3.tgz","fileCount":9,"unpackedSize":184233,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4du0CRA9TVsSAnZWagAAgFUQAIAjNdenE6vXVcu6ZSWH\nZAKhYa6rf0j60s3DwOLM7S2i6XLu2lmAoth/s9DBQlY9EAQfUW2Fb5YANzWT\n0dunsBEv8NuV8Prxy5RHFodhyWLTcqrkvQLHWzMeQrIIOpL3bAddoFKDwbpZ\nLmbmto9Y4fPq7Rj/rxPYADdnEt8HaU0sC4ua4BRgvU49FDlyDNTgWb7V5/Dq\nCApli7ui7vzqchZSIH3wpJcKISiXdtmeTzTO7aiGwPDZkK9K0tt31dKFEy0u\n2ndQT5PUCAtlUDXqtLOQd7EPefg2T+6k/G1PbwRfNa+dLpwxRV6I/klpNNzb\nyqYRIDeIqFLQvwSb3yf+EaAal0bvcce49ge6dXHOUP5uxi8oLxYRLiqxg8Z7\nAus9YyXFZohyFfnvBVjss7qNzMrAYudi5eH1K9usQ1IToplQLMk1Ga5jtqgX\nImL+JLwFnAFYKAOlZL2sy1XfwbWBFnt7fRWD/i2SeLVdaEWb96wDJKn0jDlG\n+z4iWIz5GOKAlM1za9tApwk4cNoErYijStdXVI3vZVIWteocMXCf2LrVZtRN\nQPlVcEkRdsJkGNQM9ctHxLa+8nCnh7zN6hW0SQIGCuokq+eod6heCZW8hNVC\nHuS44QUlCfuq8aYzmB3Og8tmTL26SGNHqaFB/b9EjqvHCdV5rdXQEtsiRP+1\n80jM\r\n=Xovp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD0Bmg1WCOfkS+NVgbYPf6bYGZMBEh63lbFRF5IxUL40wIgWbEvOAdvxKoiUDAvPju+tPJhVvIbLDSvBdUefMsDedE="}]},"maintainers":[{"name":"adam_fu","email":"foureyed@qq.com"},{"name":"murrayee","email":"murrayee@163.com"},{"name":"yyppaag","email":"yyppaag@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-zss-rich-text-editor_1.0.3_1591860148004_0.2533520128587652"},"_hasShrinkwrap":false}},"time":{"created":"2020-03-01T14:16:43.567Z","1.0.0":"2020-03-01T14:16:43.916Z","modified":"2022-04-04T18:48:47.847Z","1.0.2":"2020-06-11T03:23:27.764Z","1.0.3":"2020-06-11T07:22:28.188Z"},"maintainers":[{"name":"adam_fu","email":"foureyed@qq.com"},{"name":"murrayee","email":"murrayee@163.com"},{"name":"yyppaag","email":"yyppaag@gmail.com"}],"description":"React Native Wrapper for ZSSRichTextEditor","repository":{"type":"git","url":"https://git.links123.net/npm/react-native-zss-rich-text-editor.git"},"license":"SEE LICENSE IN LICENSE","readme":"# React Native Rich Text Editor\n\nA fully functional Rich Text Editor for both Android and iOS, based off the [ZSSRichTextEditor](https://github.com/nnhubbard/ZSSRichTextEditor/tree/master/ZSSRichTextEditor) project. \n\n## Installation\n\n```\nnpm i --save react-native-zss-rich-text-editor\n```\n\nOn Android, add the following to the end of your `android/app/build.gradle`\n\n```groovy\nproject.afterEvaluate {\n    apply from: '../../node_modules/react-native-zss-rich-text-editor/htmlCopy.gradle';\n    copyEditorHtmlToAppAssets(file('../../node_modules/react-native-zss-rich-text-editor'))\n}\n```\n\nAlso, follow instructions [here](https://github.com/alinz/react-native-webview-bridge) to add the native `react-native-webview-bridge-updated` dependency.\n\n\n## Usage\n\n`react-native-zss-rich-text-editor` exports two Components and one const dictionary:\n\n## `RichTextEditor`\n\nThe editor component. Simply place this component in your view hierarchy to receive a fully functional Rich text Editor.\n\n`RichTextEditor` takes the following optional props:\n\n* `initialTitleHTML`\n\n\tHTML that will be rendered in the title section as soon as the component loads.\n* `initialContentHTML`\n\n\tHTML that will be rendered in the content section on load.\n* `titlePlaceholder`\n\n\tText that will be used as a placeholder when no text is present in the title section.\n* `contentPlaceholder `\n\t\n\tText that will be used as a placeholder when no text is present in the content section.\n* `customCSS `\n\n\tAny custom CSS styles that you want to inject to the editor.\n* `editorInitializedCallback `\n\n\tA function that will be called when the editor has been initialized.\n\n\n`RichTextEditor` also has methods that can be used on its `ref` to  set styling at the current selection or cursor position:\n\n*  `setBold() `\n*  `setItalic()`\n*  `setUnderline() `\n*  `heading1() `\n*  `heading2() `\n*  `heading3() `\n*  `heading4() `\n*  `heading5() `\n*  `heading6() `\n*  `setParagraph() `\n*  `removeFormat() `\n*  `alignLeft() `\n*  `alignCenter() `\n*  `alignRight() `\n*  `alignFull() `\n*  `insertBulletsList() `\n*  `insertOrderedList() `\n*  `insertLink(url, title) `\n*  `updateLink(url, title) `\n*  `insertImage(attributes) `\n*  `setSubscript() `\n*  `setSuperscript()`\n*  `setStrikethrough() `\n*  `setHR() `\n*  `setIndent()`\n*  `setOutdent() `\n*  `setBackgroundColor(color) `\n*  `setTextColor(color) `\n\nThis method shows a dialog for setting a link title and url, that will be inserted at the current cursor location.\n\n* `showLinkDialog(optionalTitle = '', optionalUrl = '')` \n\nTo adjust content, placeholders or css, use these methods\n\n*  `setTitlePlaceholder(placeholder) `\n*  `setContentPlaceholder(placeholder)`\n*  `setCustomCSS(css) `\n*  `setTitleHTML(html)` \n*  `setContentHTML(html) `\n\nThese methods are used when adding content such as images or links that will intefere with the cursor position. `prepareInsert` saves  the current selection, and `restoreSelection` will replace it after the insertion is done. It is called implicitly by `insertImage` and `insertLink` so they should probably never be called directly.\n\n*  `prepareInsert() `\n*  `restoreSelection() `\n\nTo get the content or title HTML, use these **asynchronous** methods.\n\n*  `async getTitleHtml() `\n*  `async getTitleText()`\n*  `async getContentHtml() `\n*  `async getSelectedText() `\n\nTo focus or blur sections, use these methods\n\n* `focusTitle()`\n* `focusContent()` \n*  `blurTitleEditor() `\n*  `blurContentEditor() `\n\nTo know when the title or content are in focus, use the following methods.\n\n*  `setTitleFocusHandler(callbackHandler) `\n*  `setContentFocusHandler(callbackHandler) `\n\nThis method registers a function that will get called whenver the cursor position changes or a change is made to the styling of the editor at the cursor's position., The callback will be called with an array of `actions` that are active at the cusor position, allowing a toolbar to respond to changes.\n\n*  `registerToolbar(listener)` \n\n### Example Usage:\n\n```javascript\n<RichTextEditor\n  ref={(r) => this.richtext = r}\n  initialTitleHTML={'Title!!'}\n  initialContentHTML={'Hello <b>World</b> <p>this is a new paragraph</p> <p>this is another new paragraph</p>'}\n  editorInitializedCallback={() => this.onEditorInitialized()}\n/>\n```\n\n![RichTextEditor](readme/editor.png)\n\n## `RichTextToolbar`\n\nThis is a Component that provides a toolbar for easily controlling an editor. It is designed to be used together with a `RichTextEditor` component.\n\nThe `RichTextToolbar` has one required property: \n\n* `getEditor()`\n\nWhich must provide a **function** that returns a `ref` to a `RichTextEditor` component. \n\nThis is because the `ref` is not created until after the first render, before which the toolbar is rendered. This means that any `ref` passed directly will inevitably be passed as `undefined`.\n\nOther props supported by the `RichTextToolbar` component are:\n\n* `actions`\n\n\tAn `array` of `actions` to be provided by this toolbar. The default actions are: \n\t* `actions.insertImage`\n  \t* `actions.setBold`\n  \t* `actions.setItalic`\n  \t* `actions.insertBulletsList`\n  \t* `actions.insertOrderedList`\n  \t* `actions.insertLink`\n \n* `onPressAddLink`\n* `onPressAddImage`\n\n\tFunctions called when the `addLink` or `addImage `actions are tapped. \n\t\n* `selectedButtonStyle`\n* `iconTint`\n* `selectedIconTint`\n* `unselectedButtonStyle`\n\n\tThese provide options for styling action buttons.\n\n* `renderAction`\n\n\tAltenatively, you can provide a render function that will be used instead of the default, so you can fully control the tollbar design.\n\t\n\t\n* `iconMap` \n\n\t`RichTextToolbar` comes with default icons for the default actions it renders. To override those, or to add icons for non-default actions, provide them in a dictionary to this prop.\n\t\n\n### Example Usage:\n\n```javascript\n<RichTextToolbar\n\tgetEditor={() => this.richtext}\n/>\n```\n\n![RichTextEditor](readme/toolbar.png)\n\n![RichTextEditor](readme/toolbar_selected.png)\n\n\n## `actions`\n\nThis is a set of consts of all supported actions. These will be passed in arrays to all callbacks registered with the editor using  the `registerToolbar()` method.\n\n\t{\n\t\tsetTitleHtml: 'SET_TITLE_HTML',\n\t  \tsetContentHtml: 'SET_CONTENT_HTML',\n\t  \tgetTitleHtml: 'GET_TITLE_HTML',\n\t  \tgetTitleText: 'GET_TITLE_TEXT',\n\t \tgetContentHtml: 'GET_CONTENT_HTML',\n\t  \tgetSelectedText: 'GET_SELECTED_TEXT',\n\t  \tblurTitleEditor: 'BLUR_TITLE_EDITOR',\n\t  \tblurContentEditor: 'BLUR_CONTENT_EDITOR',\n\t  \tfocusTitle: 'FOCUS_TITLE',\n\t  \tfocusContent: 'FOCUS_CONTENT',\n\t\t\n\t  \tsetBold: 'bold',\n\t  \tsetItalic: 'italic',\n\t  \tsetUnderline: 'underline',\n\t  \theading1: 'h1',\n\t  \theading2: 'h2',\n\t  \theading3: 'h3',\n\t  \theading4: 'h4',\n\t  \theading5: 'h5',\n\t  \theading6: 'h6',\n\t  \tsetParagraph: 'SET_PARAGRAPH',\n\t  \tremoveFormat: 'REMOVE_FORMAT',\n\t  \talignLeft: 'justifyLeft',\n\t  \talignCenter: 'justifyCenter',\n\t  \talignRight: 'justifyRight',\n\t  \talignFull: 'justifyFull',\n\t  \tinsertBulletsList: 'unorderedList',\n\t  \tinsertOrderedList: 'orderedList',\n\t  \tinsertLink: 'INST_LINK',\n\t  \tupdateLink: 'UPDATE_LINK',\n\t  \tinsertImage: 'INST_IMAGE',\n\t  \tsetSubscript: 'subscript',\n\t  \tsetSuperscript: 'superscript',\n\t  \tsetStrikethrough: 'strikeThrough',\n\t  \tsetHR: 'horizontalRule',\n\t  \tsetIndent: 'indent',\n\t  \tsetOutdent: 'outdent',\n\t  \tsetTitlePlaceholder: 'SET_TITLE_PLACEHOLDER',\n\t  \tsetContentPlaceholder: 'SET_CONTENT_PLACEHOLDER',\n\t  \tsetTitleFocusHandler: 'SET_TITLE_FOCUS_HANDLER',\n\t  \tsetContentFocusHandler: 'SET_CONTENT_FOCUS_HANDLER',\n\t  \tprepareInsert: 'PREPARE_INSERT',\n\t  \trestoreSelection: 'RESTORE_SELECTION',\n\t  \tsetCustomCSS: 'SET_CUSTOM_CSS',\n\t  \tsetTextColor: 'SET_TEXT_COLOR',\n\t  \tsetBackgroundColor: 'SET_BACKGROUND_COLOR',\n  \t}\n\n\n## Attribution\n\n`react-native-zss-rich-text-editor` is a wrapper around the amazing [ZSSRichTextEditor](https://github.com/nnhubbard/ZSSRichTextEditor/tree/master/ZSSRichTextEditor) project. It also communicates with the editor using (a tiny fork) of the awesome [react-native-webview-bridge](https://github.com/alinz/react-native-webview-bridge) project.\n","readmeFilename":"README.md"}