UNPKG

primereact

Version:

PrimeReact is an open source UI library for React featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

2 lines (1 loc) 5.38 kB
import*as e from"react";import{useMountEffect as t,useUpdateEffect as n}from"primereact/hooks";import{DomHandler as r,ObjectUtils as l,classNames as a}from"primereact/utils";function o(){return o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o.apply(this,arguments)}function c(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function u(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function s(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?u(Object(n),!0).forEach((function(t){c(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):u(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var i=function(){try{return Quill}catch(e){return null}}(),m=e.memo(e.forwardRef((function(c,u){var p=e.useRef(null),d=e.useRef(null),f=e.useRef(null),b=e.useRef(null),E=e.useRef(!1);t((function(){if(!E.current){var e={modules:s({toolbar:!!c.showHeader&&f.current},c.modules),placeholder:c.placeholder,readOnly:c.readOnly,theme:c.theme,formats:c.formats};i?(b.current=new Quill(d.current,e),h(),b.current&&b.current.getModule("toolbar")&&c.onLoad&&c.onLoad(b.current)):import("quill").then((function(t){t&&r.isExist(d.current)&&(b.current=t.default?new t.default(d.current,e):new t(d.current,e),h())})).then((function(){b.current&&b.current.getModule("toolbar")&&c.onLoad&&c.onLoad(b.current)})),E.current=!0}}));var h=function(){c.value&&b.current.setContents(b.current.clipboard.convert(c.value)),b.current.on("text-change",(function(e,t,n){var l=d.current.children[0],a=l?l.innerHTML:null,o=b.current.getText();if("<p><br></p>"===a&&(a=null),"api"===n){var u=d.current.children[0],s=document.createElement("div");if(s.innerHTML=c.value||"",r.isEqualElement(u,s))return}if(c.maxLength){var i=b.current.getLength();i>c.maxLength&&b.current.deleteText(c.maxLength,i)}c.onTextChange&&c.onTextChange({htmlValue:a,textValue:o,delta:e,source:n})})),b.current.on("selection-change",(function(e,t,n){c.onSelectionChange&&c.onSelectionChange({range:e,oldRange:t,source:n})}))};n((function(){b.current&&!b.current.hasFocus()&&(c.value?b.current.setContents(b.current.clipboard.convert(c.value)):b.current.setText(""))}),[c.value]),e.useImperativeHandle(u,(function(){return{props:c,getQuill:function(){return b.current},getElement:function(){return p.current},getContent:function(){return d.current},getToolbar:function(){return f.current}}}));var v=l.findDiffKeys(c,m.defaultProps),g=a("p-component p-editor-container",c.className),y=!1===c.showHeader?null:c.headerTemplate?e.createElement("div",{ref:f,className:"p-editor-toolbar"},c.headerTemplate):e.createElement("div",{ref:f,className:"p-editor-toolbar"},e.createElement("span",{className:"ql-formats"},e.createElement("select",{className:"ql-header",defaultValue:"0"},e.createElement("option",{value:"1"},"Heading"),e.createElement("option",{value:"2"},"Subheading"),e.createElement("option",{value:"0"},"Normal")),e.createElement("select",{className:"ql-font"},e.createElement("option",null),e.createElement("option",{value:"serif"}),e.createElement("option",{value:"monospace"}))),e.createElement("span",{className:"ql-formats"},e.createElement("button",{type:"button",className:"ql-bold","aria-label":"Bold"}),e.createElement("button",{type:"button",className:"ql-italic","aria-label":"Italic"}),e.createElement("button",{type:"button",className:"ql-underline","aria-label":"Underline"})),e.createElement("span",{className:"ql-formats"},e.createElement("select",{className:"ql-color"}),e.createElement("select",{className:"ql-background"})),e.createElement("span",{className:"ql-formats"},e.createElement("button",{type:"button",className:"ql-list",value:"ordered","aria-label":"Ordered List"}),e.createElement("button",{type:"button",className:"ql-list",value:"bullet","aria-label":"Unordered List"}),e.createElement("select",{className:"ql-align"},e.createElement("option",{defaultValue:!0}),e.createElement("option",{value:"center"}),e.createElement("option",{value:"right"}),e.createElement("option",{value:"justify"}))),e.createElement("span",{className:"ql-formats"},e.createElement("button",{type:"button",className:"ql-link","aria-label":"Insert Link"}),e.createElement("button",{type:"button",className:"ql-image","aria-label":"Insert Image"}),e.createElement("button",{type:"button",className:"ql-code-block","aria-label":"Insert Code Block"})),e.createElement("span",{className:"ql-formats"},e.createElement("button",{type:"button",className:"ql-clean","aria-label":"Remove Styles"}))),N=e.createElement("div",{ref:d,className:"p-editor-content",style:c.style});return e.createElement("div",o({id:c.id,ref:p,className:g},v),y,N)})));m.displayName="Editor",m.defaultProps={__TYPE:"Editor",id:null,value:null,style:null,className:null,placeholder:null,readOnly:!1,modules:null,formats:null,theme:"snow",showHeader:!0,headerTemplate:null,onTextChange:null,onSelectionChange:null,onLoad:null,maxLength:null};export{m as Editor};