UNPKG

react-quill-ver2

Version:
2 lines 4.67 kB
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var k=require('quill');require('highlight.js/styles/github.css'),require('quill/dist/quill.snow.css'),require('quill/dist/quill.bubble.css');var react=require('react'),y=require('highlight.js'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var k__default=/*#__PURE__*/_interopDefault(k);var y__default=/*#__PURE__*/_interopDefault(y);var p=react.forwardRef(({value:a,defaultValue:r,onChange:u,options:b={},readOnly:f=false,placeholder:q,theme:N="snow",modules:o,formats:d,style:v,className:Q},R)=>{let s=react.useRef(null),l=react.useRef(null);return react.useEffect(()=>{if(!s.current)return;l.current&&(l.current=null);let n={theme:N,modules:{...o||{},...o?.syntax?{syntax:{hljs:y__default.default}}:{},toolbar:o?.toolbar||{container:"#quill-toolbar"}},formats:d||["background","bold","color","font","code","italic","link","size","strike","script","underline","blockquote","header","indent","list","align","direction","code-block","formula","image","video"],placeholder:q,readOnly:f,...b};return l.current=new k__default.default(s.current,n),r&&(l.current.root.innerHTML=r),a&&(l.current.root.innerHTML=a),u&&l.current.on("text-change",()=>{u(l.current?.root.innerHTML||"");}),()=>{l.current&&(l.current=null);}},[]),react.useEffect(()=>{if(l.current&&a!==void 0){let n=l.current.root.innerHTML;a!==n&&(l.current.root.innerHTML=a);}},[a]),react.useImperativeHandle(R,()=>({getEditor:()=>l.current})),jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[!o?.toolbar&&jsxRuntime.jsxs("div",{id:"quill-toolbar",children:[jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsxs("select",{className:"ql-size",defaultValue:"",children:[jsxRuntime.jsx("option",{value:"small"}),jsxRuntime.jsx("option",{value:""}),jsxRuntime.jsx("option",{value:"large"}),jsxRuntime.jsx("option",{value:"huge"})]})}),jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsxs("select",{className:"ql-header",defaultValue:"",children:[jsxRuntime.jsx("option",{value:"1"}),jsxRuntime.jsx("option",{value:"2"}),jsxRuntime.jsx("option",{value:"3"}),jsxRuntime.jsx("option",{value:"4"}),jsxRuntime.jsx("option",{value:"5"}),jsxRuntime.jsx("option",{value:"6"}),jsxRuntime.jsx("option",{value:""})]})}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-bold"}),jsxRuntime.jsx("button",{className:"ql-italic"}),jsxRuntime.jsx("button",{className:"ql-underline"}),jsxRuntime.jsx("button",{className:"ql-strike"})]}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-blockquote"}),jsxRuntime.jsx("button",{className:"ql-code-block"})]}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-header",value:"1"}),jsxRuntime.jsx("button",{className:"ql-header",value:"2"})]}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-list",value:"ordered"}),jsxRuntime.jsx("button",{className:"ql-list",value:"bullet"}),jsxRuntime.jsx("button",{className:"ql-list",value:"check"})]}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-script",value:"sub"}),jsxRuntime.jsx("button",{className:"ql-script",value:"super"})]}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-indent",value:"-1"}),jsxRuntime.jsx("button",{className:"ql-indent",value:"+1"})]}),jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsx("button",{className:"ql-direction",value:"rtl"})}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("select",{className:"ql-color"}),jsxRuntime.jsx("select",{className:"ql-background"})]}),jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsx("select",{className:"ql-font"})}),jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsx("select",{className:"ql-align"})}),jsxRuntime.jsx("span",{className:"ql-formats",children:jsxRuntime.jsx("button",{className:"ql-clean"})}),jsxRuntime.jsxs("span",{className:"ql-formats",children:[jsxRuntime.jsx("button",{className:"ql-link"}),jsxRuntime.jsx("button",{className:"ql-image"}),jsxRuntime.jsx("button",{className:"ql-video"}),jsxRuntime.jsx("button",{className:"ql-formula"})]})]}),jsxRuntime.jsx("div",{ref:s,style:v,className:Q})]})});p.displayName="ReactQuill";var m=p;var j=m;Object.defineProperty(exports,"Quill",{enumerable:true,get:function(){return k__default.default}});exports.default=j;//# sourceMappingURL=index.cjs.map //# sourceMappingURL=index.cjs.map