primereact 9.5.0 → 9.6.1

package/editor/editor.esm.js

@@ -1,21 +1,8 @@
 import * as React from 'react';
 import { useMountEffect, useUpdateEffect } from 'primereact/hooks';
-import { ObjectUtils, DomHandler, classNames } from 'primereact/utils';
-
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
+import { DomHandler, classNames, mergeProps } from 'primereact/utils';
+import { ComponentBase } from 'primereact/componentbase';
+import { PrimeReactContext } from 'primereact/api';
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
@@ -58,7 +45,7 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 
-var EditorBase = {
+var EditorBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'Editor',
     id: null,
@@ -77,14 +64,8 @@ var EditorBase = {
     onLoad: null,
     maxLength: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return ObjectUtils.getMergedProps(props, EditorBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return ObjectUtils.getDiffProps(props, EditorBase.defaultProps);
   }
-};
+});
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -96,7 +77,12 @@ var QuillJS = function () {
   }
 }();
 var Editor = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (inProps, ref) {
-  var props = EditorBase.getProps(inProps);
+  var context = React.useContext(PrimeReactContext);
+  var props = EditorBase.getProps(inProps, context);
+  var _EditorBase$setMetaDa = EditorBase.setMetaData({
+      props: props
+    }),
+    ptm = _EditorBase$setMetaDa.ptm;
   var elementRef = React.useRef(null);
   var contentRef = React.useRef(null);
   var toolbarRef = React.useRef(null);
@@ -212,112 +198,105 @@ var Editor = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (in
     };
   });
   var createToolbarHeader = function createToolbarHeader() {
+    var toolbarProps = mergeProps({
+      ref: toolbarRef,
+      className: 'p-editor-toolbar'
+    }, ptm('toolbar'));
     if (props.showHeader === false) {
       return null;
     } else if (props.headerTemplate) {
-      return /*#__PURE__*/React.createElement("div", {
-        ref: toolbarRef,
-        className: "p-editor-toolbar"
-      }, props.headerTemplate);
+      return /*#__PURE__*/React.createElement("div", toolbarProps, props.headerTemplate);
     } else {
-      return /*#__PURE__*/React.createElement("div", {
-        ref: toolbarRef,
-        className: "p-editor-toolbar"
-      }, /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("select", {
-        className: "ql-header",
-        defaultValue: "0"
-      }, /*#__PURE__*/React.createElement("option", {
-        value: "1"
-      }, "Heading"), /*#__PURE__*/React.createElement("option", {
-        value: "2"
-      }, "Subheading"), /*#__PURE__*/React.createElement("option", {
-        value: "0"
-      }, "Normal")), /*#__PURE__*/React.createElement("select", {
-        className: "ql-font"
-      }, /*#__PURE__*/React.createElement("option", null), /*#__PURE__*/React.createElement("option", {
-        value: "serif"
-      }), /*#__PURE__*/React.createElement("option", {
-        value: "monospace"
-      }))), /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-bold",
-        "aria-label": "Bold"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-italic",
-        "aria-label": "Italic"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-underline",
-        "aria-label": "Underline"
-      })), /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("select", {
-        className: "ql-color"
-      }), /*#__PURE__*/React.createElement("select", {
-        className: "ql-background"
-      })), /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-list",
-        value: "ordered",
-        "aria-label": "Ordered List"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-list",
-        value: "bullet",
-        "aria-label": "Unordered List"
-      }), /*#__PURE__*/React.createElement("select", {
-        className: "ql-align"
-      }, /*#__PURE__*/React.createElement("option", {
+      var getMergeProps = function getMergeProps(params, key) {
+        return mergeProps(params && _objectSpread({}, params), ptm(key));
+      };
+      var formatsProps = mergeProps({
+        className: 'ql-formats'
+      }, ptm('formats'));
+      return /*#__PURE__*/React.createElement("div", toolbarProps, /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("select", getMergeProps({
+        className: 'ql-header',
+        defaultValue: '0'
+      }, 'select'), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: '1'
+      }, 'option'), "Heading"), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: '2'
+      }, 'option'), "Subheading"), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: '0'
+      }, 'option'), "Normal")), /*#__PURE__*/React.createElement("select", getMergeProps({
+        className: 'ql-font'
+      }, 'select'), /*#__PURE__*/React.createElement("option", getMergeProps(undefined, 'option')), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: 'serif'
+      }, 'option')), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: 'monospace'
+      }, 'option')))), /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-bold',
+        'aria-label': 'Bold'
+      }, 'button')), /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-italic',
+        'aria-label': 'Italic'
+      }, 'button')), /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-underline',
+        'aria-label': 'Underline'
+      }, 'button'))), /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("select", getMergeProps({
+        className: 'ql-color'
+      }, 'select')), /*#__PURE__*/React.createElement("select", getMergeProps({
+        className: 'ql-background'
+      }, 'select'))), /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-list',
+        value: 'ordered',
+        'aria-label': 'Ordered List'
+      }, 'button')), /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-list',
+        value: 'bullet',
+        'aria-label': 'Unordered List'
+      }, 'button')), /*#__PURE__*/React.createElement("select", getMergeProps({
+        className: 'ql-align'
+      }, 'select'), /*#__PURE__*/React.createElement("option", getMergeProps({
         defaultValue: true
-      }), /*#__PURE__*/React.createElement("option", {
-        value: "center"
-      }), /*#__PURE__*/React.createElement("option", {
-        value: "right"
-      }), /*#__PURE__*/React.createElement("option", {
-        value: "justify"
-      }))), /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-link",
-        "aria-label": "Insert Link"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-image",
-        "aria-label": "Insert Image"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-code-block",
-        "aria-label": "Insert Code Block"
-      })), /*#__PURE__*/React.createElement("span", {
-        className: "ql-formats"
-      }, /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: "ql-clean",
-        "aria-label": "Remove Styles"
-      })));
+      }, 'option')), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: 'center'
+      }, 'option')), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: 'right'
+      }, 'option')), /*#__PURE__*/React.createElement("option", getMergeProps({
+        value: 'justify'
+      }, 'option')))), /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-link',
+        'aria-label': 'Insert Link'
+      }, 'button')), /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-image',
+        'aria-label': 'Insert Image'
+      }, 'button')), /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-code-block',
+        'aria-label': 'Insert Code Block'
+      }, 'button'))), /*#__PURE__*/React.createElement("span", formatsProps, /*#__PURE__*/React.createElement("button", getMergeProps({
+        type: 'button',
+        className: 'ql-clean',
+        'aria-label': 'Remove Styles'
+      }, 'button'))));
     }
   };
-  var otherProps = EditorBase.getOtherProps(props);
   var className = classNames('p-component p-editor-container', props.className);
   var header = createToolbarHeader();
-  var content = /*#__PURE__*/React.createElement("div", {
+  var contentProps = mergeProps({
     ref: contentRef,
-    className: "p-editor-content",
+    className: 'p-editor-content',
     style: props.style
-  });
-  return /*#__PURE__*/React.createElement("div", _extends({
+  }, ptm('content'));
+  var content = /*#__PURE__*/React.createElement("div", contentProps);
+  var rootProps = mergeProps({
     id: props.id,
     ref: elementRef,
     className: className
-  }, otherProps), header, content);
+  }, EditorBase.getOtherProps(props), ptm('root'));
+  return /*#__PURE__*/React.createElement("div", rootProps, header, content);
 }));
 Editor.displayName = 'Editor';
 

package/editor/editor.esm.min.js

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

package/editor/editor.js

@@ -1,5 +1,5 @@
 this.primereact = this.primereact || {};
-this.primereact.editor = (function (exports, React, hooks, utils) {
+this.primereact.editor = (function (exports, React, hooks, utils, componentbase, api) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -22,21 +22,6 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
 
   var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-  function _extends() {
-    _extends = Object.assign ? Object.assign.bind() : function (target) {
-      for (var i = 1; i < arguments.length; i++) {
-        var source = arguments[i];
-        for (var key in source) {
-          if (Object.prototype.hasOwnProperty.call(source, key)) {
-            target[key] = source[key];
-          }
-        }
-      }
-      return target;
-    };
-    return _extends.apply(this, arguments);
-  }
-
   function _typeof(obj) {
     "@babel/helpers - typeof";
 
@@ -78,7 +63,7 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
     return obj;
   }
 
-  var EditorBase = {
+  var EditorBase = componentbase.ComponentBase.extend({
     defaultProps: {
       __TYPE: 'Editor',
       id: null,
@@ -97,14 +82,8 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
       onLoad: null,
       maxLength: null,
       children: undefined
-    },
-    getProps: function getProps(props) {
-      return utils.ObjectUtils.getMergedProps(props, EditorBase.defaultProps);
-    },
-    getOtherProps: function getOtherProps(props) {
-      return utils.ObjectUtils.getDiffProps(props, EditorBase.defaultProps);
     }
-  };
+  });
 
   function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
   function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -116,7 +95,12 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
     }
   }();
   var Editor = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
-    var props = EditorBase.getProps(inProps);
+    var context = React__namespace.useContext(api.PrimeReactContext);
+    var props = EditorBase.getProps(inProps, context);
+    var _EditorBase$setMetaDa = EditorBase.setMetaData({
+        props: props
+      }),
+      ptm = _EditorBase$setMetaDa.ptm;
     var elementRef = React__namespace.useRef(null);
     var contentRef = React__namespace.useRef(null);
     var toolbarRef = React__namespace.useRef(null);
@@ -232,112 +216,105 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
       };
     });
     var createToolbarHeader = function createToolbarHeader() {
+      var toolbarProps = utils.mergeProps({
+        ref: toolbarRef,
+        className: 'p-editor-toolbar'
+      }, ptm('toolbar'));
       if (props.showHeader === false) {
         return null;
       } else if (props.headerTemplate) {
-        return /*#__PURE__*/React__namespace.createElement("div", {
-          ref: toolbarRef,
-          className: "p-editor-toolbar"
-        }, props.headerTemplate);
+        return /*#__PURE__*/React__namespace.createElement("div", toolbarProps, props.headerTemplate);
       } else {
-        return /*#__PURE__*/React__namespace.createElement("div", {
-          ref: toolbarRef,
-          className: "p-editor-toolbar"
-        }, /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("select", {
-          className: "ql-header",
-          defaultValue: "0"
-        }, /*#__PURE__*/React__namespace.createElement("option", {
-          value: "1"
-        }, "Heading"), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "2"
-        }, "Subheading"), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "0"
-        }, "Normal")), /*#__PURE__*/React__namespace.createElement("select", {
-          className: "ql-font"
-        }, /*#__PURE__*/React__namespace.createElement("option", null), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "serif"
-        }), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "monospace"
-        }))), /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-bold",
-          "aria-label": "Bold"
-        }), /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-italic",
-          "aria-label": "Italic"
-        }), /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-underline",
-          "aria-label": "Underline"
-        })), /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("select", {
-          className: "ql-color"
-        }), /*#__PURE__*/React__namespace.createElement("select", {
-          className: "ql-background"
-        })), /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-list",
-          value: "ordered",
-          "aria-label": "Ordered List"
-        }), /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-list",
-          value: "bullet",
-          "aria-label": "Unordered List"
-        }), /*#__PURE__*/React__namespace.createElement("select", {
-          className: "ql-align"
-        }, /*#__PURE__*/React__namespace.createElement("option", {
+        var getMergeProps = function getMergeProps(params, key) {
+          return utils.mergeProps(params && _objectSpread({}, params), ptm(key));
+        };
+        var formatsProps = utils.mergeProps({
+          className: 'ql-formats'
+        }, ptm('formats'));
+        return /*#__PURE__*/React__namespace.createElement("div", toolbarProps, /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("select", getMergeProps({
+          className: 'ql-header',
+          defaultValue: '0'
+        }, 'select'), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: '1'
+        }, 'option'), "Heading"), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: '2'
+        }, 'option'), "Subheading"), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: '0'
+        }, 'option'), "Normal")), /*#__PURE__*/React__namespace.createElement("select", getMergeProps({
+          className: 'ql-font'
+        }, 'select'), /*#__PURE__*/React__namespace.createElement("option", getMergeProps(undefined, 'option')), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: 'serif'
+        }, 'option')), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: 'monospace'
+        }, 'option')))), /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-bold',
+          'aria-label': 'Bold'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-italic',
+          'aria-label': 'Italic'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-underline',
+          'aria-label': 'Underline'
+        }, 'button'))), /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("select", getMergeProps({
+          className: 'ql-color'
+        }, 'select')), /*#__PURE__*/React__namespace.createElement("select", getMergeProps({
+          className: 'ql-background'
+        }, 'select'))), /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-list',
+          value: 'ordered',
+          'aria-label': 'Ordered List'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-list',
+          value: 'bullet',
+          'aria-label': 'Unordered List'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("select", getMergeProps({
+          className: 'ql-align'
+        }, 'select'), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
           defaultValue: true
-        }), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "center"
-        }), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "right"
-        }), /*#__PURE__*/React__namespace.createElement("option", {
-          value: "justify"
-        }))), /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-link",
-          "aria-label": "Insert Link"
-        }), /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-image",
-          "aria-label": "Insert Image"
-        }), /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-code-block",
-          "aria-label": "Insert Code Block"
-        })), /*#__PURE__*/React__namespace.createElement("span", {
-          className: "ql-formats"
-        }, /*#__PURE__*/React__namespace.createElement("button", {
-          type: "button",
-          className: "ql-clean",
-          "aria-label": "Remove Styles"
-        })));
+        }, 'option')), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: 'center'
+        }, 'option')), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: 'right'
+        }, 'option')), /*#__PURE__*/React__namespace.createElement("option", getMergeProps({
+          value: 'justify'
+        }, 'option')))), /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-link',
+          'aria-label': 'Insert Link'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-image',
+          'aria-label': 'Insert Image'
+        }, 'button')), /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-code-block',
+          'aria-label': 'Insert Code Block'
+        }, 'button'))), /*#__PURE__*/React__namespace.createElement("span", formatsProps, /*#__PURE__*/React__namespace.createElement("button", getMergeProps({
+          type: 'button',
+          className: 'ql-clean',
+          'aria-label': 'Remove Styles'
+        }, 'button'))));
       }
     };
-    var otherProps = EditorBase.getOtherProps(props);
     var className = utils.classNames('p-component p-editor-container', props.className);
     var header = createToolbarHeader();
-    var content = /*#__PURE__*/React__namespace.createElement("div", {
+    var contentProps = utils.mergeProps({
       ref: contentRef,
-      className: "p-editor-content",
+      className: 'p-editor-content',
       style: props.style
-    });
-    return /*#__PURE__*/React__namespace.createElement("div", _extends({
+    }, ptm('content'));
+    var content = /*#__PURE__*/React__namespace.createElement("div", contentProps);
+    var rootProps = utils.mergeProps({
       id: props.id,
       ref: elementRef,
       className: className
-    }, otherProps), header, content);
+    }, EditorBase.getOtherProps(props), ptm('root'));
+    return /*#__PURE__*/React__namespace.createElement("div", rootProps, header, content);
   }));
   Editor.displayName = 'Editor';
 
@@ -347,4 +324,4 @@ this.primereact.editor = (function (exports, React, hooks, utils) {
 
   return exports;
 
-})({}, React, primereact.hooks, primereact.utils);
+})({}, React, primereact.hooks, primereact.utils, primereact.componentbase, primereact.api);