@bbl-digital/snorre 4.0.88 → 4.0.89

package/dist/bundle.js

@@ -35435,7 +35435,7 @@ to {top: 100vh;}
   }) => {
     const [quill, setQuill] = React.useState(null);
     const isMounted = React.useRef(false);
-    const editorRef = React.useRef(null);
+    const containerRef = React.useRef(null);
     const {
       alert
     } = react.useTheme();
@@ -35454,8 +35454,10 @@ to {top: 100vh;}
       }
     }, [quill, onChange]);
     React.useEffect(() => {
-      if (editorRef.current && !isMounted.current) {
-        const quillInstance = new Quill__default["default"](editorRef.current, {
+      if (!isMounted.current) {
+        const editor = document.createElement('div');
+        containerRef.current?.appendChild(editor);
+        const quillInstance = new Quill__default["default"](editor, {
           theme: 'snow',
           modules,
           formats,
@@ -35470,7 +35472,7 @@ to {top: 100vh;}
         applySizes(quillInstance);
         setQuill(quillInstance);
       }
-    }, [editorRef, modules, formats, placeholder, readOnly, onFocus, onBlur, initialValue, handleChange]);
+    }, []);
     React.useEffect(() => {
       if (quill && disabled) {
         quill.disable();
@@ -35515,7 +35517,6 @@ to {top: 100vh;}
       width && (quill.root.style.width = `${width}px`);
       height && (quill.root.style.height = `${height}px`);
       minWidth && (quill.root.style.minWidth = `${minWidth}px`);
-      console.log('applied sizes', quill.root.style);
     };
     return jsxRuntime.jsxs("div", {
       css: theme => [styles.default(theme, maxHeight)],
@@ -35531,7 +35532,7 @@ to {top: 100vh;}
           ...style
         },
         children: jsxRuntime.jsx("div", {
-          ref: editorRef
+          ref: containerRef
         })
       }), invalidMessage && jsxRuntime.jsx(ErrorWrapper, {
         children: jsxRuntime.jsxs(Text, {

package/esm/core/QuillEditor/index.js

@@ -61,7 +61,7 @@ const QuillEditor = ({
 }) => {
   const [quill, setQuill] = useState(null);
   const isMounted = useRef(false);
-  const editorRef = useRef(null);
+  const containerRef = useRef(null);
   const {
     alert
   } = useTheme();
@@ -80,8 +80,10 @@ const QuillEditor = ({
     }
   }, [quill, onChange]);
   useEffect(() => {
-    if (editorRef.current && !isMounted.current) {
-      const quillInstance = new Quill(editorRef.current, {
+    if (!isMounted.current) {
+      const editor = document.createElement('div');
+      containerRef.current?.appendChild(editor);
+      const quillInstance = new Quill(editor, {
         theme: 'snow',
         modules,
         formats,
@@ -96,7 +98,7 @@ const QuillEditor = ({
       applySizes(quillInstance);
       setQuill(quillInstance);
     }
-  }, [editorRef, modules, formats, placeholder, readOnly, onFocus, onBlur, initialValue, handleChange]);
+  }, []);
   useEffect(() => {
     if (quill && disabled) {
       quill.disable();
@@ -141,7 +143,6 @@ const QuillEditor = ({
     width && (quill.root.style.width = `${width}px`);
     height && (quill.root.style.height = `${height}px`);
     minWidth && (quill.root.style.minWidth = `${minWidth}px`);
-    console.log('applied sizes', quill.root.style);
   };
   return _jsxs("div", {
     css: theme => [styles.default(theme, maxHeight)],
@@ -157,7 +158,7 @@ const QuillEditor = ({
         ...style
       },
       children: _jsx("div", {
-        ref: editorRef
+        ref: containerRef
       })
     }), invalidMessage && _jsx(ErrorWrapper, {
       children: _jsxs(Text, {

package/jest.config.js

@@ -23,7 +23,12 @@ module.exports = {
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
   moduleNameMapper: {
     '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
+    quill: '<rootDir>/node_modules/quill/dist/quill.js',
   },
+  transformIgnorePatterns: [
+    'node_modules/quill',
+    '<rootDir>/src/QuillEditor/Attributors',
+  ],
 
   testEnvironment: 'jsdom',
 }

package/lib/core/QuillEditor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/index.tsx"],"names":[],"mappings":"AAGA,OAAO,2BAA2B,CAAA;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAqC3C,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuK3C,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/index.tsx"],"names":[],"mappings":"AAGA,OAAO,2BAA2B,CAAA;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAqC3C,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8J3C,CAAA;AAED,eAAe,WAAW,CAAA"}

package/lib/core/QuillEditor/index.js

@@ -61,7 +61,7 @@ const QuillEditor = ({
 }) => {
   const [quill, setQuill] = useState(null);
   const isMounted = useRef(false);
-  const editorRef = useRef(null);
+  const containerRef = useRef(null);
   const {
     alert
   } = useTheme();
@@ -80,8 +80,10 @@ const QuillEditor = ({
     }
   }, [quill, onChange]);
   useEffect(() => {
-    if (editorRef.current && !isMounted.current) {
-      const quillInstance = new Quill(editorRef.current, {
+    if (!isMounted.current) {
+      const editor = document.createElement('div');
+      containerRef.current?.appendChild(editor);
+      const quillInstance = new Quill(editor, {
         theme: 'snow',
         modules,
         formats,
@@ -96,7 +98,7 @@ const QuillEditor = ({
       applySizes(quillInstance);
       setQuill(quillInstance);
     }
-  }, [editorRef, modules, formats, placeholder, readOnly, onFocus, onBlur, initialValue, handleChange]);
+  }, []);
   useEffect(() => {
     if (quill && disabled) {
       quill.disable();
@@ -141,7 +143,6 @@ const QuillEditor = ({
     width && (quill.root.style.width = `${width}px`);
     height && (quill.root.style.height = `${height}px`);
     minWidth && (quill.root.style.minWidth = `${minWidth}px`);
-    console.log('applied sizes', quill.root.style);
   };
   return _jsxs("div", {
     css: theme => [styles.default(theme, maxHeight)],
@@ -157,7 +158,7 @@ const QuillEditor = ({
         ...style
       },
       children: _jsx("div", {
-        ref: editorRef
+        ref: containerRef
       })
     }), invalidMessage && _jsx(ErrorWrapper, {
       children: _jsxs(Text, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "4.0.88",
+  "version": "4.0.89",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",